---
name: azion-deploy-the-react-boilerplate
description: >-
  Deploy a React single-page application to Azion from Azion Console, with a GitHub repository and a GitHub Action that deploys every push.
---

# Deploy the React Boilerplate

You can deploy a React single-page application (SPA) to Azion from Azion Console with the React Boilerplate template. The template creates a GitHub repository for your code. It deploys the project as an [application](/en/documentation/platform/applications/) that runs a [function](/en/documentation/platform/functions/) for custom logic. The boilerplate uses React `18.2.0`.

## Prerequisites

- A [GitHub account](https://github.com/signup). The template connects to it and creates the repository there.
- Access to Azion Console. To sign in, refer to [Access Azion Console](/en/documentation/guides/platform/account-and-billing/how-to-access-azion-console/).

---

## Deploy the template

The React Boilerplate deploys from a form in Azion Console, and the form marks each mandatory field with an asterisk. The application it creates uses Functions and [Cache](/en/documentation/platform/applications/how-it-works/#cache), which can generate usage-related costs. For the rates, refer to [Pricing](/en/documentation/fundamentals/pricing/).

Open the template's form in Azion Console:

[Deploy](https://console.azion.com/create/react/react-boilerplate)

To deploy the template from the form:

1. **Connect your GitHub account**

   A new window asks you to confirm the installation of the [Azion GitHub App](/en/documentation/guides/application-development/automation/azion-github-app/). The app connects your GitHub account to Azion's platform.

2. **Grant the app access**

   In that window, set the permissions and choose the repositories the Azion GitHub App can access.

3. **Select the Git scope**

   On the form, select the Git scope the template works with.

4. **Name the application**

   Enter a unique name for the application. The function and the storage bucket take the same name. A name already in use returns an error message.

5. **Start the deployment**

   Submit the form. A window shows the deployment logs while the deployment runs.

When the deployment finishes, the page shows the application's information and the options to continue. The deployment leaves you with:

- A GitHub repository created from the [React Boilerplate sample](https://github.com/aziontech/azion-samples/tree/dev/templates/react/reactjs-boilerplate), with its dependencies installed.
- A GitHub Action in that repository that deploys every push, so the application follows your code.
- A commit in the repository that records the deployed version and the deployment timestamp.
- An application on Azion Platform, with a function for custom logic and a domain that serves the React project.

The template builds the project with the [Azion Bundler framework adapter](/en/documentation/devtools/runtime/frameworks/frameworks-compatibility/). The application answers on a [workload](/en/documentation/platform/workloads/) domain in the format `xxxxxxxxxx.map.azionedge.net`. The configuration takes a few minutes to propagate across Azion's distributed infrastructure. Until then, the link can fail to show the page, so wait a few minutes and open it again.

---

## Open the application in Azion Console

Every setting the React Boilerplate configured stays editable after the deployment, on the application's page in Azion Console.

To open the application:

1. **Open the Applications page**

   Access [Azion Console](https://console.azion.com/) > **Applications**. The page lists every application in the account in alphabetical order.

2. **Search for the application**

   Enter the name you gave the application. The search filters the list by application name only.

3. **Select the application**

The application's page opens with the settings the template configured, and you can change any of them. For the fields of those settings, refer to [Main Settings](/en/documentation/platform/applications/main-settings/) and [Rules Engine for Applications](/en/documentation/platform/applications/rules-engine/).

---

## Next steps

- [Domains](/en/documentation/platform/workloads/domains.md): Add a custom domain so users reach the application on a domain you own.
- [Applications quickstart](/en/documentation/platform/applications/quickstart.md): Build an application by hand: a connector, a rule that uses it, and a workload that serves it.
- [Rules Engine for Applications](/en/documentation/platform/applications/rules-engine.md): Every criterion and behavior a rule on the application accepts.
- [Functions](/en/documentation/platform/functions.md): How Functions runs the function the template created for custom logic.