Ways to host single page application (SPA) and Static Site for FREE

As Single page applications are in high Demand. And on the new Frameworks allow you to create single page applications, so what are the ways to host single page applications (SPA) and static site for free.

These days the front end and the backend of any application are completely separate. Front-end being Single page application and back-end being completely API centric.

This allows front-end to be Completely Static and API being just Data.

So where to host this static Front End? Here are some ways:

#1 GitHub/Bitbucket/Gitlab Pages

Hosting on the pages features of GitHub or Bitbucket Cloud or Gitlab is very simple. Just create a repository on these respective sites and generally the master branch is ready to be published as the site with domains ending with <your-site>.github.io, <your-site>.bitbucket.io and <your-site>.gitlab.io respectively.

The main benefit of having hosting Static Site or SPA on these Pages like service is the highest availability; 99.99% uptime.

And in few cases, you can configure to use custom domains.

GitHub Pages

For github pages, you can go multiple ways.

docs directory in master branch

gh-pages branch

master branch itself

If your master branch has a docs directory, you can go to the repository settings and build the pages on the docs directory.

In other case you can push your SPA or Static Site related code to the gh-pages branch and that will be published to the <username>.gtihub.io/<repository-name>/

In case of publishing master branch, the site structure is plain; you need to have has index.html on the root level of your branch.

You can also create your static site project add bare minimum server code to make it serve those files as well; for example by using heroku/php buildpack, you will get apache by default and hence you can serve your static site or SPA very easily.

#5 ngrok

Well ngrok is not any cloud based hosting but a tunneling service which tunnels traffic between the ngrok provided url and your specified address.

For this, you need to download the ngrok binary.

Now you can create a site, start your local server and launch following command in CLI:

ngrok http 80

The above command create a ngrok subdomain and start tunneling http from that URL to you system's 80 port.

So you can easily demonstrate the project for shorter time.

#6 Netlify

Netlify is also a great platform to host your site for free. Even with free features, you can host small size site easily.