Building this Blog w/ Strapi JS

Here is how I built JoshOnCode.com using Strapi.js and Nuxt.js. I am going to cover a lot of pitfalls I ran into with various technologies. By the end of this series you should have a good idea how to build your own similar blog.

Part 3: Getting Started with Strapi.js

My initial installation experience with Strapi was clean and simple. They have a really good Quick Start Guide that will get you going.

Rather than walk you through the same process step by step again when they did such a good job instead it might be worth noting some things I wish I had known before I got started:

  • Join the Strapi Slack channel! Everyone is super helpful and people typically get answers within an hour from what I have experienced.
  • Strapi does not have a full Django-like migration system for production, so complex database migrations (like deleting columns or creating database views) requires some manual work. So take some time with the initial collections you create in the administrative interface.
  • All of the collections and columns you create in the administrative interface are stored in the api folder and each of them has customizable routes, controller, model hooks (before create, after create, etc.), and a service.
  • If you want to do GraphQL, there is a brilliant graphql plugin for Strapi which completely automatically builds out entire GraphQL views for you.
  • Strapi has a frustrating mix of camelCase, snake_case, and kebab-case. Do not make the mistake I did and try to change this.
  • When creating collections and fields, pay attention to when it says "Display name" vs. field name. Collections have a display name (e.g. standard English which can include spaces). Field names, however, I typically wrote in with snake_case. This seemed to work the best for me.
  • Strapi attempts to convert your singular names into plural and sometimes messes this up. For example, I had a collection called "Blog Series". Strapi named the singular version "blogSery". Rather than fighting this, I just gave in and let Strapi be wrong.

This first part was rather easy, now I needed to implement a frontend. For this I chose Nuxt.js, which I will cover in my next post.