Using Heroku as a server for your static page

Deepjyoti Barman @deepjyoti30
Mar 26, 2020 12:00 AM UTC
Post cover

As you can see, I have my page hosted on github.io domain which probably means it's a static page. But if you scroll down to the end, you'll see a clap icon which probably is not static. The clap icon is, in fact, dynamic and it works by communicating with my server. But wait a minute, isn't this page static? Yes it is.

I have had a lot of people complain to me about not habing the proper resources like a domain name or a server to host a page, otherwise, they are confident they would have a million dollar poge. As ironical that sentence is in itself, this post is not about my people nagging me about not having a page, it's about how to not being one.

I feel like the only thing that make these people say things like that is because of them being not aware about the resources that are available for free and that can be used to do whatever they want. Yes, ofcourse, these free resources have their own disadvantages but then again, it's free.

Why and How Heroku

Before I get to why to use Heroku, let's see why do we need to use a server at all.
So a server lets us communicate with it and it and let's us make our page dynamic. That is the content is not hardcoded, instead it is loaded by asking the server to give us the latest data (or whatever filter you want to use).

Now the thing is how do frontend communicate with the backend? How do your page ask your server to return you some particular data? Well, simply by using a means to communicate which in this case is an API.

Now here's the deal, if you can somehow deploy an API on heroku then we can simply make the requests to that API and in return we will get our data. So there we go, this is probably why we will use Heroku to act as our server.

Now the how part. Well the how is simple. Just learn to write an API in any language you want. I have my API written in Python and then all you have to do is create a new app in Heroku and deploy your app there.

Yes, it is as simple as that. Well, API writing part might be a bit hard considering your experience with API but anyway, that's it. I have written an article before on how to do that exactly. And here's the article I referred to build my API.

My laptop

Once the API is ready and tests are done, it can be deployed very easily to Heroku. The process might differ depending on the languages. However for Python, all it takes is a Procfile where we need to add the command that will run once the app is pushed and that's that.

After that all the requests can be made to the "appname".herokuapp.com/"endpoint".

What's the catch

Now that I have showed how simple it is to deploy to Heroku, I really need to describe what the catch is and how to fix that.

Well, Heroku has an ephemeral filesystem. Every dyno in Heroku has it's own filesystem.

This means that your data can't be stored in Heroku. This is simply because they have a sleep policy which makes sure each dyno (call it server) sleeps for 1 hour in every 24 hours. But that's not even the actual issue. The issue is after that 1 hour is complete, your app is probably deployed in some other dyno and as I mentioned above, each dyno has their own filesystem, so the new dyno will not have the data that was stored in the older dyno.

This is critical to our API. If you remember, I have a clap function that keeps track of the claps of any post. But with a filesystem like that, that won't be possible. I didn't even know that was the case untill I started facing issues with my clap related data and other data, so I started researching a bit and found out about the above issue.

What's the solution?

Well, it's simple. Use a static storage service like aws s3.

This becomes a bit resource hungry for the API but overall, we can't help it. So what we do is we store all the data in s3 and when our API is supposed to work on it, it just downloads that data from s3 and works on it and then returns the results.

I personally use s3 along with Heroku and so far I can say it's pretty good. No, there are no catches in using s3.

For those wondering, I am still on my free trial with AWS and so s3 is free for me. But don't feel like you'll have to use s3. There are probably a lot of alternatives to it and those can be simply used along with Heroku.

Conclusion

So to sum up, you can use Heroku as a server pretty easily. It's like the perfect solution to use along with a static page. It's free. The only disadvantage with using Heroku is it's ephemeral filesystem which can be fixed by using some static storage service like s3.

There we go, use the above technologies and you'll have a so-called server.

I did not write this particularly for those people who come and tell me they don't have enough resources to have a page, but for those who are starting with web development. I just don't want beginners to go through what I went through when I was setting up my page and I wanted it to be free. But I have to say, whenever they do fuss next time, I'll surely send them this article and block them probably.

Discussion