![Cover image for Hosting free Strapi CMS on Railway [Building Personal Blog Website Part 1]](https://media.dev.to/cdn-cgi/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftb2cibe5z7gyqgced3x9.jpg)
This is the first part of the "Building Personal Blog Website" series. In the series we'll setup a free CMS to hold our blog content on Railway, create a React app with Next.js' static site generation and TailwindCSS to present the articles and host it on Netlify.
❗ This is an updated version of the guide. The original one used Heroku instead of Railway, but as Heroku phased out its free tier - I decided to rewrite the first parts of this series to still use only free resources.
All articles:
Part 1: Hosting free Strapi CMS on Railway
Whether you want to create a simple blog or a portfolio website it is always a good idea to use a good CMS (Content Management System) behind. For quite some time Wordpress was a go-to solution, but now the choice is not so obvious. As an ambitious developer you can of course try to write your own CMS, but let's be frank - in most cases the best way is to use an existing one. That was my approach when I started to work on my personal website.
My main interest were as follows:
- ability to change website's content without changing the code
- simple blog functionality
- out-of-the box GraphQL integration
- cheap site maintenance (preferably free)
After some time of "research" I chose Strapi CMS for the first three points and Railway for the last one.
Why Strapi?
- It's lightweight - compared to other CMSs Strapi is lightweight and really simple to set up.
- It's headless by design - I definitely prefer a headless CMS solution over a traditional CMS, it gives much more flexibility.
- It's written in JavaScript - this definitely helps with writing extensions/plugins if you use JS on a daily basis (which I am).
- It has really extensive docs - Strapi docs helped me in tons of situations, if you have a problem with Strapi it's almost guaranteed you'll find some help in the docs.
Why headless?
Main reason - it's technology agnostic - traditional CMS requires you to write templates etc. in the technology the CMS is written. With headless this problem is gone. You utilize the REST/GraphQL endpoints to fetch the data and display it however you like.
How to set this up?
To set up your Strapi CMS you’ll use Railway. The process of deployment is rather easy, but to make it even easier you’ll start with setting up Cloudinary. If you do this now - configuring Strapi to use Cloudinary as an image repository will be a piece of cake - Railway will need the API keys and then it’ll set everything up automatically.
As you are building a personal blog it is really possible that you'd want to use some images in the blog posts. The CMS is hosted on a free-tier Railway, so the storage is rather limited. That's why you need to think about other solutions. And here's where the cloud comes in.
For this I have chosen Cloudinary. It's a rather popular platform for managing assets and optimizing images. But the main reason to use it for our personal project is that it has a free tier with easy-to-use API. Config is worry-free - you'll go through it today.
But before you start - head out to Cloudinary, create a free account (the process is rather standard) and when you're done - log in and get your SDK config (Getting Started -> Configure your SDK -> Start configuring).
Save those variables somewhere and then let's create your Strapi app in Railway.
Go to Railway Strapi builder
Log in with your GitHub account and provide the necessary accesses.
When you do this you should see something like this (if you don’t - just refresh the page):
Here you have to provide a name for your repository. Paste your Cloudinary keys in the specific fields and for the rest of those (ADMIN_JWT_SECRET, JWT_SECRET, APP_KEYS, API_TOKEN_SALT) - generate new values in your terminal with openssl rand -base64 32(remember to save them somewhere).
EDIT: All the variables you use here are also important for local development so save those in .env file (and remember to add .env file to your .gitignore if it's not already there).
When you fill all the fields - click Deploy. And that’s it, it’s that simple. Wait a few minutes so your build will be done and then you’ll be able to continue with setting up your admin account for Strapi.
If you want you can customize your Railway domain for the cms - when the build is done go the the last tab (Settings) and there you can easily edit the domain.
Go to https://[yourapp].up.railway.app/admin to set up the admin user and then log in (chances are you'll get the error about invalid API call - if so, don't worry, we'll fix it in a moment). You should land in the dashboard (if you had the error - ignore this part and just move along to the next paragraph).
As the app is in production mode you can't really make any adjustments here. You can't create a new content-type or add a new plugin. That's why you need to go into developer mode - make changes there and redeploy the app.
Strapi created by Railway depends on postgres database, but it’s definitely an overkill to use it locally. You’ll now configure a SQLite database to be used on your local environment. First, clone the repository created by Railway. Before you install and start the development server you’ll need to do a few adjustment.
Copy the file config/database.js to config/env/production, then replace config/database.js with
const path = require("path");
module.exports = () => ({
connection: {
client: "sqlite",
connection: {
filename: path.join(__dirname, "..", ".tmp/data.db"),
},
useNullAsDefault: true,
},
});
Install SQLite dependency:
yarn install better-sqlite3
IMPORTANT: Before proceeding - upgrade Strapi version in your package.json to at least 4.5.5 (and plugins also if you have any installed):
"@strapi/plugin-i18n": "4.5.5",
"@strapi/plugin-users-permissions": "4.5.5",
"@strapi/provider-upload-cloudinary": "4.5.5",
"@strapi/strapi": "4.5.5",
And now you’re ready to start the app:
yarn install
yarn develop
And when the app starts you'll need to set up admin account once again (it's stored in SQlite database, so it'll be gone after some time locally - but that's not a problem). Now when you log in you can create new content-types, configure plugins etc.
Before starting creating content-types let's just quickly install a plugin that will be really useful later - GraphQL plugin which enables the default GraphQL endpoint for your CMS (you can skip it if you're ok with using standard REST calls, but I'll be using GraphQL in the React app). You can install it easily using yarn:
yarn add @strapi/plugin-graphql
And with that out of the way let's just create a blog post type.
In the content-type builder select a "Create a new collection type".
And add some mandatory fields to it. In my case it's title, content, cover, author and slug.
For author it's important to select a proper relation:
For slug remember to make it of type UID and select title as an attached field:
After you save you can commit all the new files - the schema files etc. will tell the production app what kind of content should be possible to create.
Now you are ready to redeploy the app, just do a push:
git push
After you do this Railway will do an automatic redeploy. When it’s finished, log in with the admin credentials and do some final configuration.
What you need to do is to give public access to posts. Do this by going into Settings -> Users & Permissions Plugin -> Public -> Edit (icon).
While inside, give access to find and findOne for postsand users-permissions. This way you'll be able to query the CMS for the list of blog posts and for a specific one post (using slug).
Click Save and now let's create an author and a dummy blog post to test the endpoint (Content Manager -> User -> Create New Entry and Content Manager -> Post -> Create New Entry).
Then click on the area below cover (or whatever you named this field) and just follow the instructions on the screen to add a new image.
After saving you should see in the blog post editor that the image is in fact there.
But now to be entirely sure the image was added correctly - go to the Cloudinary website, log in and go into Media Library. There you should see your newly created image in 3-4 sizes.
After saving a post you also need to publish it so it would be visible in the API.
To check if everything works use Postman (or a similar app).
Open up Postman and in the address field put https://[yourapp].up.railway.app/graphql/ and select POST type of query. Then in the body of the query select graphql type and type this:
query {
posts {
data {
attributes {
title
content
}
}
}
}
When you send this request, you'll receive the blog post that you just created a minute ago:
As you can see the content is returned as markdown - it's much more efficient to send the data this way, but in our frontend app we'll need to convert it to HTML. We'll probably use something like react-markdown.
And that's it! We now have a hosted Strapi CMS that is accessible by both REST and GraphQL. In the next part you’ll create the Next.js app to consume the data you already have in your CMS.
Top comments (27)
Michał, thank you so much, you helped me out big time after a long struggle!
One thing missing, when I cloned the Strapi app, I had to create a .env file and place the matching keys in there. For the rest, it's working like a charm!
Glad it helped you! :)
You are right! The .env file is needed for local development, I'll update the guide soon. This part was there back when I used Heroku, but I guess I lost it during the Railway adjustments. Thanks for noticing!
Hey, great tutorial!
I have a problem though. Whenever I do stuff locally (add all the needed models, ...) and then I push. Railway rebuilds it (succesfully!) and it deploys (succesfully again), but whenever I go to /admin, it shows "An error occurred while requesting the API".
Any idea why this could be happening?
Does this issue occur when you try to go to /admin again? It happens to me from time to time, but usually as soon as I try opening admin panel for the second time it works :D
I think this could be related to refreshing the versions of your Strapi on Railway - something is not yet ready, but the status on Railway says that everything is done already. I didn't do any deeper investigation into this topic, so unfortunately I can't help you :(
I get this issue too. When accessing the /admin path on Railway It looks like the default setup you describe is trying to make XHR requests to localhost:1337.
Looking at the code, I think we need to set HOST and PORT variables in Railway but when trying that I just get an error complaining about the bindings?
Hey. I've solved by doing a normal Strapi setup (like you would normally do), instead of using the Strapi template which Railway provides, that looks rather outdated.
Now it's running all good! :)
This worked for me too!
I see below that you found the solution. I also had this problem in the last few days. You don't need to create a new Strapi setup, it seems you need to just use newer version of Strapi in your package.json (4.5.5 for example worked for me) :)
Is hosting strapi on railway free forever?
Hope there is no limit to it in as much I am using it for a small project just like Heroku free tier then.
There is a usage monthly limit as long as your account does not have any credits on it. I paid 5$ once and my app is working constantly for over half a year without any additional payments. And my account balance is still 5$.
Michał, you a legend, my friend. This is one of the most excellent tutorials that walk us through E2E, from local dev to production, and thanks to the railway platform, no ci/cd hassles!
Hey Michal, this is a great tutorial. I really enjoyed deploying my strapi to railway this way. Thank you so much for putting in the effort for writing this.
I am struggling with some issue. Every time I do a push to my repo, railway rebuilds my whole application and doing that it deletes my sqlite file database and with it all my configurations and data.
I don't want to commit my local sqlite file to my repo (as this will create more ux problems for sure), but I can't think in any other way for preventing my database from being deleted on each build.
Any ideas?
Unfortunately I don't have too much of an experience with SQlite, I usually use it only for local testing :) For deployment I usually go for a "real" database (like postgres in this example).
The same for me. I just used a MySQL remote that I have, and could make things work this way; trying to avoid costs for getting higher in Railway. Thank you so much for putting in the effort of writing those articles.
Hi.
When I install locally Graphql I have an error "Cannot use GraphQLScalarType "Time" from another module or realm." Then I use it npm dedupe && npm i graphql@latest && npm i @strapi/plugin-graphql. On localhost all works correctly.
But when I pushed it to git, railway had the next building trouble Server wasn't able to start properly. error: typeDefs must contain only strings, documents, schemas, or functions, got object
joxi.ru/p27GJOdsZ80qp2
I have next configuration in my package.json joxi.ru/vAW5B4wfRlk4Mm
Could anyone help me with this?
Dough!
I solve this remove "graphql": "^16.6.0", from dependencies in package.json and
using instead"@strapi/plugin-graphql": "^4.6.1"
joxi.ru/Vm6MNvWCKbxyMr
Don't forget this forum.strapi.io/t/enabling-graphql...
Hi can some1 help me with this problem..
When i hit https://[yourapp].up.railway.app/admin i get this screen
And have you tried opening this address after a few minutes?
And maybe that’s a stupid question but did you replace [yourapp] with the actual name of your app on railway?
Hi, tnx for the answer..it just started to work after 45 min wait :)))
I've got an issues on live domain, it show "Warning: An error occurred while requesting the API" when open [domain]/admin, but it runs normally on local, you have any idea about this?
Yes, there were some issues lately with Strapi on Railway. Best solution is to upgrade Strapi and all plugins to the latest version in your package.json (I used 4.5.5). I'll add the annotation to this blog post as many people had this issue.
it's works now, thanks for the answer
Do you can post your project in github and show me your solucion? I spend some days trying fix this
How is it that when you deploy a new change to Strapi, you are then able to login with the same credentials? The Postgres DB is NOT persistent (confirmed by railway.app staff) between builds so how was it possible in your guide?
Really great job done by you, i stop using wordpress now :)