deploy: add GitHub Pages workflow and SPA routing workaround

brian033 · claude · brian033 · commit 6c7e9976b2a3 · 2026-03-01T21:18:08.000+08:00
- GitHub Actions workflow to build and deploy on push to main
- 404.html redirect for SPA client-side routing on GitHub Pages
- Harden .gitignore with .env*, IDE dirs, and TSV data files

Co-Authored-By: Claude Opus 4.6 &lt;noreply@anthropic.com&gt;
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -0,0 +1,43 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches: [main]
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - run: npm ci
+      - run: npm run build
+
+      - uses: actions/upload-pages-artifact@v3
+        with:
+          path: dist
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/.gitignore b/.gitignore
@@ -4,3 +4,7 @@ coverage/
 *.tsbuildinfo
 .DS_Store
 .worktrees/
+.env*
+.vscode/
+.idea/
+*.tsv
diff --git a/index.html b/index.html
@@ -8,6 +8,19 @@
       content="c4Lab builds computational solutions for biological problems across genomics, multi-omics, and precision medicine."
     />
     <title>c4Lab</title>
+    <!-- SPA redirect handler for GitHub Pages 404.html workaround -->
+    <script>
+      (function(l) {
+        if (l.search[1] === '/') {
+          var decoded = l.search.slice(1).split('&').map(function(s) {
+            return s.replace(/~and~/g, '&');
+          }).join('?');
+          window.history.replaceState(null, null,
+            l.pathname.slice(0, -1) + decoded + l.hash
+          );
+        }
+      }(window.location));
+    </script>
     <script type="module" src="/src/main.tsx"></script>
   </head>
   <body class="bg-paper text-ink antialiased">
diff --git a/public/404.html b/public/404.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <title>c4Lab</title>
+    <script>
+      // SPA redirect for GitHub Pages
+      // Converts the path into a query string so index.html can restore it
+      var pathSegmentsToKeep = 0;
+      var l = window.location;
+      l.replace(
+        l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
+        l.pathname.split('/').slice(0, 1 + pathSegmentsToKeep).join('/') + '/?/' +
+        l.pathname.slice(1).split('/').slice(pathSegmentsToKeep).join('/').replace(/&/g, '~and~') +
+        (l.search ? '&' + l.search.slice(1).replace(/&/g, '~and~') : '') +
+        l.hash
+      );
+    </script>
+  </head>
+  <body>
+  </body>
+</html>
