{"id":29644985,"url":"https://github.com/deans-bradley/blazor-wasm-template","last_synced_at":"2026-05-10T02:02:48.553Z","repository":{"id":305692910,"uuid":"1023533877","full_name":"deans-bradley/blazor-wasm-template","owner":"deans-bradley","description":"A comprehensive full-stack template for Blazor WebAssembly applications built with .NET 9, featuring a clean waterfall architecture and modern UI components.","archived":false,"fork":false,"pushed_at":"2025-07-21T13:04:33.000Z","size":29,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-21T15:18:41.878Z","etag":null,"topics":["blazor","blazor-webassembly","csharp","dotnet","fastendpoints","mudblazor","template"],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/deans-bradley.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-21T09:57:00.000Z","updated_at":"2025-07-21T13:04:36.000Z","dependencies_parsed_at":"2025-07-21T15:18:50.312Z","dependency_job_id":"3acf8e76-10ff-42da-ae5a-807335be6038","html_url":"https://github.com/deans-bradley/blazor-wasm-template","commit_stats":null,"previous_names":["deans-bradley/blazor-wasm-template"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/deans-bradley/blazor-wasm-template","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deans-bradley%2Fblazor-wasm-template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deans-bradley%2Fblazor-wasm-template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deans-bradley%2Fblazor-wasm-template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deans-bradley%2Fblazor-wasm-template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/deans-bradley","download_url":"https://codeload.github.com/deans-bradley/blazor-wasm-template/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deans-bradley%2Fblazor-wasm-template/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266405500,"owners_count":23923558,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-21T11:47:31.412Z","response_time":64,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["blazor","blazor-webassembly","csharp","dotnet","fastendpoints","mudblazor","template"],"created_at":"2025-07-22T01:08:06.846Z","updated_at":"2026-05-10T02:02:48.536Z","avatar_url":"https://github.com/deans-bradley.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Blazor WASM Template\n\nA comprehensive full-stack template for Blazor WebAssembly applications built with .NET 10 (preview), featuring a clean waterfall architecture and modern UI components.\n\n## Features\n\n- **Modern Stack**: Built on .NET 10 (preview) with the latest Blazor WebAssembly\n- **Clean Architecture**: Implements waterfall architecture with clear separation of concerns\n- **MVVM Pattern**: Client-side MVVM design pattern with dependency injection\n- **Rich UI**: Pre-configured with [MudBlazor](https://mudblazor.com/) for beautiful, responsive components\n- **Fast APIs**: Powered by [FastEndpoints](https://fast-endpoints.com/) for high-performance API development\n- **Local Storage**: Integrated [Blazored LocalStorage](https://github.com/Blazored/LocalStorage) for client-side data persistence\n- **Ready to Use**: Comes pre-configured and ready for development\n\n## Project Structure\n\n```\nblazor-wasm-template/\n├── .github/                # GitHub Actions workflows\n│   └── workflows/\n│       └── deploy.yaml     # Automated deployment workflow\n├── .vscode/                # VS Code configuration\n│   ├── launch.json         # Debug configurations\n│   ├── settings.json       # Workspace settings\n│   └── tasks.json          # Build and run tasks\n├── src/                    # Source code directory\n│   ├── API/                # Web API layer with FastEndpoints\n│   ├── BlazorApp.Client/   # Blazor WebAssembly client application\n│   ├── BlazorApp.Shared/   # Shared contracts and DTOs\n│   ├── BlazorApp.Utils/    # Shared business logic utilities\n│   ├── BLL/                # Business Logic Layer\n│   ├── DAL/                # Data Access Layer\n│   └── Models/             # Domain models and entities\n└── BlazorApp.sln           # Solution file (located in src/)\n```\n\n## Architecture Overview\n\nThis template implements a waterfall architecture pattern with clear separation of concerns:\n\n- **API Layer**: Handles HTTP requests and routing using FastEndpoints\n- **BLL (Business Logic Layer)**: Contains business rules and application logic\n- **DAL (Data Access Layer)**: Manages data persistence and retrieval\n- **Client Layer**: Blazor WebAssembly frontend with MudBlazor components using MVVM pattern\n- **Shared Layer**: Common contracts, DTOs, and utilities used across layers\n- **Utils Layer**: Cross-cutting concerns and shared utilities\n- **CI/CD**: Automated deployment via GitHub Actions and Azure Pipelines\n- **Development**: Enhanced VS Code integration with pre-configured tasks and debugging\n\n## Data Flow Architecture\n\nThe application follows a structured data flow pattern that ensures clean separation of concerns and maintainable code:\n\n### Client-Side Flow (MVVM with DI)\n\nThe client uses the **Model-View-ViewModel (MVVM)** pattern with dependency injection for clean architecture:\n\n**1. View (Blazor Component) → ViewModel**\n```razor\n@page \"/weather\"\n@inject IWeatherViewModel viewModel\n\n\u003cMudButton OnClick=\"LoadWeather\"\u003eGet Today's Weather\u003c/MudButton\u003e\n\n@code {\n    private async Task LoadWeather()\n    {\n        TodaysWeatherResponse weatherResponse = await viewModel.GetTodaysWeather();\n        // Handle response...\n    }\n}\n```\n\n**2. ViewModel → HTTP Service**\n```csharp\npublic class WeatherViewModel(IHttpService httpService) : IWeatherViewModel\n{\n    private readonly IHttpService _httpService = httpService;\n\n    public async Task\u003cTodaysWeatherResponse\u003e GetTodaysWeather()\n    {\n        TodaysWeatherResponse response = await _httpService.Get\u003cTodaysWeatherResponse\u003e(\"/weather/today\");\n        return response;\n    }\n}\n```\n\n### Server-Side Flow (API → BLL → DAL)\n\n**3. API Endpoint → Business Logic Layer**\n```csharp\npublic class GetTodaysWeather(IWeatherService weatherService) : EndpointWithoutRequest\u003cTodaysWeatherResponse\u003e\n{\n    private readonly IWeatherService _weatherService = weatherService;\n\n    public override void Configure()\n    {\n        Get(\"/weather/today\");\n        AllowAnonymous();\n    }\n\n    public override async Task HandleAsync(CancellationToken ct)\n    {\n        TodaysWeatherResponse response = await _weatherService.GetTodaysWeather();\n        await SendAsync(response, cancellation: ct);\n    }\n}\n```\n\n**4. Business Logic Layer → Data Access Layer**\n```csharp\npublic class WeatherService(IWeatherRepository weatherRepository) : IWeatherService\n{\n    private readonly IWeatherRepository _weatherRepository = weatherRepository;\n\n    public async Task\u003cTodaysWeatherResponse\u003e GetTodaysWeather()\n    {\n        WeatherData weatherData = await _weatherRepository.GetCurrentWeatherAsync();\n        \n        // Apply business logic, transformations, validations\n        return new TodaysWeatherResponse\n        {\n            Temperature = weatherData.Temperature,\n            Description = weatherData.Description,\n            // ... other mappings\n        };\n    }\n}\n```\n\n**5. Data Access Layer → Database/External APIs**\n```csharp\npublic class WeatherRepository : IWeatherRepository\n{\n    public async Task\u003cWeatherData\u003e GetCurrentWeatherAsync()\n    {\n        // Fetch from database, external API, or other data source\n        // Return raw data model\n    }\n}\n```\n\n### Complete Request Flow\n\n```mermaid\ngraph TD\n    A[Blazor Component] --\u003e B[ViewModel]\n    B --\u003e C[HTTP Service]\n    C --\u003e D[API Endpoint]\n    D --\u003e E[Business Service]\n    E --\u003e F[Repository/DAL]\n    F --\u003e G[Database/External API]\n    \n    G --\u003e F\n    F --\u003e E\n    E --\u003e D\n    D --\u003e C\n    C --\u003e B\n    B --\u003e A\n```\n\n**Flow Summary:**\n1. **View** triggers an action and calls the **ViewModel**\n2. **ViewModel** uses **IHttpService** to make HTTP requests to the API\n3. **API Endpoint** receives the request and delegates to the **Business Logic Layer**\n4. **BLL Service** applies business rules and calls the **Data Access Layer**\n5. **DAL Repository** retrieves/persists data from the database or external services\n6. Response flows back up the chain: DAL → BLL → API → Client → ViewModel → View\n\nThis architecture ensures:\n- **Single Responsibility**: Each layer has a clear purpose\n- **Dependency Inversion**: Higher layers depend on abstractions, not implementations\n- **Testability**: Each layer can be unit tested independently\n- **Maintainability**: Changes in one layer don't cascade to others\n- **Scalability**: Easy to extend and modify individual components\n\n## Getting Started\n\n### Prerequisites\n\n- [.NET 10 SDK (preview)](https://dotnet.microsoft.com/en-us/download/dotnet/10.0) installed on your machine\n- **Visual Studio Code** with C# Dev Kit extension, or **Visual Studio 2026 (Insiders)**\n  \n\u003e **Note**: This project requires .NET 10 preview and is only supported in VS Code or Visual Studio 2026 (Insiders). Earlier versions of Visual Studio are not supported.\n\n### Installation\n\n1. **Clone the repository**\n   ```bash\n   git clone https://github.com/deans-bradley/blazor-wasm-template.git\n   cd blazor-wasm-template\n   ```\n\n2. **Restore dependencies**\n   ```bash\n   dotnet restore src/\n   ```\n\n3. **Build the solution**\n   ```bash\n   dotnet build src/\n   ```\n\n### Running the Application\n\nThe API and client run simultaneously - no need to start them separately.\n\n#### Using Visual Studio 2026 (Insiders)\n- Press `F5` to start debugging, or\n- Use `Ctrl` + `F5` to run without debugging\n\n#### Using VS Code\nThe project includes pre-configured VS Code tasks for easy development:\n\n**Tasks**\n- **Build API**: Builds the API project\n- **App (Dev)**: Builds and runs the app in `Development`, launches the app in the browser \n\n- In the **Run and Debug** panel, select **App (Dev)** in the dropdown.\n- Press `F5`** to start debugging (uses the configured launch profile).\n\n#### Using Command Line\n```bash\n# From the root directory\ndotnet run --project src/API\n```\n\nOnce running, navigate to `https://localhost:{port}` in your browser (the exact port will be displayed in the console).\n\n## Deployment\n\nThis template includes automated deployment via GitHub Actions:\n\n### GitHub Actions Workflow\n\nThe project includes a `deploy.yaml` workflow in `.github/workflows/` that provides:\n\n- **Automated CI/CD**: Builds and deploys your application on code changes\n- **Multi-environment support**: Configure different deployment targets\n- **Dependency caching**: Faster build times with NuGet package caching\n- **Security**: Uses GitHub secrets for secure deployment credentials\n\nTo set up deployment:\n\n1. Configure your deployment target (Azure, AWS, etc.) in the `deploy.yaml` file\n2. Add required secrets to your GitHub repository settings\n3. Push changes to trigger automatic deployment\n\n\u003e **Note**: Review and customize the deployment workflow according to your hosting requirements.\n\n## Recommended VS Code Extensions\n\nFor the best development experience, install these extensions:\n- **C# Dev Kit** - Essential C# support and debugging\n- **C#** - Language support for C#\n\n## Customization\n\n### Updating Template Name\n\nTo customize the template for your project:\n\n1. Use your IDE's \"Find and Replace in Files\" feature\n2. Search for `BlazorApp` throughout the entire solution\n3. Replace with your desired project name\n4. Update namespaces and assembly names accordingly\n\n**Tip**: Make sure to update folder names, project files (.csproj), and namespace declarations.\n\n## Contributing\n\nI am open to contributions. Please follow these steps:\n\n1. **Fork the repository**\n2. **Create a feature branch**\n   ```bash\n   git checkout -b feature/your-feature-name\n   ```\n3. **Make your changes and commit**\n   ```bash\n   git commit -m 'Add: your feature description'\n   ```\n4. **Push to your branch**\n   ```bash\n   git push origin feature/your-feature-name\n   ```\n5. **Open a Pull Request**\n\nPlease ensure your code follows the existing patterns and includes appropriate tests where applicable.\n\n## Technologies Used\n\n- [**Blazor WebAssembly**](https://dotnet.microsoft.com/en-us/apps/aspnet/web-apps/blazor) - Client-side web UI framework\n- [**FastEndpoints**](https://fast-endpoints.com/) - High-performance API framework\n- [**MudBlazor**](https://mudblazor.com/) - Material Design component library\n- [**Blazored LocalStorage**](https://github.com/Blazored/LocalStorage) - Browser local storage wrapper\n- **.NET 10 (preview)** - Latest .NET framework preview\n\n## License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n## Acknowledgments\n\nSpecial thanks to the creators and maintainers of these excellent frameworks and libraries that make this template possible.\n\n## Changelog\n\n### Version 1.1.0\n- Update project to .NET 10 (preview)\n- Update all project dependencies to latest versions\n- Add automated deployment with GitHub Actions (`deploy.yaml`)\n- Add comprehensive VS Code configuration (`.vscode/` directory)\n  - `launch.json`: Debug configurations for API and client\n  - `tasks.json`: Build and run tasks for streamlined development\n  - `settings.json`: Optimized workspace settings for .NET development\n- Reorganize project structure: move source code to `src/` directory\n- Enhanced development workflow with pre-configured debugging and build tasks\n\n### Version 1.0.1\n- Update README with corrections and add acknowledgment message\n\n### Version 1.0.0\n- Initial release with core functionality\n- API project with fastendpoints\n- Blazor WASM client project with MudBlazor\n- DAL, BLL, Models, Utils, and Shared libraries","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdeans-bradley%2Fblazor-wasm-template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdeans-bradley%2Fblazor-wasm-template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdeans-bradley%2Fblazor-wasm-template/lists"}