Feat: Preview environments

.github/workflows/deploy-with-docker-dev.yaml

@@ -12,6 +12,8 @@ on:
 # A workflow run is made up of one or more jobs that can run sequentially or in parallel
 jobs:
   build-push-docker:
+    permissions: 
+      pull-requests: write
     runs-on: ubuntu-latest
     environment: dev
 
@@ -26,8 +28,12 @@ jobs:
           known_hosts: ${{ secrets.KNOWN_HOSTS }}
 
       - name: Deploy to Server
+        id: deploy
         run: |
-          BUILD_ARGS="--build-arg NEXT_PUBLIC_VERCEL_URL=gh-dev.fredkiss.dev --build-arg GITHUB_REDIRECT_URI=https://gh-dev.fredkiss.dev/api/auth/callback --build-arg SESSION_SECRET=${{ secrets.SESSION_SECRET }} --build-arg DATABASE_URL=${{ secrets.POSTGRES_DB_URL }} --build-arg GITHUB_CLIENT_ID=${{ secrets.GH_CLIENT_ID }} --build-arg GITHUB_SECRET=${{ secrets.GH_SECRET }} --build-arg GITHUB_PERSONAL_ACCESS_TOKEN=${{ secrets.GH_PERSONAL_ACCESS_TOKEN }} --build-arg REDIS_HTTP_USERNAME=${{ secrets.REDIS_HTTP_USERNAME }} --build-arg REDIS_HTTP_PASSWORD=${{ secrets.REDIS_HTTP_PASSWORD }} --build-arg KV_PREFIX=__gh_next__cache_dev_"
+          BUILD_ARGS="--build-arg NEXT_PUBLIC_VERCEL_URL=gh-${GITHUB_PR_NUMBER}.fredkiss.dev --build-arg GITHUB_REDIRECT_URI=https://gh.fredkiss.dev/api/auth/callback --build-arg SESSION_SECRET=${{ secrets.SESSION_SECRET }} --build-arg DATABASE_URL=${{ secrets.DEV_LOCAL_POSTGRES_DB_URL }} --build-arg REMOTE_DATABASE_URL=${{ secrets.DEV_REMOTE_POSTGRES_DB_URL }} --build-arg GITHUB_CLIENT_ID=${{ secrets.GH_CLIENT_ID }} --build-arg GITHUB_SECRET=${{ secrets.GH_SECRET }} --build-arg GITHUB_PERSONAL_ACCESS_TOKEN=${{ secrets.GH_PERSONAL_ACCESS_TOKEN }} --build-arg REDIS_HTTP_USERNAME=${{ secrets.REDIS_HTTP_USERNAME }} --build-arg REDIS_HTTP_PASSWORD=${{ secrets.REDIS_HTTP_PASSWORD }} --build-arg KV_PREFIX=__gh_next__cache_dev_"
+          GIT_BRANCH=${GITHUB_HEAD_REF:-${GITHUB_REF#refs/heads/}}
+          GITHUB_BRANCH_SLUG="${GIT_BRANCH//[^a-zA-Z0-9]/-}"
+          echo branch-slug=$GITHUB_BRANCH_SLUG
           ssh -p $DEPLOY_PORT $DEPLOY_USER@$DEPLOY_DOMAIN "
           source ~/.zshrc
           set -e -o errexit
@@ -41,27 +47,38 @@ jobs:
           nvm use 20
 
           echo Pulling latest version...
-          GIT_BRANCH=${GITHUB_HEAD_REF:-${GITHUB_REF#refs/heads/}}
-          echo git branch=\$GIT_BRANCH
-          git fetch origin \$GIT_BRANCH
-          git checkout \$GIT_BRANCH
-          git pull origin \$GIT_BRANCH
+          echo git branch=$GIT_BRANCH
+          git fetch origin $GIT_BRANCH
+          git checkout $GIT_BRANCH
+          git pull origin $GIT_BRANCH
 
           echo 'Build with docker (and cache)...🔄' 
           export DOCKER_BUILDKIT=1
 
-          # Use cache from remote repository, tag as latest, keep cache metadata
-          docker buildx build --push $BUILD_ARGS -f ./docker/Dockerfile.dev -t dcr.fredkiss.dev/gh-next:dev .
-
-          echo 'build successful ✅'
+          # Build & push docker image
+          docker buildx build --push ${BUILD_ARGS} -f ./docker/Dockerfile.dev -t dcr.fredkiss.dev/gh-next:pr-${GITHUB_PR_NUMBER} .
 
-          # Start docker instances
-          echo 'updating docker services...🔄'
-          docker stack deploy --with-registry-auth --compose-file ./docker/docker-stack.dev.yaml gh-stack-dev
-          echo 'services updated succesfully ✅'
+          echo 'Docker build successful ✅'
+          cd pr-preview-workflow
+          bun install --frozen-lockfile
+          bun run index.ts --pr-id ${GITHUB_PR_NUMBER} \
+             --pr-branch ${GITHUB_BRANCH_SLUG} \
+             --caddy-config-path ${{ secrets.CADDY_CONFIG_DIR }} \
+             --reload-caddy --reload-docker
           "
+          echo "url=https://gh-${GITHUB_PR_NUMBER}.gh.fredkiss.dev, https://gh-${GITHUB_BRANCH_SLUG}.gh.fredkiss.dev" >> $GITHUB_OUTPUT
         env:
           DEPLOY_PORT: ${{ secrets.DEPLOY_PORT }}
           DEPLOY_DIR: ${{ secrets.DEPLOY_DIR }}
           DEPLOY_DOMAIN: ${{ secrets.DEPLOY_DOMAIN }}
           DEPLOY_USER: ${{ secrets.DEPLOY_USER }}
+          GITHUB_PR_NUMBER: ${{ github.event.pull_request.number }}
+
+      - name: Comment PR with Deployed URL
+        uses: unsplash/comment-on-pr@v1.3.0
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          msg: 'Application deployed @: ${{ steps.deploy.outputs.url }}'
+          check_for_duplicate_msg: true
+

.github/workflows/deploy-with-docker-prod.yaml

@@ -29,7 +29,7 @@ jobs:
 
       - name: Deploy to Server
         run: |
-          BUILD_ARGS="--build-arg NEXT_PUBLIC_VERCEL_URL=gh.fredkiss.dev --build-arg GITHUB_REDIRECT_URI=https://gh.fredkiss.dev/api/auth/callback --build-arg SESSION_SECRET=${{ secrets.SESSION_SECRET }} --build-arg DATABASE_URL=${{ secrets.POSTGRES_DB_URL }} --build-arg GITHUB_CLIENT_ID=${{ secrets.GH_CLIENT_ID }} --build-arg GITHUB_SECRET=${{ secrets.GH_SECRET }} --build-arg GITHUB_PERSONAL_ACCESS_TOKEN=${{ secrets.GH_PERSONAL_ACCESS_TOKEN }} --build-arg REDIS_HTTP_USERNAME=${{ secrets.REDIS_HTTP_USERNAME }} --build-arg REDIS_HTTP_PASSWORD=${{ secrets.REDIS_HTTP_PASSWORD }} --build-arg KV_PREFIX=__gh_next__cache_prod_"
+          BUILD_ARGS="--build-arg NEXT_PUBLIC_VERCEL_URL=gh.fredkiss.dev --build-arg GITHUB_REDIRECT_URI=https://gh.fredkiss.dev/api/auth/callback --build-arg SESSION_SECRET=${{ secrets.SESSION_SECRET }} --build-arg DATABASE_URL=${{ secrets.POSTGRES_DB_URL }} --build-arg REMOTE_DATABASE_URL=${{ secrets.REMOTE_POSTGRES_DB_URL }} --build-arg GITHUB_CLIENT_ID=${{ secrets.GH_CLIENT_ID }} --build-arg GITHUB_SECRET=${{ secrets.GH_SECRET }} --build-arg GITHUB_PERSONAL_ACCESS_TOKEN=${{ secrets.GH_PERSONAL_ACCESS_TOKEN }} --build-arg REDIS_HTTP_USERNAME=${{ secrets.REDIS_HTTP_USERNAME }} --build-arg REDIS_HTTP_PASSWORD=${{ secrets.REDIS_HTTP_PASSWORD }} --build-arg KV_PREFIX=__gh_next__cache_prod_"
           ssh -p $DEPLOY_PORT $DEPLOY_USER@$DEPLOY_DOMAIN "
           source ~/.zshrc
           set -e -o errexit
@@ -50,10 +50,8 @@ jobs:
           echo 'Build with docker (and cache)...🔄' 
           export DOCKER_BUILDKIT=1
 
-          # Use cache from remote repository, tag as latest, keep cache metadata
-          docker buildx build --push $BUILD_ARGS -f ./docker/Dockerfile.prod -t dcr.fredkiss.dev/gh-next:latest \
-            --cache-from type=registry,ref=dcr.fredkiss.dev/gh-next:prod-buildcache,mode=max \
-            --cache-to type=registry,ref=dcr.fredkiss.dev/gh-next:prod-buildcache,mode=max .
+          # Build & push docker image
+          docker buildx build --push $BUILD_ARGS -f ./docker/Dockerfile.prod -t dcr.fredkiss.dev/gh-next:latest .
 
           echo 'build successful ✅'
 

.gitignore

@@ -38,4 +38,12 @@ next-env.d.ts
 # cloudfare pages
 .wrangler/
 /cache/
-.idea/
+.idea/
+
+# Docker 
+docker-stack.pr.yaml
+caddyfile.pr
+pr.caddyfile
+*.bak
+*.log
+notes.md

.vscode/settings.json

@@ -1,14 +1,17 @@
 {
-  "typescript.preferences.importModuleSpecifier": "non-relative",
-  "typescript.tsdk": "node_modules/typescript/lib",
-  "editor.defaultFormatter": "biomejs.biome",
+  "[javascript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
   "[typescript]": {
     "editor.defaultFormatter": "biomejs.biome"
   },
   "[typescriptreact]": {
     "editor.defaultFormatter": "biomejs.biome"
   },
-  "[javascript]": {
+  "editor.defaultFormatter": "biomejs.biome",
+  "typescript.preferences.importModuleSpecifier": "non-relative",
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "[json]": {
     "editor.defaultFormatter": "biomejs.biome"
   }
 }

docker/Dockerfile.dev

@@ -21,6 +21,7 @@ RUN \
 
 FROM node:20-alpine3.19 AS builder
 
+ARG REMOTE_DATABASE_URL
 ARG SESSION_SECRET
 ARG DATABASE_URL
 ARG GITHUB_CLIENT_ID
@@ -33,6 +34,7 @@ ARG REDIS_HTTP_USERNAME
 ARG REDIS_HTTP_PASSWORD
 ARG GITHUB_REDIRECT_URI="http://localhost:3000/api/auth/callback"
 
+ENV REMOTE_DATABASE_URL=$REMOTE_DATABASE_URL
 ENV NEXT_PUBLIC_VERCEL_URL=$NEXT_PUBLIC_VERCEL_URL
 ENV SESSION_SECRET=$SESSION_SECRET
 ENV DATABASE_URL=$DATABASE_URL
@@ -54,7 +56,7 @@ ENV NEXT_TELEMETRY_DISABLED 1
 RUN \
  if [ -f yarn.lock ]; then yarn build; \
  elif [ -f package-lock.json ]; then npm run build; \
- elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm && pnpm run build; \
+ elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm && pnpm run db:migrate-docker && pnpm run build; \
  else echo "Lockfile not found." && exit 1; \
  fi
 

docker/Dockerfile.prod

@@ -23,6 +23,7 @@ FROM node:20-alpine3.19 AS builder
 
 ARG SESSION_SECRET
 ARG DATABASE_URL
+ARG REMOTE_DATABASE_URL
 ARG GITHUB_CLIENT_ID
 ARG GITHUB_SECRET
 ARG GITHUB_PERSONAL_ACCESS_TOKEN
@@ -33,6 +34,7 @@ ARG REDIS_HTTP_URL="http://webdis:7379"
 ARG NEXT_PUBLIC_VERCEL_URL="gh.fredkiss.dev"
 ARG GITHUB_REDIRECT_URI="https://gh.fredkiss.dev/api/auth/callback"
 
+ENV REMOTE_DATABASE_URL=$REMOTE_DATABASE_URL
 ENV NEXT_PUBLIC_VERCEL_URL=$NEXT_PUBLIC_VERCEL_URL
 ENV SESSION_SECRET=$SESSION_SECRET
 ENV DATABASE_URL=$DATABASE_URL