Personal Blog

Prerequisites

1. Node.js must be installed on your system.
2. NVM (Node Version Manager) must be installed on your system.

Steps

1. Clone this project.

git clone git@github.com:edgar971/personal-blog.git

2. Use NVM to switch to the required Node.js version:

nvm use

3. Install the required dependencies:

npm i

4. Start the development server

npm start

5. Open a browser and visit http://localhost:8000 to see your Gatsby site in action!

Troubleshooting

If you encounter any issues during the setup process, try the following steps:

• Make sure that the correct Node.js version is -installed on your system.
• Make sure that the required dependencies are installed.
• Check the logs for any error messages.

Adding content

Adding a new blog post

New blog posts will be shown on the index page (the three most recent ones) of this theme and on the blog overview page. They can be added by creating MDX files inside content/posts. General setup:

1. Create a new folder inside content/posts
2. Create a new index.mdx file, and add the frontmatter
3. Add images to the created folder (from step 1) you want to reference in your blog post
4. Reference an image as your banner in the frontmatter
5. Write your content below the frontmatter
6. Add a slug to the frontmatter to use a custom slug, e.g. slug: "/my-slug" (Optional)
7. Use defer to opt-in into Deferred Static Generation (DSG) (optional)

Frontmatter reference:

---
title: Introduction to "Defence against the Dark Arts"
date: 2019-11-07
description: Defence Against the Dark Arts (abbreviated as DADA) is a subject taught at Hogwarts School of Witchcraft and Wizardry and Ilvermorny School of Witchcraft and Wizardry.
defer: false
tags:
  - Tutorial
  - Dark Arts
banner: ./defence-against-the-dark-arts.jpg
canonicalUrl: https://random-blog-about-curses.com/curses-counter-curses-and-more
---

The fields description, banner, defer and canonicalUrl are optional! If no description is provided, an excerpt of the blog post will be used. If no banner is provided, the default siteImage (from siteMetadata) is used. If no canonicalUrl is provided, it will not be included in the header.

The date field has to be written in the format YYYY-MM-DD!

Adding a new page

Additional pages can be created by placing MDX files inside contents/pages, e.g. an "About" or "Contact" page. You'll manually need to link to those pages, for example by adding them to the navigation (in siteMetadata). General instructions:

1. Create a new folder inside content/pages
2. Create a new index.mdx file, and add the frontmatter
3. Write your content below the frontmatter
4. Optionally add files/images to the folder you want to reference from the page
5. Use defer to opt-in into Deferred Static Generation (DSG) (optional)

Frontmatter reference:

---
title: About
slug: "/about"
defer: false
---