Technology News

How to Deploy Your Jamstack Site to Cloudflare Pages

How to Deploy Your Jamstack Site to Cloudflare Pages

This article describes how deploy your Jamstack site to Cloudflare Pages — a new service with a simple-to-use and generous free hosting plan.

The web world may be using WordPress, but developers are moving toward Jamstack technologies (also referred to as static sites). The name Jamstack (once written as JAMStack) stands for JavaScript, APIs, and Markup, and was devised by Netlify. Like Ajax, the scope of the term has widened, but a Jamstack site typically uses pre-rendered static content with client-side logic connecting to a set of loosely coupled back-end APIs. The benefits are compelling:

  • Performance: Where possible, Jamstack sites generate pages once during a build process rather than on view. They’re fast and are often deployed to content delivery networks (CDNs) physically closer to the user.

  • Scalability: Jamstack sites are a collection of generated files which do not require server-side processing or database connectivity. Pages are effectively pre-cached and deployed globally.

  • Portability: Once generated, it’s possible to host a Jamstack site anywhere. There’s no vendor lock-in.

  • Development: Developers can use whatever tools they prefer to generate a site. If necessary, article editors can continue to use WordPress or any other CMS to write content.

  • Deployment: Jamstack sites can be automatically deployed to test and production sites by committing Git branches. There’s no need for complex continuous integration or deployment processes.

The following tutorials explain how to create a Jamstack site from scratch:

  • Getting Started with Eleventy (see the Github repository)
  • How to Create a Static Site with Metalsmith

Jamstack Hosting Services

You can host a site anywhere including GitHub Pages and Amazon S3, but Netlify and Vercel dominate the Jamstack space. They offer generous plans and simple Git-based deployments.

The latest entrant to the market is Cloudflare — a company best known for their global CDN, edge security, and caching services. The new Cloudflare Pages service offers Jamstack hosting across their colossal global infrastructure. The free plan is now available to everyone and includes:

  • unlimited sites, requests, and bandwidth
  • SSL and security
  • robust content caching and expiry
  • web analytics
  • production and test deployments from GitHub branches
  • one build at a time with up to 500 builds per month, and
  • thorough documentation with getting started tutorials, deployment examples migration guides

The build platform supports languages including Node.js, Python, PHP, Ruby, Go, Java, Elixir, and Erlang. Most site builder software should work, but the following tools have verified compatibility:

  • Angular (Angular CLI)
  • Brunch
  • Docusaurus
  • Eleventy
  • Ember.js
  • Gatsby
  • GitBook
  • Gridsome
  • Hugo
  • Jekyll
  • Mkdocs
  • Next.js (static HTML export)
  • Nuxt.js
  • Pelican
  • React (create-react-app)
  • React Static
  • Slate
  • Svelte
  • Umi
  • Vue
  • VuePress

Continue reading How to Deploy Your Jamstack Site to Cloudflare Pages on SitePoint.

Peloton and Echelon profile photos exposed riders’ real-world locations
Facebook’s empty promise of hiding “Likes”

Related Articles

Adding Custom GitHub Badges to Your Repo

adding-custom-github-badges-to-your-repo
If you’ve spent time looking at open-source repos on GitHub, you’ve probably noticed that most of them use badges in their README files. Take the official React repository, for instance. There are GitHub badges…

Introducing PHP: A Beginner’s Guide

introducing-php-a-beginners-guide
The following article is an excerpt from PHP & MySQL: Novice to Ninja, 7th Edition, a hands-on guide to learning all the tools, principles, and techniques needed to build a…