6 Modern JAMstack Hosting and Deployment Solutions

Back to blog

12 min to read

6 Modern JAMstack Hosting and Deployment Solutions

Let’s take a look at a couple of JAMstack hosting and deployment options that are favored by the community.

Nebojsa Radakovic

By Nebojsa Radakovic
November 25, 2019

In the past few years hosting solutions and CDNs have become much more than just a place on the internet, offering additional features to help you with deploying a modern website or an app.

Before we begin, please keep in mind that click baitfish as this list posts may seem it is meant to inform and maybe provoke discussion not brawl over whos the best.

Let’s say you went for JAMstack web dev architecture for your website or app project and all of the coding is done. It’s time to find the best place to host it, right? Well, wrong. You really should have done this before. But don’t worry, because with static files your about to serve pretty much any host can do the work. However, not all of them are built with JAMstackers👨‍💻 in mind.

What is a static website?

Devs move over to the next paragraph. To put it as simply as possible, a static website is a website made up of HTML pages with pre-populated content. The browser makes a request for the URL of a static page, after which the server delivers the whole static page with all the content already there. No calls are made to a database, no content generated on the fly. This is different on so many levels than what your WordPress is doing right now + it is so much more secure. Contact us now to discuss your change (shameless plug).

In the past few years hosting solutions and CDNs have become much more than just a place on the internet offering additional features to help you with deploying a modern website or an app. This gave birth to a new bread of hosting platforms like Netlify, Zeit, AWS Amplify, Firebase, etc.

But, before we go on explaining these…

Stay ahead of the curve!

Sign up and be the first one to get JAMstack posts, like this one, in your inbox.

What’s that JAMstack thing again?

A modern web development architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup. - Mathias Biilmann, Netlify co-founder

Since you are here, reading this article, there’s a strong possibility you’ve already heard about the concept of JAMstack. It is more than a trend for web developers to move from dynamic server-side apps to client-side stacks. It is a shift change from the backend to the more and more powerful frontend that easies the dev workflow.

The best practices most devs would agree on that define a JAMstack project are: atomic deploys, automated builds, building and hosting are decoupled, site/app is on a CDN, instant cache invalidation, and content updates are pushed through Git or an API CMS (not really a necessity but it sure helps with multiple teams/edits, etc.).

Typical JAMstack build

For example, for a typical JAMstack website you’ll need to use:

  • A JavaScript framework of your choice. One ring to rule them all.
  • A static site generator. An SSG is a tool that builds static HTML pages out of the input content, whether it’s taken from a CMS or a built-in template. There’s a huge number of SSGs suitable for almost any programming language.
  • A Headless CMS. They serve as your content keepers. The awesome thing about headless CMSs is that they decouple content management from your frontend. Thanks to that you can deliver your content beyond websites and apps and repurpose it from many different frontends.
  • Hosting and deployment. Read more below ⬇️

The Best Hosting and Deployment Solutions

JAMstack hosting options utilize the concept of serverless architecture (a system of running websites and applications without infrastructure management). They rely on third-party cloud-hosted services, like AWS, Google Cloud Platform, etc. The hosts carry out all server management, as the users pay a provision.

Having said that let’s take a look at the ready-to-use hosting and deployment solutions for JAMstack projects.

Netlify

Netlify hosting deployment

How to best describe Netlify? How about as a company with a clear JAMstack vision? After all, they are the ones that coined the term JAMstack. In essence, Nelify is a cloud computing company that offers hosting and serverless backend services for static websites. The best thing about it is that it takes away the hustle of managing the infrastructure, allowing you and your team to focus on coding.

For example, HTTP/2 standard is used, HTTPS is enabled by default, your website is served via CDN, you can use their add-ons (or you can make one of your own) to extend your site functionality, etc. In case you stumble on roadblocks, amazing support and a helping community all working in unison comes with it as well.

Not only that but with Netlify Dev feature you are able to replicate your production environment on your laptop so you can preview site generation, functions, and edge logic as well.

On top of it all, their virtually unlimited free tier will save your wallet but still offer many of the benefits mentioned above.

ZEIT Now

zeit now

ZEIT Now is a cloud platform for static front-ends and serverless functions. I think that the best explanation I’ve found is that it is a global deployment network built on top of all existing cloud providers (link here).

Basically it allows you to write code in your preferred language or framework and ZEIT Now is capable of transforming your code into static files or serverless functions. Benefits are obvious ie hosting with instant deploy, minimal to none configuration and ability to scale automatically.

Whatmore, as of May 2019 they announced one command to run it all on localhost now dev allowing you to run a local development environment.

Just as the first option above, ZEIT Now too offers an amazing free tier plan.

GitHub Pages

github pages

GitHub Pages allow you to serve any static website straight from your repository. This option is especially worth considering if you are building a single-page app, personal or small business website. This way you’ll have a fast performing site that is easy to manage (the file changes are instantly deployed). Best of all GitHub Pages already have HTTPS and CDN built-in. You can use a service like Cloudflare to make it more DDoS protected. Think of it as an additional security and protection layer.

You can run the files through a build process with a static site generator like Jekyll for example and publish HTML, CSS, and JavaScript files straight from your repository on GitHub.

Cloudflare Workers Sites

cloudfare workers sites

Cloudflare is a global CDN with data centers in over 194 cities across 90 countries. Cloudflare Workers allow developers using Cloudflare, to build and deploy serverless apps globally utilizing the network to run the code near where the users are located. It is fast and cheap and you can scale it any which way you want.

Workers Sites enables you to deploy any static site to Workers. While it was possible to deploy a website before, it wasn’t an easy process. With Workers Sites deploying an all static generated site in VueJS, React, Next, NuxtJS, Hugo, Gatsby or Jekyll is as easy as a single click of a button.

AWS Amplify Console

AWS amplify

Amazon Web Services (AWS) is a secure cloud computing service offering a number of services such as compute power, database storage, cloud file storage, content delivery, analytics, application services, serverless functions, and many others.

The idea behind AWS is to be an infrastructure-as-a-service offering platform that provides companies with full infrastructure solutions for all their business needs.

Strictly speaking about the hosting, advanced users usually play with S3 (Simple Storage Service) paired with CloudFront (CDN) for maximum control and management options. But we are interested in AWS Amplify Console.

AWS Amplify Console is hosting for full-stack serverless web apps with continuous deployment. AWS Amplify Console pretty much provides the same service as Netlify or ZEIT Now. The added benefit, however, is the ease of integration with other AWS Services which makes it the best tool if you are working on the AWS Cloud Infrastructure.

AWS has a simple monthly calculator set here to help you calculate your potential costs.

Firebase

firebase google

Google Cloud is a cloud computing service much like AWS and just as AWS it offers world-class infrastructure and a robust set of solutions for data management, application development, etc.

Hosting vise, you can use their Cloud Storage option but here we are more interested in Firebase a mobile app dev platform often labeled as backend as a service, which is built to help you host a single-page web app, a mobile app landing page, or a progressive web app without the hassle.

Pretty much the same as with Amplify Console and AWS, if you really on Google Cloud and their services for a project at hand, integration vise you’ll have fewer complications if you use Firebase. But unlike Amplify Console, Firebase is built with the mobile app in mind first. So, you might say it is Google’s mobile application development platform.

Google Cloud Platform pricing calculator here can help you understand your potential expenses.

Azure

azure platform

Amazon has AWS. Google has Google Cloud. Microsoft has Azure. It is a cloud computing platform with over 100 services to help you build, deploy, and manage applications in-cloud, with tools and frameworks of your choice.

But unlike AWS or Google Cloud which have Amplify and Firebase created specifically for quickly deploying apps, Azure doesn’t have anything like that to compare.

Even so, being a top cloud computing platform they too deserve to be mentioned here.

Use the Azure pricing calculator here to estimate the costs for Azure products you might be interested in.

AWS vs Google vs Azure

My 2cents on web chatter about top platforms. Swiss army knight of cloud computing, the oldest player in the game, AWS still runs the show in cloud computing as it has the biggest share of the market.

However, Google Cloud and Azure are slowly closing the gap. Google Cloud thanks to the fact that since you are using Google’s own network that connects the company’s data centers, you get amazing speed at a better price (with the speed, comes the ability to process more data in less time). Azure, on the other hand, plays hard on hybrid cloud angle and integration with Microsoft tools and software.s (and brand loyalty for that matter).

What matters here the most is region availability and latency, and other service integration complexity.

figure 5

If you want to dig a bit deeper about this APNICs’ CDN response time comparisons study is a great place to start.

Wrapping Up

AWS, Azure, Google Cloud are huge cloud computing platforms and CDN/hosting is a small part of those. Netlify, ZEIT Now, GitHub Pages and Cloudflare Workers Sites use a cloud/CDN under the hood, but they are something different. They are full-blooded continuous deployment and hosting platforms for modern web projects.

There aren’t that many drawbacks in using hosting and deployment options mentioned above. Perhaps, the most significant ones and often mentioned are potential service outages, potential vendor lock-in situation, and potential cost concerns. I’ve used potential intentionally here because these really depend on the scale of your project/business and can happen to more traditional hosting options as well.

There is much more to choosing a perfect host for your project besides project needs, pricing, and features. Take service popularity, community, and support into consideration next time when you are shopping for hosting and deployment tools.

Or, why not, consult expert web devs (like us).

Have a project at hand that is perfect for JAMstack? We can help in that regard.

CLICK HERE to schedule 1-on-1 talk and learn more about what we can do for you and your business.

Further Reading

Anyone that’s ever been involved with web dev knows how big of a topic this is. I personally was lucky enough to consult with Bejamas devs but I also found these to be extremely useful. Take a look:

List of Hosting & Deployment options for your static site - https://www.thenewdynamic.org/tools/hosting-deployment/
THE MAJOR PROVIDERS. The biggest names in serverless, providing wide swaths of functionality - https://serverless.css-tricks.com/services/major/
Building JAMstack Applications with Gatsby and AWS Amplify Framework - https://hackernoon.com/building-jamstack-applications-with-gatsby-and-aws-amplify-framework-d7e2b9e7117e
Cloudflare vs CloudFront: How They Work, Plus Which is Best For You - https://wp-rocket.me/blog/cloudflare-vs-cloudfront/
Google Cloud vs AWS in 2019 (Comparing the Giants) - https://kinsta.com/blog/google-cloud-vs-aws/
AWS vs Azure vs Firebase vs Heroku vs Netlify: How To Choose the Best Platform for Web Projects - https://medium.com/better-programming/aws-vs-azure-vs-firebase-vs-heroku-vs-netlify-how-to-choose-the-best-platform-for-web-projects-482d017de254
Cloud Wars 2019 - https://www.cbtnuggets.com/blog/certifications/microsoft/aws-vs-azure-vs-google-cloud-wars-2019
Static website hosting: who’s the fastest? AWS, Google, Firebase, Netlify or GitHub? - https://www.savjee.be/2017/10/Static-website-hosting-who-is-fastest/

Share

About author

Nebojsa Radakovic

Nebojsa Radakovic

SEO wiz turned JAMstack n00b. A modern-day jack of all trades with 20 years of digital marketing experience.

Readers also enjoyed