Static Web App

This project was created to help represent a fundamental app written with React. The Shop at Home theme is used throughout the app. View it live at https://www.shopathome.dev.

Learn how

Learn how to Publish an Angular, React, Svelte, or Vue JavaScript app and API with Azure Static Web Apps

Install and Setup

1. Create a repository from this template repository https://github.com/johnpapa/shopathome/generate

2. Enter the name of your new repository as my-static-web-app

3. Clone your new repository

   git clone https://github.com/your-github-organization/my-static-web-app
   cd my-static-web-app/react-app

4. Install the npm packages

   npm install

Getting Started - Running with Static Web Apps and Serverless Functions API

1. Run the app

   npm run start-react-func-swa

Getting Started - Running with Static Web Apps and Fastify API

1. Run the app

   npm run start-react-fastify-swa

Authentication / Authorization

The app does not require authentication to launch or see the default page. However to view the products or discounts, the user must be authenticated using one of the options. These options are defined in the /public/staticwebapp.config.json file.

Endpoint	Roles
/api/*	no auth
/api/products/*	authenticated users
/api/discounts/*	authenticated users with the preferred role

Resources

Azure Static Web Apps

• Learn how to Publish an Angular, React, Svelte, or Vue JavaScript app and API with Azure Static Web Apps
• API support in Azure Static Web Apps
• Add an API to Azure Static Web Apps
• Authentication and authorization
• Routes
• Review pre-production environments
• Azure Free Trial