We're live-coding on Twitch! Join us!

Install Strapi on DigitalOcean with 1-Click

Strapi is a tool that allows us to build a self-hosted backend quickly. You can host your Strapi installation and quickly build out your backend and database schema. Strapi will also give you a RESTful or GraphQL API out of the box!

There's a lot to love about Strapi. It's a Headless CMS that we can host ourselves. We can host Strapi on DigitalOcean using their 1-click installation and really speed up building our backend.

Let's see how we can install and start using Strapi on DigitalOcean.

Installing Strapi on DigitalOcean

DigitalOcean has a Marketplace where there are applications that we can deploy with 1-click.

There are popular tools we can install quickly like WordPress, Ghost CMS, Strapi, Node, and more.

Using the Strapi DigitalOcean 1-Click

We can find the Strapi 1-click installation on the DigitalOcean Marketplace: https://marketplace.digitalocean.com/apps/strapi

Upcoming Course: Make 20 React Apps!

The installation instructions are straightforward here. Maybe too straightforward!

Let's go ahead and click Create Strapi Droplet.

We'll keep the $40 droplet that has been chosen here. Feel free to change this based on your API's traffic and needs. You could use a smaller droplet while getting your project off the ground and then resize it later.

Be sure to pick the location closest to your customers.

Another important part of the setup to focus on is the SSH keys. This is how you will login to your newly created droplet.

You'll be taken back to your dashboard where you can see your new droplet being created!

Getting Into Your New Strapi Installation

Now that the droplet has been created, we can access our new Strapi installation by using the droplet's IP address. You can find this in the DigitalOcean dashboard.

Note: It may take a few minutes to fully spin up and be accessible.

Be sure to create the first administrator quickly. If someone else finds this site, they can create an admin user and take over your Strapi installation. At that point, you could destroy the droplet and recreate it and all the bad actor's work would be in vain.

You'll be taken to your new dashboard!

Creating a New Content-Type

Let's say we were creating a blog. We would need a post type to store all of our blog posts in. Click Create a Content-Type. We'll name it Post.

This next part is one of my favorite parts about Strapi. We can build out our schema right from their dashboard! Let's add fields for:

  • title: Text
  • content: Rich Text
  • status: Enumeration

Creating a Post

Now that we've created the Content-Type, we can create an actual Post. In the left sidebar, you can see Post. Click that and we can now create a Post.

Aside: Strapi makes creating content-types, schemas, and data super easy with its dashboard. To do all this without Strapi would take a lot of work! Strapi makes it easy.

Fill in these fields with some content and click Save. We now have a blog post!

Accessing Your Content via REST API

Strapi is a Headless CMS. It is a CMS that lets us manage our content quickly and then gives us an API so that we can consume this content. A popular workflow for a Headless CMS is the JAMstack. We can do the following:

  • Create a Headless CMS with Strapi on DigitalOcean
  • Use Gatsby to pull data from Strapi
  • Use Gatsby to create a static website
  • Host our static Gatsby site for our users to view

Making a Strapi Content-Type Public Access

Strapi gives us a lot of strength in how we create permissions. Let's make the Post content-type publicly accessible.

  • Click Roles & Permissions in the left navbar
  • Click Public
  • Click find and findone to allow all users to view all posts and a single post
  • Click Save

Now we can view posts by visiting your browser and your IP address for your droplet followed by /posts.

You can view a single post at /posts/{id}.

Conclusion

With Strapi, we can quickly create a dashboard, content-types, and an API! We can take this a step further and use this new API to create a website or app.

  • Use Gatsby to create a static site
  • Use Next.js to create a dynamic app
  • Much more!

Headless CMSs are a great tool and part of the JAMstack. With Strapi, we can create our backend quickly!

Like this article? Follow @chrisoncode on Twitter

Host websites with a $100 credit