Repository: CodyTseng/jumble
Pull request #311: Feat: add docker
Author: login: GustavoMotaDF
Created: 2025-05-06T16:13:52Z | Merged: 2025-05-09T01:25:57Z

adding configuration to run via docker


Diff:
diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 000000000..7e1e98ba1
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,33 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+dev-dist
+*.local
+.env
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Git
+.gitignore
+
+#Docker files
+docker-compose.yml
+Dockerfile
\ No newline at end of file
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 000000000..2ead3f172
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,41 @@
+# Step 1: Build the application
+FROM node:20-alpine as builder
+
+WORKDIR /app
+COPY . .
+
+RUN npm install && npm run build
+
+# Step 2: Final container with Nginx and embedded config
+FROM nginx:alpine
+
+# Copy only the generated static files
+COPY --from=builder /app/dist /usr/share/nginx/html
+
+# Embed Nginx configuration directly
+RUN printf "server {\n\
+    listen 80;\n\
+    server_name localhost;\n\
+    root /usr/share/nginx/html;\n\
+    index index.html;\n\
+\n\
+    location / {\n\
+        try_files \$uri \$uri/ /index.html;\n\
+    }\n\
+\n\
+    location ~* \\.(?:js|css|woff2?|ttf|otf|eot|ico|jpg|jpeg|png|gif|svg|webp)\$ {\n\
+        expires 30d;\n\
+        access_log off;\n\
+        add_header Cache-Control \"public\";\n\
+    }\n\
+\n\
+    gzip on;\n\
+    gzip_types text/plain application/javascript application/x-javascript text/javascript text/css application/json;\n\
+    gzip_proxied any;\n\
+    gzip_min_length 1024;\n\
+    gzip_comp_level 6;\n\
+}\n" > /etc/nginx/conf.d/default.conf
+
+EXPOSE 80
+
+CMD ["nginx", "-g", "daemon off;"]
diff --git a/README.md b/README.md
index cb670f214..e9f23146b 100644
--- a/README.md
+++ b/README.md
@@ -42,6 +42,18 @@ npm install
 # Run the app
 npm run dev
 ```
+## Run Docker
+```bash
+# Clone this repository
+git clone https://github.com/CodyTseng/jumble.git
+
+# Go into the repository
+cd jumble
+
+# Run the docker compose
+docker compose up --build -d
+```
+After finishing, access: http://localhost:8089
 
 ## Donate
 
diff --git a/docker-compose.yml b/docker-compose.yml
new file mode 100644
index 000000000..7c58d0ec2
--- /dev/null
+++ b/docker-compose.yml
@@ -0,0 +1,11 @@
+version: "3.8"
+
+services:
+  jumble:
+    container_name: jumble-nginx
+    build:
+      context: .
+      dockerfile: Dockerfile
+    ports:
+      - "8089:80"
+    restart: unless-stopped


Reviews:
user: login: CodyTseng
state: COMMENTED
author_association: OWNER
submitted_at: 2025-05-08T02:15:58Z
user: login: GustavoMotaDF
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-08T14:25:36Z
user: login: GustavoMotaDF
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-08T14:30:41Z
user: login: GustavoMotaDF
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-05-08T14:31:11Z
user: login: CodyTseng
body: LGTM
state: APPROVED
author_association: OWNER
submitted_at: 2025-05-09T01:24:19Z

Review comments:
diff_hunk: @@ -0,0 +1,45 @@
+# Etapa 1: Build da aplicação (somente a última versão da main)
path: Dockerfile
user: login: CodyTseng
body: Hope English comments can be used instead.
created_at: 2025-05-08T02:02:19Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,45 @@
+# Etapa 1: Build da aplicação (somente a última versão da main)
+FROM node:20-alpine as builder
+
+# Instala git e clona apenas o último commit da branch main
+RUN apk add --no-cache git
+
+WORKDIR /app
+RUN git clone --depth=1 https://github.com/CodyTseng/jumble.git .
path: Dockerfile
user: login: CodyTseng
body: This looks like it could be replaced with a COPY command directly.
created_at: 2025-05-08T02:05:50Z
author_association: OWNER
diff_hunk: @@ -42,6 +42,19 @@ npm install
 # Run the app
 npm run dev
 ```
+## Run Docker
+```bash
+# Clone this repository
+git clone https://github.com/CodyTseng/jumble.git
+
+# Go into the repository
+cd jumble
+
+# Run the docker compose
+docker compose up --build -d
+
+```
+
path: README.md
user: login: CodyTseng
body: Add a description of which port the service is running on.
created_at: 2025-05-08T02:15:12Z
author_association: OWNER
diff_hunk: @@ -0,0 +1,45 @@
+# Etapa 1: Build da aplicação (somente a última versão da main)
path: Dockerfile
user: login: GustavoMotaDF
body: Comments changed to English
created_at: 2025-05-08T14:25:36Z
author_association: CONTRIBUTOR
diff_hunk: @@ -0,0 +1,45 @@
+# Etapa 1: Build da aplicação (somente a última versão da main)
+FROM node:20-alpine as builder
+
+# Instala git e clona apenas o último commit da branch main
+RUN apk add --no-cache git
+
+WORKDIR /app
+RUN git clone --depth=1 https://github.com/CodyTseng/jumble.git .
path: Dockerfile
user: login: GustavoMotaDF
body: you are absolutely correct.
changed to use COPY
created_at: 2025-05-08T14:30:41Z
author_association: CONTRIBUTOR
diff_hunk: @@ -42,6 +42,19 @@ npm install
 # Run the app
 npm run dev
 ```
+## Run Docker
+```bash
+# Clone this repository
+git clone https://github.com/CodyTseng/jumble.git
+
+# Go into the repository
+cd jumble
+
+# Run the docker compose
+docker compose up --build -d
+
+```
+
path: README.md
user: login: GustavoMotaDF
body: added
created_at: 2025-05-08T14:31:11Z
author_association: CONTRIBUTOR

PR comments:
user: login: CodyTseng
created_at: 2025-05-07T03:50:37Z
body: Jumble is a purely static webpage, and I'm not sure if it's necessary to deploy it using Docker. Could you share your use case with me?
author_association: OWNER
user: login: GustavoMotaDF
created_at: 2025-05-07T22:00:21Z
body: > Jumble is a purely static webpage, and I'm not sure if it's necessary to deploy it using Docker. Could you share your use case with me?

Hello my friend.

I have a fully dockerized environment, so I thought this would make it easier for other people who also want to self-host without worrying about setting up an environment, however simple it may be.
author_association: CONTRIBUTOR