Four popular services to host your website for free

Four cloud hosting providers that allow you to host a simple website without spending a dime

BG Image by Pineapple Supply Co. on Unsplash

It’s been three months since the world went into quarantine and people stuck home are trying to learn new skills every day. While development may not be everyone’s cup of tea( or coffee if you’re like me), learning to make a simple website is something even a 5-year-old can do. It’s one of the most basic skills that you can acquire in the vast ocean of technologies out there and something that can be very useful at some point in your work or personal life.

There are 1000s of tutorials out there that teach basic HTML and CSS to make a website, but creating it and watching it in action on your local machine is probably not what you had in mind. You probably want to share it with your friends, get feedback, or even launch it on the internet. While there are numerous free hosting providers out there, they always come with a catch or show pop up ads on your website. Here’s a list of 4 very popular and trustworthy tools that can get you started with website hosting and like the title said, free!

All the services in this tutorial are free for website hosting only, and if you need a custom domain like www.example.com you will have to purchase them from within these providers or any Domain registrar of your choice.

1. Netlify

As similar as the name may sound Netlify does the exact opposite of Netflix, it lets you get your work done in a blink. It’s my personal favorite in this list for the same reason, you can upload your website and make it live even before the intro theme song is over on any show.

Netlify App Homepage

Launching a website can't get any simpler, sign up on Netlify then simply drag and drop your site folder from your computer and you’re done. If you're uploading a website for the first time Netlify will create a random site name and URL for you but you can always edit it in settings. You can also configure your customer domains if you have one. The pricing is also very straight forwards for newbies, you get 100GB bandwidth & 300 build minutes per month absolutely free in the starter pack and can always upgrade if you feel the need for it. There are a lot of other cool features on Netlify including CI/CD pipelines, so make sure to explore everything once you’re familiar.

2.Heroku

Heroku is a platform as a service tool that enables developers to build, run, and operate applications in the cloud. While Heroku is not made for static websites it’s pretty easy to add a configuration that can get your static website up and running on Heroku. Also if you’re starting with web apps that run on Ruby, or PHP, etc.. Heroku is the perfect place for beginners to deploy backend apps as well.

Heroku App Deployment Page

Heroku apps are mostly controlled through the CLI. Adding a Heroku app to our project is a very simple process, you just have to sign up and follow the few steps using the commands given. Once this is done, we just need to add two files in the root of the project before deploying it so that we don’t run into issues with the static website.

In the root directory, create a file: composer.json.
In this file, just add this piece of code: {}
In the same directory create a file:index.php
In this file, add the following line of code:
<?php include_once("index.html");?> where index.html is the entry point for your site( if not change this file name)
Now, commit and push these files to Heroku along with the rest of your site files.

Voila, as soon this step is complete you will have a working link to your website under Heroku. You have an option to assign your custom domain in the even in the free tier of Heroku.

3. Amazon Web Services

AWS is one of the most prominent players in the cloud world, often considered as less user friendly and “only for experts” by most people. But it’s pretty easy to host a static website on AWS using their popular S3 bucket service. Let’s dive into it step by step:-

Sign up for an account under AWS free tier. S3 Bucket is free for one year for up to 5GB of usage
Now go to your AWS Console and search for S3 in the find services search bar and select the first option (refer image below).

S3 Storage service

3. Once you are on the S3 dashboard, click on the Create bucket option and give your bucket a unique name ( this will be your website name under AWS domain) and choose the region closest to you, and click next.

4. In Configure options don’t check any options for logs unless you know exactly what you are doing and move to the next step. Under set permissions, you should uncheck the block all public access checkbox and check the acknowledge settings checkbox. This is required to allow public access to all contents of your website(bucket) and be careful not to upload any sensitive information on this bucket. Click next to review details and Create the bucket.

Granting public access to S3 Bucket

Before you complete this step, review Using Amazon S3 Block Public Access to ensure you understand and accept the risks involved with allowing public access.

5. Open the bucket by clicking on it from the list and click on Upload under the Overview tab. Now drag and drop your website files or upload them using system picker. In the Set permissions tab select Grant public read access to this objects. And you can skip the Set properties by leaving them at selected default options. Finally, click upload and your website files will be now stored in the S3 bucket.

6. The last and final step is to enable static website hosting for the bucket. To do this go to the Static website hosting option under the properties tab in your bucket. Now enter the name of your entry file or index document ( index.html in most cases ) and an error document(optional), both are case sensitive and click on save. The URL for accessing your website will be shown on top in the same section (refer image below). You can also assign a custom domain for your website later by following this guide.

Enabling Static website hosting.

4. Azure

Azure is the other giant of the cloud world and one of the most popular cloud services providers, owned by Microsoft. But Azure is not just for enterprises or cloud experts, anyone with basic online literacy can easily learn how to use and host their website in azure. With 12 months of popular free services and many always free* products Azure is really goto place in cloud solutions for anyone who is venturing into development. The steps are pretty simple

Sign up for the free trial of azure.
From your dashboard, click on create a new resource and search for web app.
From the results select Web App by Microsoft. (Refer Image below)

Web App by Microsoft

4. Click on create and you will be taken to the following page where you have to enter your app details.

If this is the first time you are using Azure, you may have to create a new resource group. You can give your website any name you like and you will get a domain that ends with azurewebsites.net. Choose code as the publish type and runtime stack can be node or PHP, it doesn't really matter since our website is static. It’s better to leave the operating system as windows unless you know what you are doing. Choose a region that is closest to you or your target audience. And select the basic plan for app service ( most cases this is enough) for starter sites. You can turn off monitoring in the next step and jump to Review+create and click on create after confirming the details.

5. Wait for a few seconds and once it’s created click on Go to resource.

6. From the left side menu, select Deployment Center (image below)

Deployment Center

Here you can find multiple options on how to upload your code. Unless you are familiar with CI/CD process Manual deployment is the best option for a now. You can choose to upload your site files to OneDrive or Dropbox or upload them directly to the applications using an FTP client like FileZilla which is a quick and easy process (follow this guide). You can find your domain, username, and password for FTP by simply selecting the option. Be careful not to upload any sensitive information as the contents of your site will be publicly accessible by default.

FTP Credentials

Once you are done uploading, you can open your site using the URL shown during app creation or simply navigate to Overview from the left side menu and click on Browse.

That’s all for now. If you are using any other services that are really good please leave them in the comments section. Also, reach out to me in comments if you face any issues during any of the steps.