website-frontend

My website's frontend.

Note: this repository/project is UNLICENSED. If you don't know what that means, Google it.

Also: the "website-projectile-pixels" dependency is pointed to a private repository, so it will always fail to install for anyone but me.

Installation

Be sure that Git >= 2 is installed.

Open a command line at, or change directory (cd) to where you'd like the project to exist (as a sub-directory).

Checkout the repository:

git clone [email protected]:stevenvachon/website-frontend.git

Open the project directory:

cd website-frontend

Be sure that Node.js >= 23 is installed.

Install all dependencies:

npm install

Building & Linting

A development build can be performed automatically as files change via:

npm run dev

A production build can be performed manually via:

npm run build

A lint for all JavaScript files via:

npm run lint

Testing

The test suite can be ran manually via:

npm test

… or as files are changed via:

npm run test:watch

Deploying

Deployment will be performed automatically when pushing/merging to the "main" branch.

To-do

• Remove comments and TODOs.
• Add a--simple math or honeypot--captcha to the contact form or switch to JS submission to prevent any abuse from bots.
• Use GitHub Packages instead of private repository for website-projectile-pixels.
• Switch from Nunjucks to JSX (or TSX) when it supports front matter.
• Move blog post titles from their front matter to # header when possible.
• Move title concatenations from index layout to their respective chained layouts' front matter when possible.
• Remove build:clean:post npm script when possible.
• Add print CSS; maybe use @media print {}.
• Try using display: grid instead of flex because it was blocking container-type.
• Add @container query to remove blog sidebar when too narrow (primarily for user-set larger fonts).
• Add site.version to styles.css and scripts.js.
• Try using parcel esbuild or Vite instead of webpack.
• Try element-ready again when possible: sindresorhus/element-ready#52.
• Clean up text effects suffering from mattboldt/typed.js#624.
• Add HTML and [sitemap] XML validator to build--npm run validate:html, npm run validate:sitemap, npm test (runs both).
• Inline code demos with some widget.
• Fix <figcaption> issue.
• Blog archives.
• Exclude atom/rss feed from sitemap: 11ty/eleventy-plugin-rss#62
• Make tags list in content/blog/category.njk dynamic somehow and strip the "blog-category-" prefix from generated output:
  • 11ty/eleventy#3690
  • 11ty/eleventy#3691