jmulholland.com

This is the repo for my personal website, jmulholland.com.

Stack

• Gatsby (using React)
• Styled Components

Usage

• Clone the repo
• yarn install
• yarn dev

Deployment

• Auto-deploys to Netlify on merge to main.
• Netlify also generates a preview build for each PR.

Content

Adding a new blog post

1. Create a new .mdx file in content/posts
2. Add frontmatter with the following fields:

---
title: 'My blog post'
date: '2019-05-04'
---

Adding a new note page

1. Create a new .mdx file in content/notes
2. Add frontmatter with the following fields:

---
title: 'Title here'
lastUpdated: '2021-09-20'
tags: ['Tag One', 'Tag Two']
---

Adding a new generic page

1. Create a new .mdx file in content/pages
2. Add frontmatter with the following fields:

---
title: 'About'
---

Adding Images to .md files

1. Add an image in the same directory as the markdown post
2. Link to in the markdown like so:

![my-caption-alt](my-image-in-same-folder.jpg)

Embedding Tweets

This site uses gatsby-plugin-twitter to enable the embedding of Tweets. To embed a tweet, select the ∨ dropdown on a tweet, follow the links to copy the embed markup and paste only the blockquote section (not the script). For example:

<blockquote class='twitter-tweet'>
  <p lang='en' dir='ltr'>
    React is Legos for adults
  </p>
  &mdash; Guillermo Rauch (@rauchg) <a href='https://twitter.com/rauchg/status/1068183829737664512?ref_src=twsrc%5Etfw'>November 29, 2018</a>
</blockquote>

Adding Blockquote Sources

When adding blockquotes, use an inline HTML footer to add a source.

> To be, or not to be? That is the question.
>
> <footer>Hamlet</footer>

Make something full width in text column

• Add .full-width class