Dockerizing, provide production build load balanced with NGINX #332

.docker/Dockerfile_dependencies

@@ -0,0 +1,14 @@
+# Base image
+FROM node:18
+
+# Set the working directory in the container
+WORKDIR /app
+
+COPY ../package.json ./
+
+# Install app dependencies
+RUN npm install -g pnpm
+
+RUN pnpm install
+
+

.docker/Dockerfile_develop

@@ -0,0 +1,11 @@
+# Base image
+FROM node:18
+
+RUN npm install -g pnpm
+
+# Set the working directory in the container
+WORKDIR /app
+
+COPY .. .
+
+EXPOSE 8080

.docker/Dockerfile_production

@@ -0,0 +1,27 @@
+# Base image
+FROM node:18
+
+# Set the working directory in the container
+WORKDIR /app
+
+# copy src
+COPY .. .
+
+# install pnpm
+RUN npm install -g pnpm
+
+# install initial depenancies
+RUN pnpm install
+
+# install production depencancies
+RUN pnpm install --production
+
+# build
+RUN node build
+
+
+#pull nginx as webser and load balancer
+FROM nginx:stable-alpine3.19-slim
+
+# copy the build files to nginx entry point
+COPY ./public /usr/share/nginx/html

.env

@@ -11,3 +11,4 @@ VITE_MTPROTO_AUTO=1
 VITE_MTPROTO_HAS_HTTP=1
 VITE_MTPROTO_HAS_WS=1
 VITE_SAFARI_PROXY_WEBSOCKET=
+PRODUCTION_BUILD_VERSION=2.1.3

.github/workflows/production-image.yml

@@ -0,0 +1,68 @@
+name: Docker Image Build CI
+
+on:
+  push:
+    tags:
+      - 'tag/build-docker-image/*'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v1
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: '14'
+
+      - name: Read version from .env
+        id: env
+        run: echo "::set-output name=PRODUCTION_BUILD_VERSION::$(grep ^PRODUCTION_BUILD_VERSION= .env | cut -d'=' -f2)"
+
+      - name: Build the Docker image for latest
+        run: docker build -f ./.docker/Dockerfile_production -t ${{ vars.DOCKERHUB_USERNAME}}/tweb:latest .
+
+      - name: Build the Docker image for specific version
+        run: |
+          version=${{ steps.env.outputs.PRODUCTION_BUILD_VERSION }}
+          docker build -f ./.docker/Dockerfile_production -t ${{ vars.DOCKERHUB_USERNAME}}/tweb:${version} .
+
+      - name: Login to Docker Hub
+        run: echo "${{ secrets.DOCKERHUB_TOKEN }}" | docker login -u "${{ vars.DOCKERHUB_USERNAME}}" --password-stdin
+
+      - name: Push versioned image
+        run: |
+          version=${{ steps.env.outputs.PRODUCTION_BUILD_VERSION }}
+          docker push  ${{ vars.DOCKERHUB_USERNAME}}/tweb:${version}
+
+      - name: Push latest image
+
+        run: |
+          docker push ${{ vars.DOCKERHUB_USERNAME}}/tweb:latest
+
+
+  test:
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Read version from .env
+        id: env
+        run: echo "::set-output name=PRODUCTION_BUILD_VERSION::$(grep ^PRODUCTION_BUILD_VERSION= .env | cut -d'=' -f2)"
+
+      - name: Pull versioned image
+        run: |
+          version=${{ steps.env.outputs.PRODUCTION_BUILD_VERSION }}
+          docker pull ${{ vars.DOCKERHUB_USERNAME}}/tweb:${version}
+
+      - name: Pull latest image
+        run: docker pull ${{ vars.DOCKERHUB_USERNAME}}/tweb:latest

README.md

@@ -19,6 +19,30 @@ Open http://localhost:8080/ in your browser.
 
 Run `node build` to build the minimized production version of the app. Copy `public` folder contents to your web server.
 
+### Running in docker
+
+#### Developing: 
+* Install dependencies `docker-compose up tweb.dependencies`.
+* Run develop container `docker-compose up tweb.develop `.
+* Open http://localhost:8080/ in your browser. 
+
+#### Production:
+* Run `docker-compose up tweb.production -d` nginx image and container to serve the build
+* Open http://localhost:80/ in your browser.
+
+
+I also created an image https://hub.docker.com/r/elgammalx/tweb/tags  based on Nginx ready to be deployed.
+
+You can use `docker build -f ./.docker/Dockerfile_production -t {dockerhub-username}/{imageName}:{latest} .` to build your production ready image.
+
+My build use in `docker-compose.yaml` file
+```yaml
+services:
+  tweb.production:
+    image: elgammalx/tweb
+    ports:
+      - 80:80
+```
 
 ### Dependencies
 * [BigInteger.js](https://github.com/peterolson/BigInteger.js) ([Unlicense](https://github.com/peterolson/BigInteger.js/blob/master/LICENSE))

SECURITY.md

@@ -0,0 +1,21 @@
+# Security Policy
+
+## Supported Versions
+
+Use this section to tell people about which versions of your project are
+currently being supported with security updates.
+
+| Version | Supported          |
+| ------- | ------------------ |
+| 5.1.x   | :white_check_mark: |
+| 5.0.x   | :x:                |
+| 4.0.x   | :white_check_mark: |
+| < 4.0   | :x:                |
+
+## Reporting a Vulnerability
+
+Use this section to tell people how to report a vulnerability.
+
+Tell them where to go, how often they can expect to get an update on a
+reported vulnerability, what to expect if the vulnerability is accepted or
+declined, etc.

docker-compose.yaml

@@ -0,0 +1,29 @@
+version: "3.8"
+services:
+  tweb.dependencies:
+    container_name: tweb.dependencies
+    build:
+      context: .
+      dockerfile: .docker/Dockerfile_dependencies
+    volumes:
+      - "./node_modules:/app/node_modules"
+    command: pnpm install
+
+  tweb.develop:
+    container_name: tweb.develop
+    build:
+      context: .
+      dockerfile: .docker/Dockerfile_develop
+    volumes:
+      - "./:/app"
+    ports:
+      - 8080:8080
+    command: pnpm start
+
+  tweb.production:
+    container_name: tweb.production
+    build:
+      context: .
+      dockerfile: .docker/Dockerfile_production
+    ports:
+      - 80:80

package.json

@@ -5,7 +5,7 @@
   "main": "index.js",
   "scripts": {
     "preinstall": "npx only-allow pnpm",
-    "start": "vite --force",
+    "start": "vite --force --host",
     "serve": "pnpm run build; node server.js",
     "build": "pnpm run generate-changelog && vite build",
     "test": "vitest",