Strapi blog logo
  • Product

      Why Strapi?Content ArchitectureRoadmapIntegrationsTry live demo
      OverviewContent Types BuilderMedia LibraryRoles & Permissions
      Discover Strapi Enterprise EditionDiscover our partners
  • Pricing

  • Solutions

      Static WebsitesMobile ApplicationsCorporate websitesEditorial SitesEcommerce
      Delivery HeroL'EquipeSociete GeneralePixelDustBanco International
      Discover all our user stories
  • Community

      CommunityWrite for the communityWall of LoveStrapi Conf 2021
      SlackGitHubYoutubeCommunity Forum
      Meet the Strapi Community StarsDiscover the Strapi Showcase
  • Resources

      BlogStartersNewsroomSupport
      Strapi AcademyTutorialsVideos GuidesWebinars
      The Guide to Headless CMS Strapi Community Forum
  • Docs

      Getting StartedContent APIConfigurationInstallationDeploymentMigration
      Getting StartedContent ManagerContent-Types BuilderUsers, Roles & PermissionsPlugins
      Developer DocumentationStrapi User Guide

Looking for our logo ?

Logo Brand download
Download Logo Pack
See more Strapi assets
Strapi blog logo
  • Product

    Product

    • Why Strapi?
    • Content Architecture
    • Roadmap
    • Integrations
    • Try live demo

    Features

    • Overview
    • Content Types Builder
    • Media Library
    • Roles & Permissions
    • Discover Strapi Enterprise Edition
    • Discover our partners
    Features cover

    Unlock the full potential of content management

    See all features
    Strapi Enterprise Edition

    Discover the advanced features included in Strapi Enterprise Edition.

    Get Started
  • Pricing
  • Solutions

    Solutions

    • Static Websites
    • Mobile Applications
    • Corporate websites
    • Editorial Sites
    • Ecommerce

    Stories

    • Delivery Hero
    • L'Equipe
    • Societe Generale
    • PixelDust
    • Banco International
    • Discover all our user stories
    Delivery Hero team

    Delivery Hero manages their partner portal with Strapi.

    Read their story
    turn 10 studios website

    How 1minus1 delivered a creative website for Turn10 Studios 25% faster with Strapi

    Discover their story
  • Community

    Community

    • Community
    • Write for the community
    • Wall of Love
    • Strapi Conf 2021

    Resources

    • Slack
    • GitHub
    • Youtube
    • Community Forum
    • Meet the Strapi Community Stars
    • Discover the Strapi Showcase
    Strapi Conf

    The first Strapi Global User Conference.

    Register now
    Write for the community

    Contribute on educational content for the community

    Discover the program
  • Resources

    Resources

    • Blog
    • Starters
    • Newsroom
    • Support

    Learning

    • Strapi Academy
    • Tutorials
    • Videos Guides
    • Webinars
    • The Guide to Headless CMS
    • Strapi Community Forum
    Introducing Strapi Academy

    Everything you need to know to master Strapi.

    Go to the academy
    Strapi Repository on GitHub

    Get started with the Strapi repository

    Go to repository
  • Docs

    Developers

    • Getting Started
    • Content API
    • Configuration
    • Installation
    • Deployment
    • Migration

    User Guide

    • Getting Started
    • Content Manager
    • Content-Types Builder
    • Users, Roles & Permissions
    • Plugins
    • Developer Documentation
    • Strapi User Guide
    Install Strapi

    Install Strapi locally or wherever you need.

    Get Started
    Migration Guides Strapi

    Using a previous version of Strapi? Migrate to the latest.

    Read Guides
Get Started
Back to articles

Deploying a Strapi API on Heroku

deploying-a-strapi-api-on-heroku
  • Share on facebook
  • Share on linkedin
  • Share on twitter
  • Share by email
Pierre Burgy

Pierre Burgy

As a programmer developing a Strapi API, you will have, sooner or later, to deploy your app online. To do so, many options are available.

The default one is to use a Linux instance on a IaaS (Infrastructure as a Service) provider such as AWS or DigitalOcean, and configure it for your app. However, this option is complex and may involve some critical security issues if you are not familiar with DevOps.

In order to make hosting easier, a new kind of solution emerged in the last few years: Platforms as a Service (PaaS). The idea behind this concept is to make hosting way easier and let developers focus on their code instead of their servers infrastructure. The most famous one is definitely Heroku. Heroku relies on AWS and is trusted by thousands of companies.

Many of you wanted to discover how to easily deploy a Strapi app on Heroku. It didn't fall on deaf ears. This tutorial intends to explain you the necessary steps to push in production a clean Strapi app, using Heroku for both hosting and database.

Strapi Heroku

First of all, we are going to configure a Heroku account. Then, we will generate a brand new Strapi API and deploy it. As a bonus, you will also discover the one-click deploy button:

Deploy

Heroku setup

Heroku is an online service, so, except if you already have an account (go to section "Heroku CLI setup"), you need to create one:

Register

Visit the register page, fill in the form and submit it:

Strapi Heroku

Validate your email address

To complete the registration process, validate your email address by clicking on the link in the email you received from Heroku and choose a password:

Strapi Heroku

That's it, your account is up and running:

Strapi Heroku

Let's go further!

Heroku CLI setup

Heroku offers a powerful CLI to manage your apps through your terminal.

Installation

To install the CLI, follow the instructions corresponding to your operating system:

Debian/Ubuntu

$ wget -qO- https://cli-assets.heroku.com/install-ubuntu.sh | sh

MacOS

$ brew install heroku/brew/heroku

Make sure Homebrew is installed on your computer.

Strapi Heroku

Windows

Download and run the Windows installer 32-bit 64-bit.

Note: if you encounter any issue, take a look at the Heroku CLI documentation.

Login

In order to link your Heroku account, you need to login:

$ heroku login

Strapi Heroku

Congrats, you successfully created a Heroku account and configured the Heroku the CLI!

Install Strapi

Requirements: please make sure Node 9 is installed on your machine.

Install Strapi using npm:

$ npm i strapi@alpha -g

Generate a new Strapi project

To create a new project, simply run the following command:

$ strapi new my-app

Press enter to use the default answers for each question.

⚠️ UPDATE: in latest version of Strapi you will have to set the config value: Authentication database the value has to be the database name

Strapi Heroku

Init the git repository

Git is the de-facto solution to version code. Heroku highly relies on it to detect changes. That means everytime you update your codebase, you only need to commit your changes and push them to Heroku.

Our app is not versioned yet, so we are going to init the Git repository, add the files and submit the first commit:

$ cd my-app
$ git init
$ git add .
$ git commit -am "Initial commit"

Strapi Heroku

Heroku create

We have never been so closed to the deployment. Let's inform Heroku we want to create a new project:

$ heroku create

Strapi Heroku

At this point, you should already be able to see the app in your Heroku dashboard:

Strapi Heroku

mLab addon

By default, a Strapi API needs a MongoDB database. Locally, you can use a MongoDB instance running on your machine. Especially when it comes to deployment, you need to install MongoDB on a remote server or use a Database as a Service provider, such as mLab.

To make things even more easier, Heroku created the addons system. Addons are integrated tools and services for developing, extending, and operating apps. All kind of addons are available: Monitoring, Email/SMS, Testing, Search, Image Processing, etc. and, obviously, Data Stores. MongoDB is provided in Heroku addons through several services, including Compose, ObjectRocket and mLab.

In this tutorial, we are going to use the mLab addon, which provides a free Sandbox plan. If you plan to deploy your app in production, we highly recommend you to switch to a paid plan.

mLab addon exposes an environment variable named MONGODB_URI to your project. Its value is a string looking like this: mongodb://heroku_12345678:random_password@ds029017.mLab.com:29017/heroku_12345678. As you can see, it contains all the necessary informations to connect to the MongoDB instance: username, password, host, port and database name. Give a look at the documentation for more details.

To make sure our deployment will be successful, we must make sure that the environment variable will be handled by the Strapi app. Don't worry, we have prepared everything for you in Strapi (from v3@alpha.9.3). As you can see in config/environments/production/database.json, Strapi uses by default some environment variable:

{
  "defaultConnection": "default",
  "connections": {
    "default": {
      "connector": "strapi-mongoose",
      "settings": {
        "client": "mongo",
        "uri": "${process.env.DATABASE_URI || ''}",
        "host": "${process.env.DATABASE_HOST || 'localhost'}",
        "port": "${process.env.DATABASE_PORT || 27017}",
        "database": "${process.env.DATABASE_NAME || 'production'}",
        "username": "${process.env.DATABASE_USERNAME || ''}",
        "password": "${process.env.DATABASE_PASSWORD || ''}"
      },
      "options": {
        "authenticationDatabase": "${process.env.DATABASE_NAME || 'production'}",
        "ssl": false
      }
    }
  }
}

That means Strapi automatically use the environment variables available. But, the variable specified in Strapi is DATABASE_URI, not MONGODB_URI. Why? Because we want to keep Strapi generic, not specific to some hosting platforms. Fortunately, Heroku allows us to rename the exposed variable thanks to the alias system. This is why we specify -as DATABASE when creating the addon.

Now that you know a bit more about addons, let's create one:

$ heroku addons:create mongolab:sandbox --as DATABASE

Strapi Heroku

Note: if you want to deploy a project using Strapi < v3@alpha.9.3, please copy and paste the JSON content above in config/environments/production/database.json and replace the line 3 in config/environments/production/server.json by "port": "${process.env.PORT || 1337}".

Deploy to Heroku

Let's make the magic happen! Push your code to Heroku:

$ git push heroku master

Strapi Heroku

This is as simple as that! Click on the link at the bottom of the logs to discover your Strapi app online:

Strapi Heroku


Bonus - Introducing the one-click deploy

Because deployment is never too easy, Heroku introduced the deploy button. This button allows open-source projects owners (and others) to let users deploy apps within one click.

Since it can be a huge benefit for current and future Strapi users to preview what Strapi is, we decided to make it available for you.

From now, you can deploy a Strapi app just by clicking on this button:

Deploy

After that, to do any update, clone it using the Heroku git URL (heroku info heroku-project-name) and customize it according to your needs.

An example is available at the following address: https://strapi-heroku-app.herokuapp.com (username: demo@strapi.io / password: demo).


Conclusion

Congratulations! You successfully deployed a brand new Strapi app on Heroku.

In this tutorial, we have seen various aspects of Heroku concepts. To go deeper and perfectly setup your app for production, we strongly recommend you to read the documentation about topics such as scalability, GitHub based deployments, pipelines, etc.

We hope you enjoyed this tutorial. Please comment it to give your feedback and explain how you usually deploy your Strapi APIs.

  • Share on facebook
  • Share on linkedin
  • Share on twitter
  • Share by email

Unleash content.

Read the docs
Get Started

Strapi is the most popular open-source Headless CMS. Strapi gives developers the freedom to use their favorite tools and frameworks while allowing editors to easily manage their content and distribute it anywhere.

Product

  • Why Strapi?
  • Content Architecture
  • Features
  • Enterprise Edition
  • Partner Program
  • Roadmap
  • Support
  • Integrations
  • Try live demo

Resources

  • How to get started
  • Meet the community
  • Tutorials
  • API documentation
  • GitHub repository
  • Starters
  • Strapi vs Wordpress
  • The Guide to headless CMS

Integrations

  • Gatsby CMS
  • React CMS
  • Vue.js CMS
  • Nuxt.js CMS
  • Next.js CMS
  • Angular CMS
  • Gridsome CMS
  • Jekyll CMS
  • 11ty CMS
  • Svelte CMS
  • Sapper CMS
  • Ruby CMS
  • Python CMS

Company

  • About us
  • Blog
  • Careers
  • Contact
  • Newsroom
  • © 2021, Strapi
  • LicenseTermsPrivacy