This repository has two build targets:

1. A static website, https://reeds.website
2. A server

See Topic: Operating This Website for deployment operations explanation and other information.

Still early development, so these operations are not well defined and in flux. This document may already be out of date.

tl;dr: For a fresh install run,

npm run build

After that, you can run this for a development server:

npm run static:dev:compile

And the same for CSS in a separate terminal:

npm run static:dev:css

Then in a third terminal, serve the build output directory

npm run static:dev:serve

Generating new posts has a few disparate steps. Use this to set

npm run static:dev:generate-new-post -- "Project: This is the title" then-a-slug-here

Steps explained:

This is what Netlify runs to build the site for deployment.

This may be out of date, but it runs roughly these scripts, described below:

npm run static:build:clean && \
  npm run static:build:static && \
  npm run static:build:jsxString && \
  npm run static:build:jsxBrowser && \
  npm run static:build:buildCompiler && \
  npm run static:build:compile && \
  npm run static:build:css

Empty out the ephemeral directories, build and tmp

Copy static files from source to the build output directory.

Compile JSX implementation from its sources, one for strings and one for browser elements, to tmp/ JS files. When you inject these files into a JSX file (or .tsx), it provides a JSX implementation that outputs a big string which contains all the HTML.

Each JSX implementation consists of two exports, MyJSXFactory and MyJSXFragmentFactory which respectively match what I wrote in my tsconfig.json entries jsxFactory and jsxFragmentFactory.

Prepare for compilation by compiling the compile script from TypeScript to JavaScript I can run with node.

Compiles all JSX and MDX inputs into HTML outputs. In order to function, requires that static:build:buildCompiler and static:build:jsx were run, and their output is in the tmp/ directory.

Compile Tailwind and the rest of CSS via PostCSS.

Runs PostCSS/Tailwind CSS compilation and watches for changes and reruns.

Runs static:build:compile and watches for file changes to rerun on any edit of the source files.

Run a web server on the output of compilation.

Runs a utility script to automate some disparate steps involved in writing a new post. Create the file, make a link entry for it, etc. I forget all the things it does, and follow the prompts it gives. I use git to check the output of this script after it runs.

Requires Supabase database password, which I store in a password storage. Also requires the CLI to be installed (should be installed via npm install), logged in, and then to be linked (may not require linking):

npm i supabase@">=1.8.1" --save-dev
npx supabase login
npx supabase link
npm run all:dev:downloadGeneratedDatabaseTypes

Docker CLI required.

Make sure your terminal is in this directory and not the git project root.

For local development, to build and run the server:

npm run server:dev:build && npm run server:dev:run

To deploy (flyctl CLI required):

npm run server:build:deploy