Static site generator rewrite

.github/workflows/static.yml

@@ -1,43 +1,34 @@
-# Simple workflow for deploying static content to GitHub Pages
-name: Deploy static content to Pages
+name: Deploy SvelteKit to GitHub Pages
 
 on:
-  # Runs on pushes targeting the default branch
   push:
-    branches: ["main"]
-
-  # Allows you to run this workflow manually from the Actions tab
-  workflow_dispatch:
-
-# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
-permissions:
-  contents: read
-  pages: write
-  id-token: write
-
-# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
-# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
-concurrency:
-  group: "pages"
-  cancel-in-progress: false
+    branches: [svelte-ssg]
 
 jobs:
-  # Single deploy job since we're just deploying
-  deploy:
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
+  build-and-deploy:
     runs-on: ubuntu-latest
+
     steps:
-      - name: Checkout
-        uses: actions/checkout@v3
-      - name: Setup Pages
-        uses: actions/configure-pages@v3
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@v2
+      # Check out the repo code
+      - uses: actions/checkout@v4
+
+      # Use the Node version defined in .nvmrc
+      - uses: actions/setup-node@v4
         with:
-          # Upload entire repository
-          path: '.'
+          node-version-file: .nvmrc
+          cache: npm # cache node_modules for faster builds
+
+      # Install dependencies exactly as in package-lock.json
+      - name: Install dependencies
+        run: npm ci
+
+      # Build the SvelteKit project
+      - name: Build project
+        run: npm run build
+
+      # Upload the build output to GitHub Pages
       - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v2
+        uses: peaceiris/actions-gh-pages@v4
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./build          # SvelteKit static output folder

.gitignore

@@ -0,0 +1,30 @@
+test-results
+node_modules
+
+# Output
+.output
+.vercel
+.netlify
+.wrangler
+/.svelte-kit
+/build
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Env
+.env
+.env.*
+!.env.example
+!.env.test
+
+# Vite
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*
+
+# Paraglide
+src/lib/paraglide
+
+
+/assets

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

.nvmrc

@@ -0,0 +1 @@
+v22.17.0

.vscode/settings.json

@@ -0,0 +1,10 @@
+{
+    "cSpell.customDictionaries": {
+        "custom-dictionary-workspace": {
+            "name": "custom-dictionary-workspace",
+            "path": "${workspaceFolder:Local-Connectivity-Lab.github.io}/.cspell/custom-dictionary-workspace.txt",
+            "addWords": true,
+            "scope": "workspace"
+        }
+    }
+}

README.md

@@ -1 +1,78 @@
-#SCN website (operated by LCL)
+# SCN website (operated by LCL)
+
+Code repo for the seattlecommunitynetwork.org website.
+
+This site is built using [SvelteKit](https://svelte.dev/docs/kit/introduction). SvelteKit supports building fully static sites - which is how this site is built. SvelteKit uses NodeJS to run the static site build.
+
+The website is hosted on GitHub pages. See `./.github/workflows/static.yml` for deployment info.
+
+
+## How to update this website
+
+You'll want to run the site locally so you can preview your changes. It's fairly simple to setup if you have any programming experience.
+
+Make your changes and confirm them in your locally running site. Commit change to a feature Branch, and create a pull request in GitHub.
+
+The changes will then need to be reviewed and merged. After merging, a GitHub Action will kick off to build and deploy the site. This should only take 5 mins, after which your changes will be live!
+
+
+### Local setup
+
+**Install NodeJS** - two options:
+
+1. Download and install NodeJS https://nodejs.org/en/download  
+See `./.nvmrc` for the version of NodeJS to install
+1. Use NVM https://github.com/nvm-sh/nvm
+
+**Setup**
+
+1. Clone the repo
+1. Using NVM?
+    1. `nvm install` to install the correct NodeJS version
+    1. `nvm use` to use the installed NodeJS version
+1. Install dependencies with `npm install`
+1. Start a development server `npm run dev`
+
+Open your browser to http://localhost:5173
+
+
+### Update text
+
+All website text is in `./messages/en.json`.
+
+Adding or removing text sections will most certainly require updating a template
+
+
+### Update templates
+
+The website is built with a bunch of `*.svelte` files. Each file has a section for JS, HTML, and CSS.
+
+Each page of the website starts with a `+page.svelte` template, eg: `./src/routes/+page.svelte` for the homepage, and `./src/routes/about-us/+page.svelte` for the About Us.
+
+There's 1 layout template used for all pages - `./src/routes/+layout.ts`.
+
+There is a variety of reusable components in `./src/lib/components/*.svelte`
+
+
+## Tests
+
+There are automated tests using Playwright.
+
+- run this the first time, to install Playwright dependencies: `npx playwright install`
+- `npm run test` to run tests
+
+
+## Production build
+
+To create a *local* production version of your app:
+
+1. `npm run build`
+1. `npm run preview`
+1. open http://localhost:4137
+
+
+## Redirects
+
+No good way to do this with GitHub pages, so we need to create stub sveltekit pages that do a client side redirect.
+
+See `./create-redirect.js`.