6 Tips for Deploying Strapi to Heroku
Strapi is a great headless CMS for front-end developers. It’s open-source, flexible, and easy to set up. After endless frustration with headless Wordpress, using Strapi was a breath of fresh air.
Getting set up was easy. Deploying was confusing. I like Heroku because it can host my side-projects for free. However, deploying Strapi to Heroku presented some unique challenges. Here’s what you need to know.
1. Don’t spend too much time adding content locally
I initially ran Strapi locally on localhost:1337, which was ideal while I developed the Gatsby front-end of my application. When I deployed to Heroku, I found that my collection types had been transferred, but not my data.
Data migration between environments is currently in the planning phase on Strapi’s roadmap. For now, I had to re-add my data.
Know this from the off. If you have lots of content, save it for when you’ve deployed.
2. You will need a database, and it can’t be SQLite
If you didn’t specify a database when setting up your Strapi project locally, you would have been given SQLite as a default. If in doubt, check your package.json.
Heroku doesn’t support SQLite but it’s surprisingly quick to set one up with Postgres by installing a Heroku Add-On. The instructions can be found in this tutorial.
3. Some Tutorials are Out of Date
While we’re on the topic of databases, you might stumble across an instruction to edit database.json on a path that doesn’t exist.
./config/environments/production/database.json
After finding the same non-existent path here, here and here, I thought I had skipped a step during set-up.
If this happens to you, use this tutorial. This has the Heroku deployment guide for the current version, not the beta.
Strapi is evolving rapidly, which means some tutorials are out-of-date despite being barely a year old. At the time of writing, the current version is less than a month old. It’s only a matter of time before tutorials get updated or replaced.
4. You will need Cloudinary or AWS S3 to host your images
Heroku stores images in a cache, which gets wiped whenever the dyno restarts. This means any images you upload won’t stay there for long.
In Strapi’s own words:
Like with project updates on Heroku, the file system doesn’t support local uploading of files as they will be wiped when Heroku “Cycles” the dyno. This type of file system is called ephemeral, which means the file system only lasts until the dyno is restarted (with Heroku this happens any time you redeploy or during their regular restart which can happen every few hours or every day).
To get around this, we can use Cloudinary to host our images. This means we can still upload images via the Strapi admin panel, but the images get saved on Cloudinary’s servers instead of Heroku’s. When fetching an image on your front-end, Strapi will return a Cloudinary URL instead of a file path.
Cloudinary has a free tier; it can perform image optimization, and deliver images in WebP format. This makes it a great tool to improve your website’s performance.
5. You don’t need to do anything in the Strapi admin panel after configuring Cloudinary
If you’re following the Youtube video to set up Cloudinary, there will be an instruction to go into the Strapi admin panel, find the Upload plugin, and specify Cloudinary as the image provider.
This step is no longer required.
Settings are now defined in extensions/upload/config/settings.js, not inside the Strapi admin panel. This means once you have pushed settings.js to Heroku, you’re all set.
6. Don’t forget to set-up your config vars!
I know, this one should go without saying, but if you’re not deploying projects often, this step is easy to forget.
Sensitive information like API keys should not be pushed to Heroku or Github with the rest of your project. If you’ve installed and configured Cloudinary but can’t upload images, check the Config Vars in your Heroku settings.
Resources
Github repository for an application with a Gatsby front-end and Strapi back-end. The code was recently updated to the current version:
Strapi’s guide to Heroku deployment (current version):
YouTube tutorial series. The videos on deployment reference an older version of Strapi. The series overall is still extremely worthwhile:
