11 Modern Jamstack Hosting and Cloud Deployment Platforms

SHARE

11 Modern Jamstack Hosting and Cloud Deployment Platforms

SHARE

11 Modern Jamstack Hosting and Cloud Deployment Platforms

April 20, 2021

Let’s take a look at a couple of Jamstack hosting and cloud deployment platforms that are favored by the community.

Thom Krupa

By Thom Krupa
@thomkrupa

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, Vercel, AWS Amplify, Firebase, etc.

Before we begin, please keep in mind that click baitish as this list post may seem, it is meant to inform, discover, and maybe provoke discussion, help you compare available solutions, 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 that you’re 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?

To put it as simply as possible, a static website is a website made up of HTML pages with pre-populated content. The browser requests 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, and no content is 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).

newsletter abstract background

Stay ahead of the curve!

Get the exclusive Jamstack web dev case studies (and more) in your mailbox!

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 powerful frontend that easily eases 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:

  • 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.
  • Headless CMS. They serve as your content keepers. The awesome thing about headless CMSs is that they decouple content management from your front end. Thanks to that, you can deliver your content beyond websites and apps and repurpose it from many different frontends.
  • [Optional] A JavaScript framework of your choice. Some SSGs like Gatsby or Next.js are built on top of React.js. Others like Nuxt and Gridsome use Vue. Others like 11ty or Hugo don’t use any specific JS framework.
  • Hosting and deployment. Read more below ⬇️

Essential parts

The essential parts of every hosting provider are:

  • Continuous integration (CI) is a practice to merge all changes and branches to the main branch as often as possible. By doing so, you’re avoiding integration issues that can happen on the big release day. Push change, build preview, test, and finally deploy to production.
  • Continuous delivery (CD) is the ability to deliver an app anytime. In practice, it means you use git and have a build pipeline connected with deployment to server or CDN.
  • Content Delivery Network (CDN) is a global, distributed network of proxy servers and data centers.

A modern deployment platform is a tool that combines all of the above practices and features. It enables developers to ship apps safely and quickly with no need for a dev-ops team and infrastructure maintenance. Connect git repository and start building.

Fight for the developers

Deployment platforms evolve these days very quickly. The main reason is the number of tools and the growing popularity of serverless and Jamstack.

Every big corp cloud provider has its own solution. Amazon has Amplify. Google has Firebase. Microsoft recently launched Static Web Apps and Cloudflare launched Pages. It is a very competitive space in which companies fight for new users offering different products and approaches.

Essential parts, CI/CD and CDN, are no longer a feature. Those are must-haves that developers expect to have for free. Most of the tools we describe in this post support serverless functions. Some have analytics, other authentication, databases, and/or form handling built-in. All of them fight for developers’ attention improving the experience and introducing more and more new features.

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.

p.s. If you need a deep dive into available options and how they stand against each other we’ve made a simple host compare tool to help you with that.

Netlify

Last update: April 18, 2021

Netlify 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.

  • Netlify logo
  • Website: netlify.com
  • Founded: 2014
  • Total raised: $
  • Infrastructure: Multi-cloud
  • Serverless: Node.js, Go

Creators of the Jamstack term

Mathias Biilmann, the CEO and co-founder of Netlify, coined the Jamstack term to explain a set of development practices.

Netlify is not just a CI/CD tool. It offers several products that help to manage dynamic features on static websites.

Multi-cloud insfrastructure

Netlify’s Edge network runs on 3-4 different cloudproviders, depending on whetheryou’re using Standard or High-Performance Edge. Originservers can swap between AWS, Digital Ocean, GCP, or Yandex. This redundant setup minimizes the risk of downtime. If any provider goes down, Netlify can easily swap to a different provider.

Atomic deployments

Netlify leverages the concept of atomic deployments. Every new build is a new container. It has multiple benefits:

  • unique URL for every branch, pull request and commit
  • main domain switches between containers, which enables easy rollback to any previous build

It also has some drawbacks. The main difference between the classic CDN and atomic model is that once you push the new deployment, the old files will not be available.

Backend stuff handled by Netlify

A pure static website without a backend has some dynamic limitations. You have no server, which is cool because you don’t have to manage it. But. A natural question arose - how to handle some common dynamic actions like forms or auth?

You can, of course, use external API-first services. There are plenty of options we’ve shown in our Jamstack Landscape, but if you like to have everything under one roof, Netlify gives you a few products. Let’s start with a very basic feature of almost every website. Forms.

Netlify Forms

How to handle on a static website such a basic feature like form submissions? There are plenty of tools that solve that particular problem. Netlify Forms is one of them. It stores form submissions and can notify you via email, Slack, or a custom POST webhook.

Netlify Identity

Netlify Identity is a user management service fully integrated with Netlify. Handle basic user actions as logins, signups, and password recovery. It’s useful if you want to restrict access to the content or make authenticated API calls. Netlify Identity supports external OAuth providers: Google, GitHub, GitLab, and Bitbucket.

Netlify Analytics

Server-side or, in this case, CDN-side analytics based on logs. There is no client-side JavaScript code which means it doesn’t affect performance.

Netlify CLI

Netlify’s command-line interface (CLI) helps you manage your project from your local terminal. You can trigger a new build or deploy a local build to the cloud

By running netlify dev you can have the whole Netlify’s environment locally. It’s an easy way to test serverless functions or build on your machine. There is no need to push new changes to the git repository with some messy commits.

Dashboard

Complexity is one of the main issues of large cloud providers like AWS or Azure. They offer hundreds of different products, and it’s easy to get lost.

Netlify and similar products built on top of the cloud are solving this issue. The user interface is much better. User Experience is more friendly.

Netlify Plugins

Plugins extend the functionality of the build process. You can hook an action into different events like onPreBuild or onPostBuild. There are 6 different events. You can manage cache across the builds to speed up the building time. Do some things when your build finishes.

Most Build Plugins are created by independent developers.Some plugins are created and supported by the Netlify Plugin, including the Essential Next.js plugin which enables support for Next.js features like Preview Mode, Internationalized Routing, and more.

Conclusion

Netlify is a great tool that significantly improves development workflow. Netlify’s products enhance and solve common static site issues. UI is very friendly and intuitive.

Features
  • Automatic HTTPS
  • Atomic deploys. Instant, one-click rollback to any version
  • Background functions up to 15min
  • Password Protection in Pro plan
  • Handles Forms and Authentication (Netlify Identity)
  • CDN-side Analytics
Use Cases
  • Static Websites. Netlify works with every Static Site Generator.
  • Serverless functions and apps.

Compare Netlify with:

  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

Vercel

Last update: April 18, 2021

Vercel is a cloud platform for Jamstack websites and Serverless apps. Integrates perfectly with every Next.js project. Founded in 2015 by Guillermo Rauch. Solves a critical issue of big cloud providers like AWS - Developer Experience.

  • Vercel logo
  • Website: vercel.com
  • Founded: 2015
  • Total raised: $61M
  • Infrastructure: AWS, GCP
  • Serverless: Node.js, Go, Python, Ruby

Creators of Next.js

Next.js works on Vercel as you’d expected it to work. That’s all I would need to say. Every single Next.js feature like Preview, Incremental Static Generation is covered. With no additional config needed.

Vercel feels very much like Apple but in the frontend world. The platform is like Macbook, and Next.js is like OS X. They fit. Maintaining the infrastructure and working on software is a great advantage and gives a next-gen user and developer experience.

Infrastructure

Vercel Global Edge Network is built on top of Amazon Web Services (AWS) and Google Cloud Platform (GCP). In practice, GCP is used only for routing in the Western Europe region, Brussels in Belgium.

Vercel Analytics

Vercel collects Real User Metrics and beautifully presents data. Instead of checking if your app is fast in the emulated environment by Lighthouse, you can check how it works for real people visiting the website.

Analytics by Vercel currently supports Next.js, Gatsby, and Nuxt projects. Works out-of-the-box if you use Next.js and Vercel to host the website. It can be enabled if you host your website somewhere else but requires a Vercel Pro plan.

Dashboard

In modern deployment platforms like Vercel, dashboard and user experience is one of the things that makes the difference. In contrast to big cloud providers AWS or GCP, Vercel Dashboard is intuitive, easy to manage and navigate. Team, env variables, billing. All you need to set up a frontend project easily is there.

Usage metrics

Usage view is a dashboard of all critical metrics. You can check if your functions fail, what CPU they use and how fast they execute.

Loading Video

Loading Video

Password protection, custom deployment domains

Some features like password protection can be quite pricey. If you need this but don’t want to pay $150/mo, Vercel might be a bummer.

Vercel Integrations

Vercel Integrations are apps that connect external services with the Vercel project. Install Lighthouse v4 and run an audit for each deployment. Use LogDNA or Logflare to analyze all your apps in one centralized place. All just in one click.

Even though Vercel launched the marketplace with integrations almost 2 years ago, there is no much work put into apps’ ongoing development. There are 21 integrations in total. Many of them are in beta. A lot are outdated. Lighthouse, which is the first featured integration, is 3 versions behind the current stable version. Some apps seem to be no longer developed.

Vercel CLI

vercel command allows you to deploy projects straight out of your terminal quickly. Just type it, hit enter, and enjoy a new build on the cloud.

vercel dev replicates the whole Vercel deployment on your machine. You can test serverless functions locally without triggering new deploy or push changes to the repository.

To explore more options, check out the docs.

Conclusion

Vercel is a great Jamstack and serverless platform. It covers everything you need to develop a modern site or app. It’s very frontend-friendly. All you need to do is to connect the git repository and start pushing code.

Features
  • Automatic HTTPS
  • Atomic deploys. Instant, one-click rollback to any version
  • Real user metrics Analytics
  • Generous free plan
Use Cases
  • Next.js apps.
  • Static Websites. Vercel works with every Static Site Generator.
  • Serverless functions and apps.

Compare Vercel with:

  • Netlify logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

Cloudflare Pages

Last update: April 18, 2021

In 2017, Cloudflare introduced Workers, a JavaScript that executes on the Edge of CDN with minimal cold-start. The next product, Workers Sites debuted in 2019, Cloudflare entered the world of static hosting. It felt like a natural extension of Cloudflare's top-notch CDN. In 2021, they go even further, introducing a full CI/CD solution for Jamstack projects called Pages.

World-class CDN

Cloudflare is known best as an impressive and one of the fastest global content delivery networks (CDN). With more than 200 data centers around the world, Cloudflare CDN is one of the biggest free networks.

For years Cloudflare has been investing in the Internet, improving its security, offering a free CDN, DNS, DDoS attack mitigation, SSL, and many other products like Argo.

Cloudflare has spotted an opportunity in static site evolution. New products like Workers and Pages feel like a natural way of growing the Cloudflare product portfolio.

Zero cold start edge functions

A common issue of serverless functions like AWS Lambda is a cold start. The time that function needs to execute for the first time. Cloudflare Workers essentially run instantly, because of 0ms cold start, they can be used as an entry point for your website. That enables endless dynamic enhancements for static files.

HTMLRewrite class is a part of Workers Runtime API. Imagine a jQuery-like API to modify HTML response directly on the CDN with no server involved. Based on HTTP headers like Cookie, you can change content, styles, or scripts included on the page.

CI/CD with no user, sites, and bandwidth limits

Pages are the most recent Cloudflare product, and essentially it is a CI/CD. Connect Github repo, configure build script and automatically deploy a website.

Currently, it’s a beta, and you can start for free with a quite generous plan: unlimited sites, users, and bandwidth.

Server-side analytics

Server-side analytics are based on CDN logs and are not affected by ad-blockers. It’s a secure, privacy-friendly way of collecting essential data like unique requests. Bonus: all of it available through GraphQL Analytics API if you want to create a custom dashboard.

Conclusion

Cloudflare Pages is one of the most interesting solutions for Jamstack projects. Thanks to Workers, you can run JS straight on the Edge, modify HTML response, or use it for auth. Pages are still in beta and quite new. So it might be a perfect moment to test it out on your personal projects and gradually introduce it to your company.

Features
  • Automatic HTTPS
  • Atomic deploys. Instant, one-click rollback to any version
  • Password Protection
  • Workers KV database
  • CDN-side Analytics
Use Cases
  • Static Websites.
  • Custom experience on the edge via Workers.
  • Edge database, KV storage.

Compare Cloudflare Pages with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

Firebase

Last update: April 18, 2021

Firebase is a Backend-as-a-Service platform. It's not just hosting or serverless. It has a powerful SDK, Authentication, and Real-time database.

  • Firebase logo
  • Website: firebase.google.com
  • Founded: 2011
  • Total raised: $7M
  • Infrastructure: GCP
  • Serverless: Node.js, Go

Infrastructure

Firebase is a Google product, and it uses Google Cloud Platform under the hood. GCP is a cloud computing service much like AWS, and just like 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.

Everything you need to develop an app

Pretty much the same as 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.

Firebase offers a Real-time NoSQL Database in which you can store and sync JSON data. Every time data changes, each device that runs your app receives changes almost immediately. A real-time database is a great fit for applications that need some collaboration features between users. It can also be used offline. A great choice for Progressive Web Apps and mobile apps. Data is stored locally, and once the device is connected to the Internet, Firebase will sync changes.

Dashboard

In contrast to the GCP dashboard, Firebase is much simpler. You don’t need to take a full-day course to set up a simple project. On the left sidebar are all essentials tabs.

Conclusion

Firebase is a great choice if you build a mobile app. You can set up auth and database quickly. Easy integrate more advanced things like Machine Learning or Push Messages. Firebase SDK gives you a fast start and covers all common features.

Features
  • Realtime database
  • A lot of built-in backend products like Push Notifications, Machine Learning
  • Integration with Google Analytics
Use Cases
  • Backend as a service for mobile and web apps.

Compare Firebase with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

AWS Amplify

Last update: April 18, 2021

AWS Amplify is built on top of a huge AWS ecosystem. It gives all tools needed for modern web development. Connect repository, set build command, and deploy directly to the largest cloud provider on Earth.

  • AWS Amplify logo
  • Website: aws.amazon.com
  • Founded: 2018
  • Infrastructure: AWS
  • Serverless: Node.js, Java, Go, .NET Core, Python

S3 as static hosting

Amazon Web Services (AWS) launched S3 in 2006, a cheap, scalable, high availability, and low latency object storage. It provides an option to host a static website but doesn’t offer a build pipeline.

Amplify

Amplify is a fully managed static hosting solution for modern Jamstack projects. It handles CI/CD and CDN.

There is no need to deal with IAM (which is a service to manage access to other AWS services). No need to configure CloudFront, S3, and CodePipeline. All you need is to connect the git repository and set the build command.

AWS Amplify Console

AWS Amplify Console looks like an Amazon version of Firebase, but instead of GCP, it uses the power of Amazon cloud. Cognito for authentication, AWS AppSync, and Amazon DynamoDB to power real-time database called DataStore.

Dashboard

Let me sum AWS UI and UX in one screenshot:

This is one of the first steps when you’re trying to deploy an example Gatsby app. Why dark or light mode if you can have both at once? But joking aside, AWS UI is bad. It has many glitches, it’s not very intuitive, and it’s hard to manage. Don’t get me wrong. AWS is a powerful cloud platform, it has dozens of different products, but it misses a good UX team.

Conclusion

AWS is famous for its complexity. Amplify tries to simplify the most common tasks and use cases. It is a step in the right direction. Amplify focuses on user experience and gives frontend developers one of the easiest ways to use and connect various AWS products.

Features
  • Automatic HTTPS
  • Atomic deploys. Instant, one-click rollback to any version
  • Handles authentication (Amazon Cognito)
  • Scheduled functions (like CRON jobs)
  • Push Notifications and Machine Learning integrations
Use Cases
  • Backend as a service for mobile and web apps.
  • Static hosting

Compare AWS Amplify with:

  • Netlify logo
  • Vercel logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

Heroku

Last update: April 18, 2021

Heroku is one of the first Platform as a Service (PaaS) solutions that achieved great success. Founded in 2007 and acquired by Salesforce in 2010. Loved by a lot of developers for its flexibility and easy scaling. But is it good for a static-first Jamstack project?

  • Heroku logo
  • Website: heroku.com
  • Founded: 2007
  • Infrastructure: Heroku Cloud
  • Serverless: None

What is PaaS?

Platform as a Service is a model in which a company offers you the infrastructure you can manage. Run, develop using the cloud without the complexity of maintaining the infrastructure.

Everything is a dyno

Dynos are the main Heroku products. Each dyno is a virtualized Linux container. That makes scaling easier since you can increase or decrease the number of used dynos, manage its size and type.

Is Heroku good for Jamstack?

Heroku is not made for static-first Jamstack projects. It doesn’t have its own CDN. You can integrate it with 3rd-party networks like Amazon CloudFront, but that requires more steps and hassle. It’s too complicated to host a static website, and there are many better and cheaper options.

Conclusion

Heroku is a great solution if you run a full server backend. It integrates easily with Node, Ruby, Java, PHP, Python, Go, Scala, or Clojure. A large ecosystem of integrations and add-ons makes it trivial to connect databases and 3rd-party services.

Features
  • Easy scalable Linux containers (dynos)
  • One-click rollbacks
  • Large ecosystem with integrations (add-ons)
Use Cases
  • Serverful apps.
  • Databases.

Compare Heroku with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • GitHub Pages logo
  • Begin logo

Render

Last update: April 18, 2021

Render offers much more than static site hosting. You can set a good old server to run PHP or Ruby. Run a Docker Container. Easily set CRON Jobs and create databases. It's gaining a lot of popularity and becomes a modern alternative to Heroku.

  • Render logo
  • Website: render.com
  • Founded: 2018
  • Total raised: $6.8M
  • Infrastructure: AWS, GCP
  • Serverless: None

Infrastructure

Render is a multi-cloud platform. They use AWS for the European region and Google Cloud Platform for the US region as a data center.

Web services, static hosting

Loading Video

Loading Video

The main advantage of Render over other Jamstack deployment platforms is its support for servers. If you need to run a server and scale it for some reason, Render handles this great. Support every backend you can imagine, from Node to good ol’ PHP.

No serverless yet

You can’t run serverless functions like Amazon Lambda on Render. That’s for sure might be a blocker for some. It’s a top feature request, but there is no ETA. Render team didn’t confirm if they plan to support lambdas or no. If you’re looking for Function as a Service (FaaS), Render is not a good option.

Conclusion

Render is great if you develop both static apps and server backends. They position themselves as competitors to Heroku with better pricing, more flexibility, and even easier UX. It supports static websites with a global CDN. If you like Heroku, you will love Render.

Features
  • Automatic HTTPS
  • Database
  • CRON jobs
Use Cases
  • Serverful web apps.
  • Static sites.
  • Databases.
  • Docker containers.

Compare Render with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

Digital Ocean App Platform

Last update: April 18, 2021

DigitalOcean has been offering cloud services for years. The core product is Droplet. In 2020 DigitalOcean presented a fully managed solution for static sites and web apps called App Platform.

  • Digital Ocean App Platform logo
  • Website: digitalocean.com
  • Founded: 2012
  • Total raised: $455M
  • Infrastructure: DigitalOcean

DigitalOcean is known as a very scalable cloud-based web hosting. They offer a unique product called Droplet. It allows to adjust the amount of memory, the number of virtual CPUs, SSD disk size, and transfer limits. When creating a Droplet, you need to choose an image with OS, type of CPU, transfer, and many other options.

It’s fairly easy, but often you want something simpler, something that works.

In late 2020 DigitalOcean has announced the App Platform. It aims to provide a fully managed platform to deploy modern projects. Connect git repository, set CI/CD build command, and deploy. DigitalOcean uses Cloudflare CDN, which has built-in DDoS mitigation too.

Is there anything that makes it different from other solutions on the market?

Managed PaaS

Developers like to focus on development, not deployment.

Conclusion

DigitalOcean App Platform is a good choice to host static sites if you already use Digital Ocean for your backend and like the platform.

Features
  • Automatic HTTPS
  • Cloudflare CDN
  • Unlimited team members
Use Cases
  • Static Websites.

Compare Digital Ocean App Platform with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

Azure Static Web Apps

Last update: April 18, 2021

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.

What are Static Web Apps?

I guess you already know what Jamstack is. Static Web Apps are Jamstack apps but in Microsoft terminology. I’m not sure what’s the reason to call it differently. A few months before Static Web Apps launch, Azure published a detailed guide about building and deploying Jamstack apps on Microsoft’s cloud. There is no mention of Jamstack on the new Azure product, even tho it address and improves the modern deployment process.

Is it a competitor to Amazon and Google?

Not really. Static Web Apps is nothing like Firebase or Amplify. It’s a very basic product, it heavily depends on Github Actions, and basically, all you can do is deploy static assets and serverless functions.

Dashboard

Azure doesn’t have its own CI/CD. It only connects with Github and uses Github Actions to build the project and deploy it to Azure Edge.

After successful deployment, you will have a link to your website and many usage metrics like requests, function hits, and errors. You can’t easily revert to specific deployment from the dashboard. The only option is to revert git commit, but that won’t bring back your data if you fetch it from a headless CMS.

Conclusion

Static Web Apps are in Preview mode. It connects only with Github and requires Github Actions to build and deploy a product. It’s very limited for now. If you use Github and Azure, it might be worth trying.

Features
  • Automatic HTTPS
  • Integrates only with GitHub
  • Static Web Apps is free during preview. Pricing for this service will be announced at a later date.
Use Cases
  • Static Websites.

Compare Azure Static Web Apps with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo
  • Begin logo

GitHub Pages

Last update: April 18, 2021

GitHub Pages allow you to serve any static website straight from your Github repository. This option is especially worth considering if you are building a single-page app, personal or small business website, and use Github.

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.

Themes

To start quickly, Github offers you a few themes. Let’s be honest, they look a little bit outdated, but if you need to run something quick, it will be just fine.

Loading Video

Loading Video

Conclusion

GitHub Pages is an easy way to go live with a static website if you already use GitHub to host the repository. GitHub gives you a username.github.io/repository URL. You can use your custom domain too. It’s a perfect solution if you want to set up a landing page for your side project quickly.

Features
  • Automatic HTTPS
  • Integration with GitHub
  • Custom domains
Use Cases
  • Jekyll static sites.
  • Simple documentations for open source project

Compare GitHub Pages with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • Begin logo

Begin

Last update: April 18, 2021

Begin is a platform built on top of AWS that focuses on serverless functions and API. It supports static websites using CloudFront as CDN. It's open-source and doesn't lock you in. You can export code and use raw AWS.

  • Begin logo
  • Website: begin.com
  • Founded: 2015
  • Infrastructure: AWS
  • Serverless: Node.js

Brian Leroux and Ryan Block founded Begin in 2015. At first, it was supposed to be a chat-based tasking product. That product failed. Begin pivoted to serverless tooling and eventually created a full cloud platform for serverless functions and static sites.

Staging and production environments

You can only deploy an app to production if it builds in a staging environment. This means it will automatically build the main git branch as you deploy changes. Unfortunately, Begin doesn’t build other branches nor pull requests.

If you click the “Deploy to Production” button, you will see a popup with an optional field for release notes. It’s cool, but if you already use Github releases or Pull Requests, that might be a bit odd and unnecessary step for you.

Tools like Netlify and Vercel got us used to each commit’s unique preview URL on every branch and pull request. That removes the staging environment since everything that is not production is a test or staging environment.

Run the app on your own AWS account

Begin gives you an option to export your app and run it directly on the AWS platform. It uses the Architect framework to make deployment easier.

Conclusion

Begin is a straightforward serverless platform. It’s not perfect and misses a few things that most other tools have out of the box. The main advantage for sure is the zero lock-ins. The ability you can eject and use Arc makes it a great choice for developers who eventually want to

Features
  • Automatic HTTPS
  • Zero lock-ins, you can eject from Begin anytime
  • Isolated staging and production environment
Use Cases
  • Static web sites.
  • Serverless API functions
  • Backend for mobile apps
  • Slack apps

Compare Begin with:

  • Netlify logo
  • Vercel logo
  • AWS Amplify logo
  • Cloudflare Pages logo
  • Digital Ocean App Platform logo
  • Firebase logo
  • Azure Static Web Apps logo
  • Render logo
  • Heroku logo
  • GitHub Pages logo

Wrapping up

There aren’t that many drawbacks in using the 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 your project/business scale and can happen to more traditional hosting options as well.

AWS, Azure, Google Cloud are huge cloud computing platforms, and CDN/hosting is a small part of their business. Netlify, Vercel, 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 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 a 1-on-1 talk and learn more about what we can do for you and your business.