Flyio Preview Deploys

.dockerignore

@@ -0,0 +1,26 @@
+# build output
+dist/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store
+.idea/
+.eslintcache
+.vercel
+.puppeteer
+
+.astro
+.gitignore

.github/workflows/fly-deploy.yml

@@ -0,0 +1,18 @@
+# See https://fly.io/docs/app-guides/continuous-deployment-with-github-actions/
+
+name: Fly Deploy
+on:
+  push:
+    branches:
+      - main
+jobs:
+  deploy:
+    name: Deploy app
+    runs-on: ubuntu-latest
+    concurrency: deploy-group    # optional: ensure only one action runs at a time
+    steps:
+      - uses: actions/checkout@v4
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}

.github/workflows/fly-review.yml

@@ -0,0 +1,42 @@
+name: Deploy Review App
+on:
+  # Run this workflow on every PR event. Existing review apps will be updated when the PR is updated.
+  pull_request:
+    types: [opened, reopened, synchronize, closed]
+
+env:
+  FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}
+  # Set these to your Fly.io organization and preferred region.
+  FLY_REGION: iad
+  FLY_ORG: playful-programming
+
+jobs:
+  review_app:
+    runs-on: ubuntu-latest
+    outputs:
+      url: ${{ steps.deploy.outputs.url }}
+    # Only run one deployment at a time per PR.
+    concurrency:
+      group: pr-${{ github.event.number }}
+
+    # Deploying apps with this "review" environment allows the URL for the app to be displayed in the PR UI.
+    # Feel free to change the name of this environment.
+    environment:
+      name: review
+      # The script in the `deploy` sets the URL output for each review app.
+      url: ${{ steps.deploy.outputs.url }}
+
+    steps:
+      - name: Get code
+        uses: actions/checkout@v4
+
+      - name: Deploy PR app to Fly.io
+        id: deploy
+        uses: superfly/[email protected]
+
+      - name: Clean up preview environment
+        uses: strumwolf/delete-deployment-environment@v2
+        if: ${{ github.event.action == 'closed' }}
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          environment: pr-${{ github.event.number }}

Dockerfile

@@ -0,0 +1,50 @@
+FROM node:20.11-slim as dependencies
+WORKDIR /app
+
+# Install pnpm and build dependencies
+RUN npm install -g [email protected] && \
+    apt-get update -qq && \
+    apt-get install -y python3 build-essential && \
+    rm -rf /var/lib/apt/lists/*
+
+# Create the environments directory and env file FIRST
+RUN mkdir -p src/environments && \
+    echo "PLAYWRIGHT_BROWSERS_PATH=/app/pw-browsers" > src/environments/browser-path.env
+
+# Copy package files
+COPY package.json pnpm-lock.yaml ./
+
+# Install dependencies and extra packages needed for content generation
+ENV PLAYWRIGHT_BROWSERS_PATH=/app/pw-browsers
+ENV HUSKY=0
+RUN pnpm install && \
+    pnpm playwright install chromium
+
+# Content generation stage
+FROM dependencies as content-builder
+WORKDIR /app
+
+# Copy source files
+COPY . .
+
+# Copy over the node_modules and Playwright browsers
+COPY --from=dependencies /app/node_modules ./node_modules
+COPY --from=dependencies /app/pw-browsers ./pw-browsers
+COPY --from=dependencies /app/src/environments/browser-path.env ./src/environments/browser-path.env
+
+# First generate the content
+RUN pnpm run epub & pnpm run social-previews:build & wait
+
+# Run just the Astro build
+RUN pnpm exec astro build --experimental-integrations || if [ -d "dist" ]; then \
+        exit 0; \
+    else \
+        exit 1; \
+    fi
+
+# Production stage for static files
+FROM nginx:alpine
+COPY --from=content-builder /app/dist /usr/share/nginx/html
+
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

astro.config.ts

@@ -4,7 +4,6 @@ import sitemap from "@astrojs/sitemap";
 import icon from "astro-icon";
 import { EnumChangefreq as ChangeFreq } from "sitemap";
 import { siteUrl } from "./src/constants/site-config";
-import vercel from "@astrojs/vercel";
 import symlink from "symlink-dir";
 import * as path from "path";
 import { languages } from "./src/constants/index";
@@ -18,16 +17,15 @@ await symlink(path.resolve("content"), path.resolve("public/content"));
 
 export default defineConfig({
 	site: siteUrl,
-	adapter: vercel({
-		// Uses Vercel's Image Optimization API: https://vercel.com/docs/image-optimization
-		imageService: true,
-		imagesConfig: {
-			sizes: SUPPORTED_IMAGE_SIZES,
-			domains: [],
-			formats: ["image/avif", "image/webp"],
+	output: "static",
+	image: {
+		service: {
+			entrypoint: "astro/assets/services/sharp",
+			config: {
+				limitInputPixels: false,
+			},
 		},
-		devImageService: "sharp",
-	}),
+	},
 	integrations: [
 		icon(),
 		preact({ compat: true }),

fly.toml

@@ -0,0 +1,22 @@
+# fly.toml app configuration file generated for playfulprogramming-bak on 2024-12-02T18:59:27-08:00
+#
+# See https://fly.io/docs/reference/configuration/ for information about how to use this file.
+#
+
+app = 'playfulprogramming-bak'
+primary_region = 'sjc'
+
+[build]
+  dockerfile = 'Dockerfile'
+
+[http_service]
+  internal_port = 80
+  force_https = true
+  auto_stop_machines = 'stop'
+  auto_start_machines = true
+  min_machines_running = 0
+
+[[vm]]
+  memory = '1gb'
+  cpu_kind = 'shared'
+  cpus = 1

nginx.conf

@@ -0,0 +1,17 @@
+server {
+    listen 80;
+    root /usr/share/nginx/html;
+    index index.html;
+    etag on;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+        add_header Cache-Control "no-cache";
+    }
+
+    # Cache static assets
+    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2)$ {
+        expires 1y;
+        add_header Cache-Control "public, no-transform";
+    }
+}

package.json

@@ -90,11 +90,13 @@
 		"hast-util-heading-rank": "^3.0.0",
 		"hast-util-to-string": "^3.0.0",
 		"hastscript": "^9.0.0",
+		"html-escaper": "^3.0.3",
 		"husky": "^9.0.11",
 		"identity-obj-proxy": "^3.0.0",
 		"jest-location-mock": "^2.0.0",
 		"json5": "^2.2.3",
 		"junk": "^4.0.1",
+		"kleur": "^4.1.5",
 		"lint-staged": "^15.2.7",
 		"live-server": "^1.2.2",
 		"lru-cache": "^11.0.2",
@@ -110,6 +112,7 @@
 		"prettier-plugin-astro": "^0.14.1",
 		"react": "npm:@preact/[email protected]",
 		"react-dom": "npm:@preact/[email protected]",
+		"rehype-parse": "9.0.0",
 		"rehype-raw": "^7.0.0",
 		"rehype-slug-custom-id": "^2.0.0",
 		"rehype-stringify": "^10.0.0",