aaronvanston.tech

Source for my personal website aaronvanston.tech. This site is built around speed maximising lighthouse scores to 100%.

Tech stach

• React
• Gatsby
• styled-components
• Hosted with netlify

Set-up

Development

$ yarn develop

The server is available at [http://localhost:8000] with a graphql interfave availible at [http://localhost:8000/___graphql].

Production build

$ yarn build

This will generate a ./public directory with the static site contents. This can now be used within a S3 bucket or using a simpel webserver to serve the assets.

Content

All content is stored within markdown files located in the content/posts/ or /content/projects/ folders. These Are used at build time to generate the various pages within the blog and projects index.

In order to create a new posts/project you create a new markdwn file (and/or directory if there are associated assets) within one of the directories. This file requires the following frontmatter:

  ---
  path: "/projects/project-name" 
  date: "2019-04-25"
  title: "Project title"
  hero: "./hero.png"
  ---

Note: the hero image is optional for a file within the content/posts/ directory.

Embedding

Within the posts and projects markdown files you can embeded various 3rd party content, these include:

Oembed

Which allows for things like twitter and codepen

<!-- shortcode structure -->
`oembed: <URL>`

<!-- live example -->
`oembed: https://codepen.io/aaronvanston/pen/pEjkNq`

License

Licensed under the MIT License. Feel free to use parts of the code in your own projects with attribution!