feat: add epic web stack

.nvmrc

@@ -0,0 +1 @@
+22 

README.md

@@ -209,7 +209,7 @@ export default defineConfig(() => {
 
 When using a custom server, you'll need to:
 
-1. Create a server handler (`server/app.ts`):
+1. Create a server handler (`server/index.ts`):
 ```ts
 import { createRequestHandler } from '@react-router/express';
 
@@ -363,7 +363,7 @@ VALUE_FROM_CLOUDFLARE = "Hello from Cloudflare"
 # watch_dir = "app"
 ```
 
-3. **Create Worker Entry** (`server/app.ts`):
+3. **Create Worker Entry** (`server/index.ts`):
 ```ts
 import { createRequestHandler } from 'react-router';
 
@@ -465,4 +465,4 @@ The plugin automatically:
 
 ## License
 
-MIT
+MIT

examples/cloudflare/server/index.ts

@@ -0,0 +1,31 @@
+import { createRequestHandler } from 'react-router';
+
+declare global {
+  interface CloudflareEnvironment extends Env {}
+  interface ImportMeta {
+    env: {
+      MODE: string;
+    };
+  }
+}
+
+declare module 'react-router' {
+  export interface AppLoadContext {
+    cloudflare: {
+      env: CloudflareEnvironment;
+      ctx: ExecutionContext;
+    };
+  }
+}
+// @ts-expect-error - virtual module provided by React Router at build time
+import * as serverBuild from 'virtual/react-router/server-build';
+
+const requestHandler = createRequestHandler(serverBuild, import.meta.env.MODE);
+
+export default {
+  fetch(request, env, ctx) {
+    return requestHandler(request, {
+      cloudflare: { env, ctx },
+    });
+  },
+} satisfies ExportedHandler<CloudflareEnvironment>;

examples/custom-node-server/package.json

@@ -29,7 +29,7 @@
     "@rsbuild/plugin-react-router": "workspace:*",
     "@rsdoctor/rspack-plugin": "^0.4.13",
     "@types/express": "^5.0.0",
-    "@types/express-serve-static-core": "^5.0.2",
+    "@types/express-serve-static-core": "^5.0.6",
     "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
     "tailwindcss": "^3.4.17",

examples/custom-node-server/server.js

@@ -20,7 +20,7 @@ async function startServer() {
 
     app.use(async (req, res, next) => {
       try {
-        const bundle = /** @type {import("./server/app")} */ (
+        const bundle = /** @type {import("./server/index.js")} */ (
           await devServer.environments.node.loadBundle('app')
         );
         await bundle.app(req, res, next);

examples/custom-node-server/server/index.ts

@@ -0,0 +1,18 @@
+import 'react-router';
+import { createRequestHandler } from '@react-router/express';
+
+declare module 'react-router' {
+  interface AppLoadContext {
+    VALUE_FROM_EXPRESS: string;
+  }
+}
+
+export const index = createRequestHandler({
+  // @ts-expect-error - virtual module provided by React Router at build time
+  build: () => import('virtual/react-router/server-build'),
+  getLoadContext() {
+    return {
+      VALUE_FROM_EXPRESS: 'Hello from Express',
+    };
+  },
+});

examples/epic-stack/.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,15 @@
+<!-- Summary: Put your summary here -->
+
+## Test Plan
+
+<!-- What steps need to be taken to verify this works as expected? -->
+
+## Checklist
+
+- [ ] Tests updated
+- [ ] Docs updated
+
+## Screenshots
+
+<!-- If what you're changing is within the app, please show before/after.
+You can provide a video as well if that makes more sense -->

examples/epic-stack/.github/workflows/deploy.yml

@@ -0,0 +1,174 @@
+name: 🚀 Deploy
+on:
+  push:
+    branches:
+      - main
+      - dev
+  pull_request: {}
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  actions: write
+  contents: read
+
+jobs:
+  lint:
+    name: ⬣ ESLint
+    runs-on: ubuntu-22.04
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: ⎔ Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: 📥 Download deps
+        uses: bahmutov/npm-install@v1
+
+      - name: 🖼 Build icons
+        run: npm run build:icons
+
+      - name: 🔬 Lint
+        run: npm run lint
+
+  typecheck:
+    name: ʦ TypeScript
+    runs-on: ubuntu-22.04
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: ⎔ Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: 📥 Download deps
+        uses: bahmutov/npm-install@v1
+
+      - name: 🖼 Build icons
+        run: npm run build:icons
+
+      - name: 🔎 Type check
+        run: npm run typecheck --if-present
+
+  vitest:
+    name: ⚡ Vitest
+    runs-on: ubuntu-22.04
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: ⎔ Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: 📥 Download deps
+        uses: bahmutov/npm-install@v1
+
+      - name: 🏄 Copy test env vars
+        run: cp .env.example .env
+
+      - name: 🖼 Build icons
+        run: npm run build:icons
+
+      - name: ⚡ Run vitest
+        run: npm run test -- --coverage
+
+  playwright:
+    name: 🎭 Playwright
+    runs-on: ubuntu-22.04
+    timeout-minutes: 60
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: 🏄 Copy test env vars
+        run: cp .env.example .env
+
+      - name: ⎔ Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: 📥 Download deps
+        uses: bahmutov/npm-install@v1
+
+      - name: 📥 Install Playwright Browsers
+        run: npm run test:e2e:install
+
+      - name: 🛠 Setup Database
+        run: npx prisma migrate deploy
+
+      - name: 🏦 Cache Database
+        id: db-cache
+        uses: actions/cache@v4
+        with:
+          path: prisma/data.db
+          key:
+            db-cache-schema_${{ hashFiles('./prisma/schema.prisma')
+            }}-migrations_${{ hashFiles('./prisma/migrations/*/migration.sql')
+            }}
+
+      - name: 🌱 Seed Database
+        if: steps.db-cache.outputs.cache-hit != 'true'
+        run: npx prisma migrate reset --force
+
+      - name: 🏗 Build
+        run: npm run build
+
+      - name: 🎭 Playwright tests
+        run: npx playwright test
+
+      - name: 📊 Upload report
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: playwright-report
+          path: playwright-report/
+          retention-days: 30
+
+  deploy:
+    name: 🚀 Deploy
+    runs-on: ubuntu-22.04
+    needs: [lint, typecheck, vitest, playwright]
+    # only build/deploy branches on pushes
+    if: ${{ github.event_name == 'push' }}
+
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: '50'
+
+      - name: 👀 Read app name
+        uses: SebRollen/toml-action@v1.2.0
+        id: app_name
+        with:
+          file: 'fly.toml'
+          field: 'app'
+
+      - name: 🎈 Setup Fly
+        uses: superfly/flyctl-actions/setup-flyctl@1.5
+
+      - name: 🚀 Deploy Staging
+        if: ${{ github.ref == 'refs/heads/dev' }}
+        run:
+          flyctl deploy --remote-only --build-arg COMMIT_SHA=${{ github.sha }}
+          --app ${{ steps.app_name.outputs.value }}-staging
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}
+
+      - name: 🚀 Deploy Production
+        if: ${{ github.ref == 'refs/heads/main' }}
+        run:
+          flyctl deploy --remote-only --build-arg COMMIT_SHA=${{ github.sha }}
+          --build-secret SENTRY_AUTH_TOKEN=${{ secrets.SENTRY_AUTH_TOKEN }}
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}

examples/epic-stack/.github/workflows/version.yml

@@ -0,0 +1,54 @@
+name: 🔖 Version
+on:
+  push:
+    branches:
+      - main
+      - dev
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: write
+
+jobs:
+  version:
+    name: 🚀 Update Version
+    runs-on: ubuntu-22.04
+    if: ${{ github.event_name == 'push' }}
+
+    steps:
+      - name: ⬇️ Checkout repo
+        uses: actions/checkout@v4
+
+      - name: 🔢 Get HEAD commit hash
+        id: get_head_hash
+        run: echo "HEAD_HASH=$(git rev-parse HEAD)" >> $GITHUB_OUTPUT
+
+      - name: 📅 Get current date
+        id: get_date
+        run:
+          echo "CURRENT_DATE=$(date -u +'%Y-%m-%dT%H:%M:%SZ')" >> $GITHUB_OUTPUT
+
+      - name: 📝 Update package.json
+        run: |
+          jq '
+            if .["epic-stack"] then
+              .["epic-stack"].head = "${{ steps.get_head_hash.outputs.HEAD_HASH }}" |
+              .["epic-stack"].date = "${{ steps.get_date.outputs.CURRENT_DATE }}"
+            else
+              .["epic-stack"] = {
+                "head": "${{ steps.get_head_hash.outputs.HEAD_HASH }}",
+                "date": "${{ steps.get_date.outputs.CURRENT_DATE }}"
+              }
+            end
+          ' package.json > temp.json && mv temp.json package.json
+
+      - name: 💾 Commit changes
+        run: |
+          git config --local user.email "kody@epicweb.dev"
+          git config --local user.name "kody"
+          git add package.json
+          git commit -m "Update epic-stack version [skip ci]"
+          git push

examples/epic-stack/.gitignore

@@ -0,0 +1,26 @@
+node_modules
+.DS_store
+
+/build
+/server-build
+.env
+.cache
+
+/prisma/data.db
+/prisma/data.db-journal
+/tests/prisma
+
+/test-results/
+/playwright-report/
+/playwright/.cache/
+/tests/fixtures/email/
+/coverage
+
+/other/cache.db
+
+# Easy way to create temporary files/folders that won't accidentally be added to git
+*.local.*
+
+# generated files
+/app/components/ui/icons
+.react-router/

examples/epic-stack/.prettierignore

@@ -0,0 +1,15 @@
+node_modules
+
+/build
+/public/build
+/server-build
+.env
+
+/test-results/
+/playwright-report/
+/playwright/.cache/
+/tests/fixtures/email/*.json
+/coverage
+/prisma/migrations
+
+package-lock.json

examples/epic-stack/.vscode/extensions.json

@@ -0,0 +1,11 @@
+{
+	"recommendations": [
+		"bradlc.vscode-tailwindcss",
+		"dbaeumer.vscode-eslint",
+		"esbenp.prettier-vscode",
+		"prisma.prisma",
+		"qwtel.sqlite-viewer",
+		"yoavbls.pretty-ts-errors",
+		"github.vscode-github-actions"
+	]
+}