personal-site

Personal Site - niall.design

This project is my personal portfolio web site.
It is curently running live at niall.design or niallains.github.io/personal-site/dist.

Development

Set up

Install Git
Install Node and NVM

Download code and install dev packages using Node v22:

  git clone https://github.com/NiallAins/personal-site.git;
  cd personal-site;
  nvm use 22;
  npm ci;

Start development

npm run dev

This will auto-convert _vars.scss to consts.scss.ts, build scripts, styles, and template files to ./dist, then repeat on file change.

Open ./dist/index.html in browser to see changes running.
VSCode extension “Live Server” can be used to auto-refresh browser on file change.
The base URLs for both development and production are set in ./build-scripts/base-url.js

Add a project

• Add project details to data/projects.ts
• Add project image to thumbnails as project-title-kebab-case.png
• Run npm run prep-images to update production image sizes

Push changes

Commit and push all changes to non-production branch in GitHub:

  npm run push "Commit message"

Deploy

  npm run push-reploy "Commit message"

This will push all changes to non-production branch, then copy branch main to prod, build scripts and templates in production mode, then push to Git where changes will be reflected on GitHub Pages site.