Merge pull request #12 from lancatlin/deployment

Deployment frontend

.dockerignore

@@ -1,2 +1,3 @@
-node_modules
-.git
+*/node_modules
+.git
+*/dist

.eslintignore

@@ -1,4 +1,5 @@
 vite.config.js
 .gitignore
 data
-mongo-init.js
+mongo-init.js
+app/dist

.github/workflows/ci_cd.yml

@@ -19,12 +19,29 @@ jobs:
           username: ${{ secrets.DOCKERHUB_USERNAME }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
 
-      - name: Build and push Docker image
+      - name: Build backend
         uses: docker/build-push-action@v2
         with:
           context: .
+          file: ./server/Dockerfile
           push: true
-          tags: docker.io/${{ secrets.DOCKERHUB_USERNAME }}/linux-odyssey:latest
+          tags: docker.io/${{ secrets.DOCKERHUB_USERNAME }}/linux-odyssey:backend
+
+      - name: Build app
+        uses: docker/build-push-action@v2
+        with:
+          context: .
+          file: ./app/Dockerfile
+          push: true
+          tags: docker.io/${{ secrets.DOCKERHUB_USERNAME }}/linux-odyssey:app
+
+      - name: Build quest helloworld
+        uses: docker/build-push-action@v2
+        with:
+          context: .
+          file: ./quests/helloworld/Dockerfile
+          push: true
+          tags: docker.io/${{ secrets.DOCKERHUB_USERNAME }}/linux-odyssey:helloworld
 
   deploy:
     needs: build-and-push

.github/workflows/eslint.yml

@@ -0,0 +1,22 @@
+name: ESLint Checks
+
+on:
+  push:
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Lint
+        run: yarn lint

.prettierignore

@@ -1 +1,2 @@
-data/*
+data/*
+app/dist

README.md

@@ -8,76 +8,58 @@
 
 ## Installation
 
-```
-git clone https://github.com/lancatlin/linux-odyssey.git
-cd linux-odyssey
-yarn install
-```
+    git clone https://github.com/lancatlin/linux-odyssey.git
+    cd linux-odyssey
+    yarn install
 
-## Create database
+## Development
 
-```
-docker compose pull
-docker compose up -d db
-```
-
-## Server
-
-Source: `server/`
-
-```
-docker compose -f docker-compose.build.yml pull
-docker compose up -d
-# Open http://localhost:3000
-```
-
-### Build images
+Run everything (frontend, backend, db, swagger, quests):
 
     docker compose build
-    docker compose push
+    docker compose up -d
 
-Game images:
+### Deployment
 
-```
-docker compose -f docker-compose.build.yml build
-docker compose -f docker-compose.build.yml push
-```
+    docker compose -f docker-compose.prod.yml build
+    docker compose -f docker-compose.prod.yml push
 
-## App
+    # Server side
+    docker compose -f docker-compose.prod.yml pull
+    docker compose -f docker-compose.prod.yml up -d
+
+## Standalone App (without Docker)
 
 Source: `app/`
 
-```
-# Connect to dev server (https://odyssey.wancat.cc)
-yarn app
+    # Connect to dev server (https://odyssey.wancat.cc)
+    yarn app
 
-# Connect to localhost (http://localhost:3000)
-yarn app:local
-```
+    # Connect to localhost (http://localhost:3000)
+    yarn app:local
+
+    # Connect to anyhost
+    API_ENDPOINT=http://example.com yarn app:local
 
 ## Swagger
 
-```
-docker compose up -d swagger
-```
+    docker compose up -d swagger
 
 Open http://localhost:8080 to open Swagger
 
-## CLI terminal client
+## CLI terminal client (Docker not required)
 
-```
-yarn cli
-Usage: client [options] [command]
+    yarn cli
+    Usage: client [options] [command]
 
-Options:
-  -s, --session <string>  Session ID
-  -c, --create            Create a new session
-  -h, --host <string>     Server host (default: "http://localhost:3000")
-  --help                  display help for command
+    Options:
+    -s, --session <string>  Session ID
+    -c, --create            Create a new session
+    -h, --host <string>     Server host (default: "http://localhost:3000")
+    --help                  display help for command
 
-Commands:
-  list                    List all sessions
-```
+    Commands:
+    list                    List all sessions
 
 connet to recent session:
 

app/Dockerfile

@@ -0,0 +1,14 @@
+# Build stage
+FROM node as build-stage
+WORKDIR /app
+COPY app/package.json yarn.lock ./
+RUN yarn install
+COPY app .
+RUN yarn build
+
+# Production stage
+FROM nginx:stable-alpine as production-stage
+COPY --from=build-stage /app/dist /usr/share/nginx/html
+COPY deployment/nginx.conf /etc/nginx/conf.d/default.conf
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

app/Dockerfile.dev

@@ -0,0 +1,7 @@
+FROM node
+
+WORKDIR /app
+COPY app/package.json yarn.lock ./
+RUN yarn install --frozen-lockfile
+COPY app .
+CMD [ "yarn", "dev:docker", "--host", "0.0.0.0" ]

app/package.json

@@ -6,6 +6,7 @@
   "scripts": {
     "dev": "API_TARGET=https://odyssey.wancat.cc vite",
     "dev:local": "vite",
+    "dev:docker": "API_TARGET=http://backend:3000 vite",
     "build": "vite build",
     "preview": "vite preview"
   },

app/src/utils/api.js

@@ -1,7 +1,7 @@
 import axios from 'axios'
 
 const api = axios.create({
-  baseURL: '/api',
+  baseURL: '/api/v1',
 })
 
 export default api

app/vite.config.js

@@ -7,9 +7,8 @@ export default defineConfig({
   server: {
     proxy: {
       '/api': {
-        target: `${process.env.API_TARGET || 'http://localhost:3000'}/api/v1`,
+        target: process.env.API_TARGET || 'http://localhost:3000',
         changeOrigin: true,
-        rewrite: (path) => path.replace(/^\/api/, ''),
       },
       '/socket.io': {
         target: process.env.API_TARGET || 'ws://localhost:3000',

cleanup.sh

@@ -1,5 +0,0 @@
-#!/bin/sh
-containers=$(docker ps -a | grep 'quest-' | awk '{print $1}')
-echo $containers
-
-docker rm -f $containers

deployment/nginx.conf

@@ -0,0 +1,25 @@
+server {
+    listen       80;
+
+    location / {
+        root   /usr/share/nginx/html;
+        index  index.html;
+        try_files $uri $uri/ /index.html;
+    }
+
+    location /api/ {
+        proxy_pass http://backend:3000;
+    }
+
+    location /api-docs/ {
+        proxy_pass http://backend:3000;
+    }
+
+    location /socket.io/ {
+        proxy_pass http://backend:3000;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+        proxy_set_header Host $host;
+    }
+}

docker-compose.build.yml

@@ -1,7 +0,0 @@
-version: '3'
-services:
-  helloworld:
-    image: lancatlin/linux-odyssey:helloworld
-    build:
-      context: .
-      dockerfile: server/quests/helloworld/Dockerfile

docker-compose.prod.yml

@@ -1,16 +1,23 @@
 version: '3'
 services:
   app:
-    image: lancatlin/linux-odyssey
+    image: lancatlin/linux-odyssey:app
+    build:
+      context: .
+      dockerfile: app/Dockerfile
+    networks:
+      internal:
+    ports:
+      - 8080:80
+  backend:
+    image: lancatlin/linux-odyssey:backend
     restart: on-failure
     build:
       context: .
-      dockerfile: Dockerfile
+      dockerfile: server/Dockerfile
     networks:
       - internal
       - players
-    ports:
-      - '3000:3000'
     volumes:
       - /var/run/docker.sock:/var/run/docker.sock
     environment:
@@ -33,6 +40,12 @@ services:
       - MONGO_PASS=user-password
       - MONGO_DB=odyssey-test
 
+  helloworld:
+    image: lancatlin/linux-odyssey:helloworld
+    build:
+      context: .
+      dockerfile: quests/helloworld/Dockerfile
+
 networks:
   internal:
   players:

docker-compose.yml

@@ -1,10 +1,20 @@
 version: '3'
 services:
   app:
+    build:
+      context: .
+      dockerfile: app/Dockerfile.dev
+    ports:
+      - 5173:5173
+    networks:
+      - internal
+    volumes:
+      - ./app/src:/app/src
+  backend:
     restart: on-failure
     build:
       context: .
-      dockerfile: Dockerfile.dev
+      dockerfile: server/Dockerfile.dev
     networks:
       - internal
       - players
@@ -12,10 +22,13 @@ services:
       - '3000:3000'
     volumes:
       - /var/run/docker.sock:/var/run/docker.sock
-      - ./server:/app/server
+      - ./server/src:/app/src
+      - ./server/swagger.yaml:/app/swagger.yaml
+      - ./quests:/app/quests
     environment:
       - MONGO_URL=mongodb://db:27017/odyssey-test
       - DOCKER_NETWORK=linux-odyssey-players
+      - HOST_PWD=${PWD}
   db:
     image: mongo
     restart: always
@@ -35,6 +48,12 @@ services:
     environment:
       - SWAGGER_FILE=/tmp/swagger.yaml
 
+  helloworld:
+    image: lancatlin/linux-odyssey:helloworld
+    build:
+      context: .
+      dockerfile: quests/helloworld/Dockerfile
+
 networks:
   internal:
   players:

docker-scripts.sh

@@ -0,0 +1,17 @@
+#!/bin/sh
+
+inspect() {
+  # default to app, allow overriding by $1
+  SERVICE=${1:-app}
+  echo "Running docker-compose logs for service [$SERVICE]..."
+  docker compose logs $SERVICE -f --no-log-prefix
+}
+
+clean() {
+  containers=$(docker ps -a | grep 'quest-' | awk '{print $1}')
+  echo $containers
+
+  docker rm -f $containers
+}
+
+$@

inspect.sh

@@ -1,2 +0,0 @@
-#!/bin/sh
-docker compose logs app -f --no-log-prefix

quests/helloworld/Dockerfile

@@ -22,6 +22,6 @@ USER rudeus
 
 WORKDIR /home/rudeus
 
-COPY ./server/quests/helloworld/home /home/rudeus/
+COPY ./quests/helloworld/home /home/rudeus/
 
 CMD [ "/bin/zsh" ]

server/Dockerfile

@@ -1,15 +1,12 @@
 FROM node
 
 WORKDIR /app
-COPY package.json yarn.lock ./
-COPY server/package.json ./server/
+COPY server/package.json yarn.lock ./
 RUN yarn install --frozen-lockfile --production
 
-WORKDIR /app/server
-
 COPY server/src ./src
-COPY server/quests ./quests
 COPY server/swagger.yaml .
+COPY quests ./quests
 
 ENV NODE_ENV=production
 ENV HOST=0.0.0.0

server/Dockerfile.dev

@@ -1,12 +1,9 @@
 FROM node
 
 WORKDIR /app
-COPY package.json yarn.lock ./
-COPY server/package.json ./server/
+COPY server/package.json yarn.lock ./
 RUN yarn install --frozen-lockfile
 
-WORKDIR /app/server
-
 ARG DOCKER_GID=140
 
 RUN groupadd -g $DOCKER_GID docker && usermod -aG docker node

server/src/api/socket.js

@@ -1,5 +1,5 @@
 import { Server } from 'socket.io'
-import { getOrCreateContainer, attachContainer } from '../utils/docker.js'
+import { getOrCreateContainer, attachContainer } from '../containers/docker.js'
 import Session from '../models/session.js'
 import { defaultUser, genSessionJWT } from '../utils/auth.js'
 

server/src/config.js

@@ -7,4 +7,5 @@ export default {
   jwtSecret: get('JWT_SECRET', 'secret'),
   dockerNetwork: get('DOCKER_NETWORK', 'linux-odyssey-players'),
   isProduction: process.env.NODE_ENV === 'production',
+  hostPwd: get('HOST_PWD', ''),
 }

server/src/containers/docker.js

@@ -3,8 +3,6 @@ import config from '../config.js'
 
 const engine = new Docker()
 
-const projectPath = '/home/zeko/src/linux-odyssey'
-
 const containerOptions = {
   Image: 'lancatlin/linux-odyssey:helloworld',
   AttachStdin: true,
@@ -14,12 +12,13 @@ const containerOptions = {
   OpenStdin: true,
   StdinOnce: false,
   HostConfig: {
-    Binds: config.isProduction
-      ? []
-      : [
-          `${projectPath}/server/quests/helloworld/home:/home/rudeus`,
-          `${projectPath}/packages/container:/usr/local/lib/container`,
-        ],
+    Binds:
+      config.isProduction && config.hostPwd
+        ? []
+        : [
+            `${config.hostPwd}/quests/helloworld/home:/home/rudeus`,
+            `${config.hostPwd}/packages/container:/usr/local/lib/container`,
+          ],
   },
 }
 
@@ -60,7 +59,7 @@ export async function attachContainer(container, { token }) {
     AttachStderr: true,
     Cmd: ['/bin/zsh'],
     Tty: true,
-    Env: [`TOKEN=${token}`, `API_ENDPOINT=http://app:3000`],
+    Env: [`TOKEN=${token}`, `API_ENDPOINT=http://backend:3000`],
   })
 
   const execOutput = await exec.start({

yarn.lock

@@ -4269,7 +4269,7 @@ socket.io-adapter@~2.5.2:
   dependencies:
     ws "~8.11.0"
 
-socket.io-client@^4.7.2:
+socket.io-client@^4.7.1, socket.io-client@^4.7.2:
   version "4.7.2"
   resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-4.7.2.tgz#f2f13f68058bd4e40f94f2a1541f275157ff2c08"
   integrity sha512-vtA0uD4ibrYD793SOIAwlo8cj6haOeMHrGvwPxJsxH7CeIksqJ+3Zc06RvWTIFgiSqx4A3sOnTXpfAEE2Zyz6w==