riot.dotnet.ten 1.0.4

Riot.js 10.x and ASP.NET Core 10.x Web API Starter Template

This is an ASP.NET Core 10.x Web API backend with a Riot.js 10.x frontend SPA template.

• Uses Microsoft.AspNetCore.SpaProxy with Vite to support the Riot.js development server from the ASP.NET Core project.
• Uses ASP.NET Core minimal API endpoints for lightweight backend APIs.
• Uses FluentValidation for request/model validation.
• Uses Serilog for application logging.
• Supports hot module reloading, so CSS/JS changes are recompiled and updated in the browser for faster app development.

Requirements

• Visual Studio 2026 or later.
• .NET 10 SDK.
• Node.js >= 20.17.0.
• npm >= 10.8.2, normally bundled with Node.js.

Installation

• Open your favorite CLS (Command Line Shell).
• Navigate to your chosen installation folder.
• Enter the command to install the Riot.js/.NET 10 template on your local PC.

dotnet new install riot.dotnet.ten

• To create a new project based on the template, run:

dotnet new riot-dotnet10 -n Demo

Running the demo project

Visual Studio

• Open the demo project in Visual Studio.
• Click the green run button.
• Assuming all requirements are met, Visual Studio will:
  1. Build the ASP.NET Core app.
  2. Run npm install for the SPA.
  3. Start the application.
  4. Launch the Vite development server through SPA proxy on port 8080.
  5. Open the app in the default browser at http://localhost:5000.

Command Line

cd src
dotnet run

The SPA will be served with hot module reloading via the SPA proxy.

Project Structure

src/
  ClientApp/               # Riot.js frontend SPA
    app/                   # Riot.js components
    assets/                # Images, fonts, etc.
    public/                # Static files (generated by Vite build)
    index.html             # SPA entry point
    vite.config.js         # Vite build configuration
    package.json           # Node.js dependencies
  Endpoints/               # API endpoints
  Model/                   # Data models
  Validators/              # FluentValidation validators
  Program.cs               # ASP.NET Core entry point
  Templating.RiotSPA.csproj
README.md                  # This file

Environment Configuration

The application reads settings from appsettings.json and appsettings.{ASPNETCORE_ENVIRONMENT}.json.

Default ports:

• Development: Backend on http://localhost:5000, Vite dev server on http://localhost:8080

Troubleshooting

• Delete src/ClientApp/package-lock.json and the src/ClientApp/node_modules folder, then run npm install again from the src/ClientApp folder.

• Confirm the installed .NET SDK with:

  dotnet --list-sdks
  

• Confirm Node.js and npm versions with:

  node --version
  npm --version
  

Additional Resources

• Riot.js Documentation
• ASP.NET Core Documentation
• Vite Documentation