Preparing your Gatsby site for production
Gatsby is a wonderful framework for quickly building static sites using React and GraphQL. Here are some things to look out for when you’re ready to put your Gatsby site live.
Metadata fun
It’s not the most fun part of building a website, but good metadata will help your site be found in search engines and will encourage people to share it on social media. It will also help things like Google Assistant and Siri to gather knowledge from your website.
A good way to check what state your basic meta tags are in is by using a tool like metatags.io.
Within Gatsby, you’ll want to use react-helmet
to set meta tags.
Specific things to look out for:
- Make sure each page has distinct titles and descriptions
- Add a social media image (
og:image
andtwitter:image
properties) - Set canonical URLs for any pages that can be accessed via multiple URLs, to tell search engines which URL is the main access point for a specific bit of content
Console log no more
A good clean up exercise is to check if there are any console.log()
statements left in your code. These might introduce bugs, and could slow down render performance if you’re logging large…