Create react app with Fastly

Fastly is a growing company in the cloud computing industry. They provide services and APIs, such as CDN, edge computing and more. In this guide, we will share how to add Fastly to your React application. We will use create-react-app in this guide, but it should be working fine with a "regular" React application as well, as long as you build your code into the build folder in the root.

Prerequisites

We assume you have an account setup in Fastly already and installed the CLI etc. The account is needed in order to deploy, this is not mandatory though as you can run it locally as well.

If you have brew installed on your Mac, just use this simple command:

brew install fastly/tap/fastly

If you are using windows, download the Fastly prebuilt binary. Read more on installations here.

You should also have a React application setup. I will share some links on how to do so:

Setup an application from scratch

Setup using create-react-app

Setup

In your terminal, cd to your react project and run following command:

npx @fastly/compute-js-static-publish --preset=create-react-app

This will install all the necessary libraries to your project.

Run the project

First, in your project root, run:

npm run build

to build your project files.

Then, open up an additional terminal window, and cd into cd compute-js that is located in your project. And run:

fastly compute serve

Now, your project should be available at http://127.0.0.1:7676.

Deploy

To deploy it to your Fastly service, simply run:

fastly compute publish

And then it should be up and running on a service.

Summary

In this guide, we showed how to setup Fastly in your React application and how to run and deploy it using Fastly. I hope you found this guide helpful, and thanks for reading!

All the best,