omundy / camplajolla

A fictional national park exploring militarism in higher education

README

TODO

• Launch Notes
  • Edit all records
  • Regenerate all slugs

Deploy Astro to Github Pages

Deploying to Github Pages is easy if all your resources are online. This was not my case.

Gotchas

1. Local data - All my data came from a local MySQL database, so none of the Github Pages deploy scripts worked (they couldn't get the data!)
2. Deploying to a subpath - the repo was not my main omundy.github.io but omundy.github.io/camplajolla which makes the root paths difficult to set up. (see this postbuild article)
3. Dotfiles - Github Pages doesn't automatically publish dotfiles. So the required .nojekyll file wasn't in the root directory of the build
4. Managing builds - W/o remote deployment I woud have build files in the main directory. The gh-pages package automatically builds and deploys your site to a gh-pages branch. (other uses) so it doesn't pollute the project. You can add the --dotfiles flag.

  # build, copy whole build to root
  "build": "astro build && rm -rf ../dist && mv ./dist ../dist",
  # build, copy individual to root
  "build": "astro build && cp -R ./dist/{_astro,about,assets,collection,defensonomy,404.html,index.html,manifest_*,robots.txt,site.webmanifest} ../",

1. Mark output as static in config output: "static"
2. Install npm install gh-pages -D
3. Add these to your package.json
   1. npm run dev - Start dev server localhost:4321
   2. npm run build - Build static site to ./dist/ and copies git files
   3. npm run deploy - uses gh-pages package to publish to gh-pages branch, includes dotfiles

{
    "scripts": {
        "build": "astro build && cp ./{.gitattributes,.gitignore} ./dist",
        "predeploy": "npm run build",
        "deploy": "gh-pages -d dist --branch gh-pages --dotfiles"
    }
}    

Astro Resources

• Astro documentation https://docs.astro.build/
• Astro themes https://astro.new/
• Discord

Typescript considerations

• Add // @ts-nocheck to the top of the <script> tag (the client side script) to silence all the Typescript errors in your .astro files. It saves from adding // @ts-ignore to each line.
• Maybe also try?... In VS Code add this to your settings.json file "typescript.validate.enable": false,

Pagefind

• Awesome, dig in the code for implementation and docs https://pagefind.app/docs/
• Copy built files to public for local testing https://chrispennington.blog/blog/pagefind-static-search-for-astro-sites/
• Add URL query params to the box and start search https://kiko.io/post/Pagefind-UI-and-URL-Parameters/