Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/raymondev/electrondocker
Dockerfile and associated files to deploy a Three.js user interface within an Electron application running in a Docker container
https://github.com/raymondev/electrondocker
docker dockerfile dockerfiles-linux electron electron-app linux node-js nodejs three-js threejs threejs-example
Last synced: 19 days ago
JSON representation
Dockerfile and associated files to deploy a Three.js user interface within an Electron application running in a Docker container
- Host: GitHub
- URL: https://github.com/raymondev/electrondocker
- Owner: RaymonDev
- Created: 2024-09-23T12:06:08.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2024-10-24T07:19:55.000Z (22 days ago)
- Last Synced: 2024-10-25T04:42:07.363Z (21 days ago)
- Topics: docker, dockerfile, dockerfiles-linux, electron, electron-app, linux, node-js, nodejs, three-js, threejs, threejs-example
- Language: HTML
- Homepage:
- Size: 17.6 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ElectronDocker
This guide explains how to run an Electron application inside a Docker container using Ubuntu and have the UI rendered on the host machine. The UI utilizes Three.js for rendering 3D graphics.
## Prerequisites
- Docker installed on the host machine.
- X11 forwarding enabled on the host machine (for UI projection).
- An Electron app that is ready to be run using `npm start`.
## Steps
### 1. Build the Docker Image
First, ensure you have the following `Dockerfile` in your project directory:
```Dockerfile
FROM ubuntu:20.04
# Configure timezone and environmenFROM ubuntu:20.04
# Set environment variables to avoid interactive configuration of tzdata
ENV DEBIAN_FRONTEND=noninteractive \
TZ=America/Los_Angeles
# Install Node.js, NPM, and additional dependencies needed for Electron
RUN apt-get update && apt-get install -y \
tzdata \
curl \
libx11-dev \
libxext-dev \
libxrender-dev \
libxtst-dev \
libxrandr-dev \
libasound2-dev \
libgtk-3-dev \
libnss3 \
libxss1 \
libatk-bridge2.0-0 \
libdrm2 \
libgbm1 \
git \
&& apt-get clean
# Install Node.js 18.x (compatible with Electron 32.x)
RUN curl -fsSL https://deb.nodesource.com/setup_18.x | bash - && \
apt-get install -y nodejs
# Set the working directory to /app inside the container
WORKDIR /app
# Copy all files from the host to the /app folder in the container
COPY appw /app
# Install application dependencies
RUN npm install
# Command to run the Electron application using npm start
CMD ["npm", "start"]
```
Build the Docker image with the following command:
```bash
docker build -t electron-app .
```
### 2. Allow X11 Forwarding
To allow the Docker container to connect to your X11 display, run:
```bash
xhost +local:docker
```
### 3. Run the Docker Container
Once the image is built, you can run the Docker container using the following command:
```bash
docker run --rm -it \
--env="DISPLAY" \
--env="XAUTHORITY=$XAUTH" \
--volume="/tmp/.X11-unix:/tmp/.X11-unix:rw" \
electron-app
```