Free Resources For Next JS Developer to Create Full Stack Blog Website

Free Resources For Next JS Developer to Create Full Stack Blog Website

Post by: Niraj Dhungana

Posted on: Nov 16, 2021

#Full Stack# Free Resources

I always wanted to create a full stack blogging website on my own. But creating and maintaining your custom coded website is not an easy task. It requires a lot of time and money as well.

I was ready to invest my time so I tried a lot of different tech stacks and I kinda stuck with Next JS for this project. Because the next js is not only a solution. It’s a package in itself.

Next JS has excellent documentation, it has server side or static rendering features which are good features to have for SEO. And the most important thing is that you don’t need to leave a directory to write frontend and backend code separately.

But the thing I couldn't afford was money.

If I create a full stack blogging website with every feature then I need one place to host my frontend code, one place to host my backend code, a cloud to store media files and a database to store my posts.

Scalable Website

You could say that I should have kept everything in one place. If I had written the code to store everything in one place then I would not have to spend money separately for frontend, backend, cloud or database.

But the problem with that approach is scalability. Currently I don’t have money but I have plans for the future. So, I needed a website where I could start with some free resources and later if I got some money I was ready to upgrade.

Also there are a lot of other simple ways to create a blogging website. Some of those resources are paid and some of them are free.

If you want a completely free and professional way to create your blogging site you can use WordPress. But I guess you are here because you don’t want to use WordPress.

Things we need

The things needed to build a blogging website with perfect scalability are

  • Hosting (for backend and frontend).
  • Domain (for professionalism)
  • Cloud Storage (to store media files).
  • Database (to store posts and other data).

Free Hosting

Wesite Hosting Servers

Hosting is the most important part of your blogging or any kind of website. No matter how much time you spend improving your website. If your hosting server is slow then everything is ruined.

There are a lot of hosting providers available that can host your Next JS application for free but they come with some limitations. Some will give you free hosting but not a custom domain, others will give you both but for limited traffic or time.

But if you want to host your Next JS project then the company called Vercel will give you premium hosting for free. Where you will get 100GB bandwidth, you can use a custom domain also.

Vercel is the same company behind Next JS. They are the creator of Next JS. Also their paid plan starts with $20 so it is fine for your future.

Free Domain

denoting domain endings like com, org, net

There are lots of ways to get free domains. Also if you want to you can use the free domain provided by vercel. But it comes like this yourapp.vercel.app

You can go to a website like Freenom and get a free domain or you can search on google for a free domain. You will not get .com, .net or .org like a professional domain for free. They come with endings like .tk, .ml or some unprofessional endings.

Here I highly recommend you guys to please invest a little money to buy a domain with your business or your name on it with endings like .com, .net or things like that.

By the way, if you make progress in the future it will be with you for a long time. And here is a tip: if you use a fresh email id to purchase a domain you will get an offer. So, it will cost you around $5 to $10 for a year.

Free Cloud Storage

Cloud storages with multiple files

Cloud storage is a great place to store your media files. You can simply store your media files inside the cloud and just use the url of those assets inside your HTML.

With this you are not cluttering your database and it will also work faster when you want to load your website.

The best and the free cloud storage I can recommend you guys is the Cloudinary. For a free single user plan you will get 25GB of storage, 25GB of bandwidth and 25K transformations.

The documentation for cloudinary is good. Also if you got stuck in some place then you will get easy help because the community is large enough. Also you will find helpful official blogs or you can use the forums.

Free Database

connecting database

The database that I am going to recommend is MongoDB. It’s a pretty easy to use database with a large community. If you know about Object and JSON data structures you will use this database in no time.

Also you can read this post if you want to know how to set up the next js and mongodb using mongoose.

You will get 512 MB of storage for a free plan. And now you may think 512 MB is nothing, right? But hey we are storing all of our media assets inside a cloud storage.

So the things that we will store inside our database will be just some text records like objects where you will have title, tags, HTML or maybe Markdown content. You can easily store hundreds or even thousands of text records in a 512 MB storage.

I am using them

Ok here you have all the things you need to have a functional fullstack blog application using Next JS, MongoDB, Cloudinary and Vercel. If you don’t believe me then the website where you are reading this post is made with exactly the things I explained above.

And the best part about these services which I told you are completely free, which don’t even ask you for your credit card or anything like that. You can simply sign up with email and use the services.