rewritten to preact and mui

Author: DocBrown101

.github/workflows/build-and-publish-docker.yml

@@ -1,16 +1,11 @@
-name: Create and publish the Docker image
+name: GitHub-Docker-Publish
 
 on:
   workflow_dispatch:
   push:
     branches:
       - "main"
 
-#on:
-#  release:
-#    types: [published]
-#  workflow_dispatch:
-
 env:
   REGISTRY: ghcr.io
   IMAGE_NAME: ${{ github.repository }}
@@ -24,25 +19,25 @@ jobs:
 
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Log in to the Container registry
-        uses: docker/login-action@f054a8b539a109f9f41c372932f1ae047eff08c9
+        uses: docker/login-action@v3
         with:
           registry: ${{ env.REGISTRY }}
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Extract metadata (tags, labels) for Docker
         id: meta
-        uses: docker/metadata-action@98669ae865ea3cffbcbaa878cf57c20bbf1c6c38
+        uses: docker/metadata-action@v5
         with:
           images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
 
       - name: Build and push Docker image
-        uses: docker/build-push-action@ad44023a93711e3deb337508980b4b5e9bcdc5dc
+        uses: docker/build-push-action@v6
         with:
-          context: .
+          context: ./docker
           push: true
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}

.vscode/extensions.json

@@ -1,5 +1 @@
 # QR-Code Generator
-
-## Recommended IDE Setup
-
-[VS Code](https://code.visualstudio.com/) + [Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).

Dockerfile

@@ -0,0 +1,20 @@
+# build
+FROM node:lts AS build
+WORKDIR /app
+COPY package.json ./
+COPY package-lock.json ./
+COPY index.html ./
+COPY vite.config.js ./
+COPY ./public ./public
+COPY ./src ./src
+RUN npm install
+RUN npm run build
+
+# production
+FROM nginx:1.27.5-alpine
+RUN addgroup -S nonroot && adduser -S nonroot -G nonroot
+USER nonroot
+COPY --from=build /app/build /usr/share/nginx/html
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

README.md

@@ -1,8 +1,8 @@
-version: '2.4'
-services:
-  app:
-    build: ./
-    container_name: qr-code-generator
-    restart: on-failure:1
-    ports:
-      - 80:80
+version: '2.4'
+services:
+  app:
+    build: ./
+    container_name: qr-code-generator
+    restart: on-failure:1
+    ports:
+      - 80:80

docker/Dockerfile

@@ -1,19 +1,19 @@
-version: '2.4'
-services:
-  app:
-    image: ghcr.io/docbrown101/qr-code-generator:main
-    container_name: qr-code-generator
-    restart: on-failure:1
-    ports:
-      - 80:80
-    user: 1001:1001
-    security_opt:
-      - apparmor:docker-default
-      - no-new-privileges
-    cpu_shares: 10
-    pids_limit: 10
-    mem_limit: 100m
-    read_only: true
-    tmpfs:
-      - /var/run:mode=770,size=512K,uid=1001,gid=1001
-      - /var/cache/nginx:mode=770,size=512K,uid=1001,gid=1001
+version: '2.4'
+services:
+  app:
+    image: ghcr.io/docbrown101/qr-code-generator:main
+    container_name: qr-code-generator
+    restart: on-failure:1
+    ports:
+      - 80:80
+    user: 1001:1001
+    security_opt:
+      - apparmor:docker-default
+      - no-new-privileges
+    cpu_shares: 10
+    pids_limit: 10
+    mem_limit: 100m
+    read_only: true
+    tmpfs:
+      - /var/run:mode=770,size=512K,uid=1001,gid=1001
+      - /var/cache/nginx:mode=770,size=512K,uid=1001,gid=1001

docker-compose.dev.yml renamed to docker/docker-compose.dev.yml

@@ -1,17 +1,17 @@
-server {
-
-  listen 80;
-
-  location / {
-    root   /usr/share/nginx/html;
-    index  index.html index.htm;
-    try_files $uri $uri/ /index.html;
-  }
-
-  error_page   500 502 503 504  /50x.html;
-
-  location = /50x.html {
-    root   /usr/share/nginx/html;
-  }
-
-}
+server {
+
+  listen 80;
+
+  location / {
+    root   /usr/share/nginx/html;
+    index  index.html index.htm;
+    try_files $uri $uri/ /index.html;
+  }
+
+  error_page   500 502 503 504  /50x.html;
+
+  location = /50x.html {
+    root   /usr/share/nginx/html;
+  }
+
+}

docker-compose.yml renamed to docker/docker-compose.yml

@@ -1,24 +1,13 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-
-<head>
-  <meta charset="UTF-8" />
-  <link rel="icon" href="/favicon.ico" />
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/svelte-material-ui@6.0.0-beta.16/bare.min.css" />
-  <style type="text/css">
-    html,
-    body {
-      padding: 0;
-      margin: 0;
-    }
-  </style>
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>QR-Code Generator</title>
-</head>
-
-<body>
-  <div id="app"></div>
-  <script type="module" src="/src/main.js"></script>
-</body>
-
-</html>
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>QR-Code Generator</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>