Strapi is the most popular open-source Headless CMS and is based on Node.js. Gatsby allows developers to quickly build very fast static websites and apps. You can combine then to create a full-stack website using mostly JavaScript.

We've released a full course to help you learn to use Gatsby and Strapi to code a portfolio project. The course was developed by John Smilga, who is an experienced teacher and course creator.

The project includes a portfolio page with dynamically updated text pulled in from Strapi through a query. You will learn how to implement toggles, a hero section, links, articles, multiple pages and more. The project is fully responsive.

Much of the content will be created programmatically from markdown files using GatsbyJS. The project also integrates Formspree to collect form data.

Besides learning the basics of building a full-stack site with Gatstby and Strapi, you will also learn about the following topics:

  • Google Fonts
  • Deploying with Digital Ocean
  • Search Engine Optimization
  • Gatsby Browser
  • Sitemaps

Watch the full course on the freeCodeCamp.org YouTube channel (5 hour watch).