Nano ASP.NET SaaS Boilerplate
Admin credentials (all tenants): admin@email.com / Password123!
Sample data resets every hour
Nano ASP.NET SaaS Boilerplate
General
.NET Solution
Vue UI
React UI
Razor Pages
React UI

Top Level

The React client is a single page application built using the modern JS framework, React. It is written in TypeScript and runs on Vite build tools.

Overview

It’s best to start with the Core Application guide, which covers the root App.tsx component, Router, API, and Stores. Pages, Layout & Components and Data Tables, Forms & Validation, are explained in more detail in their own guide.

The theme style is a project in itself. Styles are managed in /assets folder as Bootstrap 5 scss. The styling code is mostly the same in each UI version, but its covered from Vue’s perspective in the Vue Theme & Styling guide.

Top Level

A quick overview of the files and folders you see from the top:

  • Src – app source code
  • Index.html – this is where React will mount the application
  • .env.development & .env.production – these are environment variables for the Vite build tool uses, they contain a variable for the API URL
  • Vite.config.ts – this is the Vite configuration file.
  • Package.json – NPM manifest of all dependencies, contains two scripts, serve & build
  • tsconfig.json – TypeScript configuration
  • .gitignore – tells git source-control to ignore certain files and folders

Vite is a generic build tool that can be used for many types of projects, not just Vue projects; it requires a configuration file.

Vite is better than the CLIs that ship with React / Vue because it’s faster, more stable, and has some amazing features like being able to use scss styles directly.

Next Steps

Read the Core Application guide to get an understanding of how the app is built starting from the root component.