Zbavení se duplicitních Typescript typů

.gitignore

@@ -10,6 +10,7 @@ node_modules
 
 # production
 /build
+dist
 
 # misc
 .DS_Store

Dockerfile

@@ -1,46 +0,0 @@
-# Builder
-FROM node:18-alpine3.18 as builder
-
-ENV LANG cs_CZ.UTF-8
-
-WORKDIR /build
-
-COPY package.json .
-COPY yarn.lock .
-
-COPY server/package.json ./server/
-COPY client/package.json ./client/
-
-RUN yarn install --frozen-lockfile
-
-COPY server/tsconfig.json ./server/
-COPY server/src ./server/src/
-
-COPY client/tsconfig.json ./client/
-COPY client/src ./client/src
-COPY client/public ./client/public
-
-COPY types ./types/
-
-WORKDIR /build/server
-RUN yarn build
-
-WORKDIR /build/client
-RUN yarn build
-
-# Runner
-FROM node:18-alpine3.18
-ENV NODE_ENV production
-
-WORKDIR /app
-
-COPY --from=builder /build/node_modules ./node_modules
-COPY --from=builder /build/server/dist ./
-COPY --from=builder /build/client/build ./public
-COPY /server/.env.production ./server/src
-
-RUN echo "Test root" && ls -la
-
-EXPOSE 3000
-
-CMD [ "node", "./server/src/index.js" ]

README.md

@@ -1,13 +1,15 @@
 # Luncher
 Aplikace pro profesionální management obědů.
 
-Aplikace sestává ze tří modulů.
+Aplikace sestává ze tří (čtyř) modulů.
-- types
+- api
-  - společné TypeScript definice, pro objekty posílané mezi serverem a klientem
+  - společné Typescript definice, pro objekty posílané mezi serverem a klientem
 - server
   - backend psaný v [node.js](https://nodejs.dev)
 - client
   - frontend psaný v [React.js](https://react.dev)
+- [nginx](https://nginx.org)
+  - proxy pro snadné propojení Docker kontejnerů pod jednou URL
 
 ## Spuštění pro vývoj
 ### Závislosti
@@ -17,6 +19,7 @@ Aplikace sestává ze tří modulů.
 
 ### Spuštění na *nix platformách
 - Nainstalovat závislosti viz předchozí bod
+- Zkopírovat `client/.env.template` do `client/.env.development` a upravit dle potřeby
 - Zkopírovat `server/.env.template` do `server/.env.development` a upravit dle potřeby
 - Spustit `./run_dev.sh`. Na jiných platformách se lze inspirovat jeho obsahem, postup by měl být víceméně stejný.
 
@@ -25,6 +28,9 @@ Aplikace sestává ze tří modulů.
 - [Docker](https://www.docker.com)
 - [Docker Compose](https://docs.docker.com/compose)
 
+### Spuštění s nginx
+- `docker compose up --build -d`
+
 ### Spuštení s traefik
 - `docker compose -f compose-traefik.yml up --build -d`
 
@@ -49,7 +55,8 @@ Aplikace sestává ze tří modulů.
   - [ ] Ceny krabic za pizzu jsou napevno v kódu - problém, pokud se někdy změní
 - [ ] Předvyplnění poslední vybrané hodnoty občas nefunguje, viz komentář
 - [ ] Nasazení nové verze v Docker smaže veškerá data (protože data.json není venku)
-- [x] Vylepšit dokumentaci projektu
+- [ ] Vylepšit dokumentaci projektu
+  - [ ] Popsat nginx
   - [x] Popsat závislosti, co je nutné provést před vývojem a postup spuštění pro vývoj
   - [x] Popsat dostupné env
 - [x] Přesunout autentizaci na server (JWT?)
@@ -62,7 +69,7 @@ Aplikace sestává ze tří modulů.
 - [ ] Možnost náhledu na jiné dny v týdnu (např. pomocí šipek)
   - [ ] Možnost zadat si oběd dopředu na následující dny v týdnu
 - [x] Zbavit se Food API, potřebnou funkcionalitu zahrnout do serveru
-- [x] Vyřešit API mezi serverem a klientem, aby nebyl v obou projektech duplicitní kód (viz types.ts a Types.tsx)
+- [ ] Vyřešit API mezi serverem a klientem, aby nebyl v obou projektech duplicitní kód (viz types.ts a Types.tsx)
 - [ ] Mazat z databáze předchozí dny, aktuálně je to k ničemu
 - [ ] Vylepšit parsery restaurací
   - [ ] Sladovnická

api/README.md

@@ -0,0 +1 @@
+# Společné Typescript definice serveru a klienta

api/package.json

@@ -0,0 +1,14 @@
+{
+    "name": "@luncher/api",
+    "version": "1.0.0",
+    "main": "src/index.ts",
+    "scripts": {
+        "build": "yarn clean && tsc -p .",
+        "build:watch": "tsc -p . --watch",
+        "clean": "rm -rf dist"
+    },
+    "types": "dist/index.d.ts",
+    "devDependencies": {
+        "typescript": "^5.0.2"
+    }
+}

api/src/index.ts

@@ -0,0 +1 @@
+export * as Types from './Types';

api/tsconfig.json

@@ -0,0 +1,9 @@
+{
+    "compilerOptions": {
+        "declaration": true,
+        "outDir": "./dist"
+    },
+    "include": [
+        "src/**/*"
+    ]
+}

api/yarn.lock

@@ -0,0 +1,8 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+typescript@^5.0.2:
+  version "5.1.6"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.1.6.tgz#02f8ac202b6dad2c0dd5e0913745b47a37998274"
+  integrity sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==

client/.dockerignore

@@ -0,0 +1,3 @@
+**/node_modules
+**/npm-debug.log
+build

client/.env.template

@@ -0,0 +1,3 @@
+# Veřejná URL, na které bude dostupný klient (typicky přes proxy).
+# Pro vývoj není potřeba, bude použita výchozí hodnota http://127.0.0.1:3001
+# PUBLIC_URL=http://example:3001

client/.gitignore

@@ -1,2 +1,2 @@
 build
-src/types
+.env.production

client/Dockerfile

@@ -0,0 +1,23 @@
+FROM node:18-alpine3.18 AS builder
+
+COPY package.json .
+COPY yarn.lock .
+COPY tsconfig.json .
+COPY .env.production .
+
+RUN yarn install
+
+COPY ./src ./src
+COPY ./public ./public
+
+RUN yarn build
+
+FROM node:18-alpine3.18
+ENV NODE_ENV production
+
+WORKDIR /app
+
+COPY --from=builder /build .
+EXPOSE 3000
+RUN yarn global add serve && yarn
+CMD ["serve", "-s", "."]

client/build.sh

@@ -0,0 +1,2 @@
+#!/bin/bash
+docker build -t luncher-client .

client/package.json

@@ -1,9 +1,8 @@
 {
-  "name": "@luncher/client",
+  "name": "luncher-client",
   "version": "0.1.0",
   "license": "MIT",
   "private": true,
-  "homepage": ".",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.4.0",
     "@fortawesome/free-regular-svg-icons": "^6.4.0",
@@ -17,6 +16,7 @@
     "@types/react": "^18.0.33",
     "@types/react-dom": "^18.0.11",
     "bootstrap": "^5.2.3",
+    "@luncher/api": "1.0.0",
     "react": "^18.2.0",
     "react-bootstrap": "^2.7.2",
     "react-dom": "^18.2.0",
@@ -30,9 +30,8 @@
     "web-vitals": "^2.1.4"
   },
   "scripts": {
-    "copy-types": "cp -r ../types ./src",
+    "start": "react-scripts start",
-    "start": "yarn copy-types && react-scripts start",
+    "build": "react-scripts build",
-    "build": "yarn copy-types && react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },

client/src/Api.ts

@@ -1,4 +1,4 @@
-import { PizzaOrder } from "./types";
+import { PizzaOrder } from "@luncher/api/dist/Types";
 import { getBaseUrl, getToken } from "./Utils";
 
 async function request<TResponse>(

client/src/App.tsx

@@ -14,7 +14,7 @@ import './App.css';
 import { SelectSearchOption } from 'react-select-search';
 import { faTrashCan } from '@fortawesome/free-regular-svg-icons';
 import { useBank } from './context/bank';
-import { ClientData, Restaurants, Food, Pizza, Order, Locations, PizzaOrder, PizzaDayState } from './types';
+import { ClientData, Restaurants, Food, Pizza, Order, Locations, PizzaOrder, PizzaDayState } from '@luncher/api/dist/Types';
 
 
 const EVENT_CONNECT = "connect"
@@ -127,7 +127,7 @@ function App() {
 
   const handlePizzaChange = async (value: SelectedOptionValue | SelectedOptionValue[]) => {
     if (auth?.login && pizzy) {
-      if (!(typeof value === 'string')) {
+      if (!(value instanceof String)) {
         throw Error('Nepodporovaný typ hodnoty');
       }
       const s = value.split('|');

client/src/components/PizzaOrderList.tsx

@@ -3,7 +3,7 @@ import { Table } from "react-bootstrap";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faTrashCan } from "@fortawesome/free-regular-svg-icons";
 import { useAuth } from "../context/auth";
-import { Order, PizzaDayState, PizzaOrder } from "../types";
+import { Order, PizzaDayState, PizzaOrder } from "@luncher/api/dist/Types";
 
 export default function PizzaOrderList({ state, orders, onDelete }: { state: PizzaDayState, orders: Order[], onDelete: (pizzaOrder: PizzaOrder) => void }) {
     const auth = useAuth();

client/src/context/socket.js

@@ -2,10 +2,8 @@ import React from 'react';
 import socketio from "socket.io-client";
 import { getBaseUrl } from "../Utils";
 
-// Hack pro socket.io, který si s tečkou neumí poradit
-const socketUrl = getBaseUrl() === '.' ? '/' : getBaseUrl();
 // Záměrně omezeno jen na websocket, aby se případně odhalilo chybné nastavení proxy serveru
-export const socket = socketio.connect(socketUrl, { transports: ["websocket"] });
+export const socket = socketio.connect(getBaseUrl(), { transports: ["websocket"] });
 export const SocketContext = React.createContext();
 
 // Konstanty websocket eventů, musí odpovídat těm na serveru!

docker-compose.yml

@@ -1,9 +1,18 @@
 version: '3.8'
 
 services:
-  luncher:
+  server:
+    build:
+      context: ./server
+  client:
+    build:
+      context: ./client
+  nginx:
+    depends_on:
+      - server
+      - client
     restart: always
     build:
-      context: ./
+      context: ./nginx
     ports:
-      - 3001:3001
+      - 3005:80

nginx/Dockerfile

@@ -0,0 +1,2 @@
+FROM nginx
+COPY ./default.conf /etc/nginx/conf.d/default.conf

nginx/default.conf

@@ -0,0 +1,37 @@
+upstream client {
+  server client:3000;
+}
+
+upstream server {
+  server server:3001;
+}
+
+server {
+  listen 80;
+
+  location / {
+      proxy_pass http://client;
+  }
+
+  location /static {
+      proxy_pass http://client;
+  }
+
+  location /sockjs-node {
+      proxy_pass http://client;
+      proxy_http_version 1.1;
+      proxy_set_header Upgrade $http_upgrade;
+      proxy_set_header Connection "Upgrade";
+  }
+
+  location /socket.io {
+      proxy_pass http://server;
+      proxy_http_version 1.1;
+      proxy_set_header Upgrade $http_upgrade;
+      proxy_set_header Connection "Upgrade";
+  }
+
+  location /api {
+      proxy_pass http://server;
+  }
+}

package.json

@@ -1,8 +1,8 @@
 {
     "private": true,
     "workspaces": [
-        "client",
+        "api",
         "server",
-        "types"
+        "client"
     ]
 }

run_dev.sh

@@ -1,5 +1,6 @@
 export NODE_ENV=development
 yarn install
+cd api && yarn build &
 cd server && yarn start &
 cd client && yarn start &
 wait

server/Dockerfile

@@ -0,0 +1,18 @@
+FROM node:18-alpine3.18
+
+ENV LANG cs_CZ.UTF-8  
+
+WORKDIR /app
+
+COPY package.json .
+COPY yarn.lock .
+COPY .env.production .
+COPY tsconfig.json .
+COPY src ./src
+
+RUN yarn install --frozen-lockfile
+RUN yarn build
+
+EXPOSE 3001
+
+CMD [ "node", "/app/dist/index.js" ]

server/build.sh

@@ -0,0 +1,3 @@
+#!/bin/bash
+yarn install --frozen-lockfile && yarn build
+docker build -t luncher-server .

server/package.json

@@ -25,6 +25,7 @@
     "dotenv": "^16.1.3",
     "express": "^4.18.2",
     "jsonwebtoken": "^9.0.0",
+    "@luncher/api": "1.0.0",
     "simple-json-db": "^2.0.0",
     "socket.io": "^4.6.1"
   }

server/src/index.ts

@@ -9,15 +9,10 @@ import path from 'path';
 import { getMenuSladovnicka, getMenuTechTower, getMenuUMotliku } from "./restaurants";
 import { getQr } from "./qr";
 import { generateToken, getLogin, verify } from "./auth";
-import { Restaurants } from "../../types";
+import { Restaurants } from "@luncher/api/dist/Types";
 
 const ENVIRONMENT = process.env.NODE_ENV || 'production';
-dotenv.config({ path: path.resolve(__dirname, `./.env.${ENVIRONMENT}`) });
+dotenv.config({ path: path.resolve(__dirname, `../.env.${ENVIRONMENT}`) });
-
-// Validace nastavení JWT tokenu - nemá bez něj smysl vůbec povolit server spustit
-if (!process.env.JWT_SECRET) {
-    throw Error("Není vyplněna proměnná prostředí JWT_SECRET");
-}
 
 const app = express();
 const server = require("http").createServer(app);
@@ -35,8 +30,6 @@ app.use(cors({
     origin: '*'
 }));
 
-app.use(express.static('public'))
-
 const parseToken = (req: any) => {
     if (req?.headers?.authorization) {
         return req.headers.authorization.split(' ')[1];
@@ -232,8 +225,4 @@ server.listen(PORT, () => {
     console.log(`Server listening on ${HOST}, port ${PORT}`);
 });
 
-// Umožníme vypnutí serveru přes SIGINT, jinak Docker čeká než ho sestřelí
+console.log(process.env.API_KEY)
-process.on('SIGINT', function () {
-    console.log("\nSIGINT (Ctrl-C), vypínám server");
-    process.exit(0);
-});

server/src/notifikace.ts

@@ -1,5 +1,5 @@
 /** Notifikace pro gotify*/
-import { GotifyServer, NotififaceInput, NotifikaceData } from '../../types';
+import { GotifyServer, NotififaceInput, NotifikaceData } from '@luncher/api/dist/Types';
 import axios, { AxiosError } from 'axios';
 import dotenv from 'dotenv';
 import path from 'path';

server/src/restaurants.ts

@@ -4,7 +4,7 @@ import path from "path";
 import fs from "fs";
 import { load } from 'cheerio';
 import { formatDate } from "./utils";
-import { Food } from "../../types";
+import { Food } from "@luncher/api/dist/Types";
 
 // Fráze v názvech jídel, které naznačují že se jedná o polévku
 const SOUP_NAMES = ['polévka', 'česnečka', 'česnekový krém', 'cibulačka', 'vývar']

server/src/service.ts

@@ -2,7 +2,7 @@ import { db } from "./database";
 import { formatDate, getHumanDate, getIsWeekend } from "./utils";
 import { callNotifikace } from "./notifikace";
 import { generateQr } from "./qr";
-import { ClientData, PizzaDayState, UdalostEnum, Pizza, PizzaSize, Order, PizzaOrder, Locations } from "../../types";
+import { ClientData, PizzaDayState, UdalostEnum, Pizza, PizzaSize, Order, PizzaOrder, Locations } from "@luncher/api/dist/Types";
 
 /** Vrátí dnešní datum, případně fiktivní datum pro účely vývoje a testování. */
 function getToday(): Date {

server/tsconfig.json

@@ -1,8 +1,4 @@
 {
-    "include": [
-        "src/**/*",
-        "../types/**/*"
-    ],
     "compilerOptions": {
         "target": "ES2016",
         "module": "CommonJS",
@@ -10,7 +6,7 @@
         "esModuleInterop": true,
         "forceConsistentCasingInFileNames": true,
         "outDir": "./dist",
-        "rootDir": "../",
+        "rootDir": "./src",
-        "strict": true
+        "strict": true,
     }
 }

types/index.ts

@@ -1 +0,0 @@
-export * from './Types';

types/tsconfig.json

@@ -1,15 +0,0 @@
-{
-    "compilerOptions": {
-        "declaration": true,
-        // "emitDeclarationOnly": true,
-        // "outDir": "./dist",
-        "noEmit": true
-    },
-    "include": [
-        "index.ts",
-        "Types.ts"
-    ],
-    "exclude": [
-        "node_modules"
-    ]
-}