Enhance Docker setup and environment configuration

- Add dotenv support for environment variable management in backend
- Update docker-compose.yml to include .env file for backend service
- Modify frontend Dockerfile to copy nginx configuration
- Add new npm scripts for building and starting frontend in Docker
- Create GitHub Actions workflow for Docker Compose build
- Introduce nginx configuration for serving frontend application
- Initialize package.json for the project with basic scripts and metadata

.github/workflows/docker-compose.yml

@@ -0,0 +1,17 @@
+name: Compose
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+      - run: docker compose build

backend/src/app.ts

@@ -1,10 +1,10 @@
+import 'dotenv/config'
 import express from 'express';
 import bodyParser from 'body-parser';
 import apiRoutes from "./routes/index"
 import { createNodeMiddleware } from "octokit";
 import { setupWebhookListeners } from './controllers/webhook.controller';
 import octokit from './services/octokit';
-import 'dotenv/config'
 
 const app = express();
 const PORT = Number(process.env.PORT) || 3000;

compose.yml

@@ -11,6 +11,7 @@ services:
   backend:
     depends_on:
       - db
+    env_file: ./backend/.env
     build:
       context: ./backend
       dockerfile: Dockerfile

frontend/Dockerfile

@@ -1,19 +1,14 @@
 FROM node:20 as build
 
 WORKDIR /frontend
-
 COPY package.json package-lock.json ./
-
 RUN npm install
-
 COPY . .
-
 RUN npm run build --prod
 
 FROM nginx:alpine
-
+COPY nginx.conf /etc/nginx/conf.d/default.conf
 COPY --from=build frontend/dist/github-value/browser /usr/share/nginx/html
 
 EXPOSE 80
-
 CMD ["nginx", "-g", "daemon off;"]

frontend/nginx.conf

@@ -0,0 +1,13 @@
+server {
+    listen 80;
+    server_name your_domain_or_ip;
+
+    root /usr/share/nginx/html;
+    index index.html;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+
+    error_page 404 /index.html;
+}

frontend/package.json

@@ -6,7 +6,9 @@
     "start": "ng serve",
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
-    "test": "ng test"
+    "test": "ng test",
+    "docker-build": "docker build -t github-value-frontend .",
+    "docker-start": "docker run -p 80:80 github-value-frontend"
   },
   "private": true,
   "dependencies": {

package.json

@@ -0,0 +1,12 @@
+{
+  "name": "github-value",
+  "version": "1.0.0",
+  "description": "Welcome to My Fullstack App! 🎉 This project is a full-stack application built with Angular for the frontend and Node.js for the backend, all written in TypeScript. It uses SQLite as the database and is containerized using Docker Compose. 🐳",
+  "main": "index.js",
+  "scripts": {
+    "dev-frontend": "cd ./frontend && npm run start",
+    "dev-backend": "cd ./backend && npm run start"
+  },
+  "author": "",
+  "license": "ISC"
+}