Overview

The Azure Static Website React Template is a repository that provides a pre-configured setup for creating Azure Static Web App projects using React and TypeScript. It includes a Create React App site using TypeScript and an empty Azure Functions folder, also written in TypeScript. This template allows developers to quickly create a repository with the necessary setup to start working on a static website project with React on Azure.

Features

• React + TypeScript: The template includes a pre-configured setup for creating a static website using React and TypeScript, which allows for the use of static typing and enhances code maintainability.
• Azure Functions integration: The template provides an empty Azure Functions folder written in TypeScript, allowing developers to easily integrate serverless functionalities into their static website projects.
• Use this template button: By clicking the “Use this template” button in the repository, developers can create a new repository with the same project structure and configuration as the template, saving time on initial setup.

Installation

To install and run the Azure Static Website React Template, follow these steps:

1. Click on the “Use this template” button in the repository to create a new repository with the same project structure and configuration.
2. Clone the newly created repository to your local machine.
3. Open a terminal and navigate to the root folder of the repository.
4. Execute the following command to install the dependencies and start the web application server:

   npm start
   

5. Open another terminal and navigate to the api folder within the repository.
6. Execute the same command to start the API server:

   npm start
   

7. The web application will be accessible at http://localhost:3000, and the API server will be accessible at http://localhost:7071.

Alternatively, developers can use the VS Code launch configuration to run both the web application and the API server together with attached debuggers.

Summary

The Azure Static Website React Template is a useful resource for developers looking to create static website projects on Azure using React and TypeScript. With its pre-configured setup and integration with Azure Functions, developers can quickly start working on their projects without spending much time on initial configuration. By following the installation guide, developers can easily set up the template and start running the web application and API servers locally for testing and development purposes.