folio

My portfolio website.

Setup

Clone the repo, and install dependencies:

yarn

The site uses Jekyll to build static templates, so the next step is to install it (see their website for further instructions):

gem install jekyll

In two terminal tabs, run the following commands:

yarn run watch
jekyll serve

The site uses PostCSS for post-processing and concatenation of CSS files.

The SuitCSS component naming conventions are followed.

To lint the CSS:

yarn run lint:css

The JS uses Webpack to keep files separated and to protect scope.

ESLint is used to keep JS consistent.

To lint the JS:

yarn run lint:js

The main heading font is Raleway

Webfont versions have been downloaded from fontpro

...apart from the WOFF and WOFF2 files that have been manually converted:

The main body font is EB Garamond

This has been downloaded from and converted with Font Squirrel

When adding a new portfolio project or lab, the following images need prepping:

To check for outdated packages:

yarn outdated

To update packages:

yarn upgrade-interactive --latest

npx npm-check-updates -u