Category: Uncategorized
-
AWS Amplify
AWS Amplify is a service provided by Amazon Web Services (AWS) that offers a client library, a command-line toolchain, and an AWS Console for continuous deployment and static site hosting. With the Amplify CLI, Gatsby developers can provision full-stack implementations that account for in-app authentication, data storage, serverless GraphQL and REST APIs, web analytics, Lambda functions,…
-
Gatsby Cloud
Gatsby Cloud is a platform provided by Gatsby (the company), which was cofounded by Gatsby creator Kyle Mathews and Sam Bhagwat in 2019. Gatsby Cloud’s primary value proposition is the expertise of the Gatsby core team and tools catering directly to the Gatsby framework. As of this writing, Gatsby Cloud offers the following features: Quick Connect. Gatsby Cloud’s…
-
Vercel
Like Netlify, Vercel (formerly known as Zeit) offers a cloud platform for static sites like Gatsby sites and a trigger-based mechanism from Git providers to conduct continuous deployment. Vercel’s offerings include autoscaling, a global edge network, asset compression, cache invalidation, and a zero-configuration developer experience. Like Netlify, Vercel is most powerful when integrated directly with a…
-
Netlify
As of this writing, Netlify is one of the most popular solutions among Gatsby developers (including this author) seeking a convenient hosting platform for Gatsby sites. Netlify performs continuous deployments triggered by interactions with source control providers such as GitHub, GitLab, and Bitbucket, and it provides a slew of other features, including a global CDN, full…
-
Deploying to Hosting Services
Once you’ve configured your deployment, whether that means populating environment variables or customizing path and asset prefixes, it’s time to deploy your Gatsby site to an infrastructure provider. There are a variety of hosting solutions for Gatsby sites that run the gamut from static site hosting companies such as Netlify, Vercel, and Gatsby Cloud to broader hosting platforms that offer…
-
Asset Prefixes
The end result of a Gatsby build is a collection of HTML files representing the Gatsby site and assets such as images, videos, JavaScript files, and CSS files. Today, it’s common practice for Gatsby developers to deploy the Gatsby-generated static HTML to a domain root but to leverage a different domain, such as a CDN, for…
-
Path Prefixes
Sometimes, Gatsby developers need to implement sites that fit into an existing path system on a domain that houses other sites. For instance, you may have a Gatsby site that coexists with other Gatsby sites and needs to be under a particular path (say, example.com/gatsby-site). As a matter of fact, some hosting providers—notably GitHub Pages—obligate the use…
-
Using Path and Asset Prefixes
The vast majority of Gatsby sites are hosted at the root of their domain (e.g., example.com/), and their assets are usually located in some directory within that domain (e.g., example.com/img or example.com/css). However, there are certain scenarios in which Gatsby developers prefer to host their Gatsby sites at a different location than the domain root, as well as situations…
-
Using Environment Variables
It’s a best practice not to commit environment configuration files to source control providers unless there is absolute certainty no sensitive credentials are contained inside. Many Gatsby developers utilize local environment configuration files to manage that sensitive information outside of source control, while simultaneously providing environment variables to continuous deployment (CD) providers in the infrastructure provider’s…
-
Server-side environment variables
Unlike other implementations that leverage universal JavaScript, Gatsby performs all compilation at build time, which means that only those scripts executed during the build will provide environment variables on the server side. More specifically, Gatsby runs a few Node.js scripts in succession during the build-time compilation process, including the logic found in gatsby-config.js and gatsby-node.js. Because Node.js has access to…