Products
Low-code/No-code
(Private alpha)
Boilerplate
Feature-rich .NET project template
Butil
Blazor utils for browser APIs
Bswup
Blazor PWA on steroids
Besql
Blazor Entity Framework Sqlite
BlazorUI
Native Blazor UI components
bit Academy
Coming soon
Pricing About us Contact us

Project Run Guidelines



The process for running the project varies based on the Api parameter set during project initiation:
  • --api Integrated: Simply run the Server.Web project (Running Server.Api is optional but not required).
  • --api Standalone: Run both the Server.Api and Server.Web projects.

Login Credentials
Upon project run, please use the following credentials to sign in:

Development Environment
The project is configured to use Blazor Server as the default mode to enhance the development experience, enabling features such as Visual Studio .NET Hot Reload and dotnet watch. To utilize the Hot Reload feature, ensure that you have the latest versions of Visual Studio, the .NET SDK, Web Compiler 2022+ for Visual Studio, and Live Sass Compiler for VS Code installed. This setup allows for automatic application of changes made to .razor, .scss, or .cs files without the need to rebuild the project. If any changes to these files do not take effect without a rebuild, please feel free to create an issue here.

Blazor Mode Selection
To choose between Blazor modes, refer to the Client.Core/Services/AppRenderMode.cs file. By default, for development it is Blazor Server and for Production it is Blazor Auto.
Blazor Auto is selected for production to optimize the user experience. On the first visit, the website will load quickly in Blazor Server mode, while Blazor WebAssembly files are downloaded in the background. Subsequent visits will utilize Blazor WebAssembly, enhancing performance. 
public static IComponentRenderMode? Current =>
    AppEnvironment.IsDev()
    ? BlazorServer // For better development experience.
    : BlazorAuto;  // For better production experience.
Debugging in Blazor WebAssembly
To debug the project in Blazor WebAssembly mode, change the Current value to BlazorWebAssembly for development. To fully utilize debugging features, set the Launch profile to Server.Web-BlazorWebAssembly.

Running in Blazor WebAssembly Standalone Mode
To run the project in Blazor WebAssembly Standalone mode, run Client.Web in addition to server project.

Visual Studio / Visual Studio Code Additional Launch Options
The project also supports additional launch profiles, including Docker, IIS Express, and WSL. These options provide flexibility for developers to test the project according to their specific requirements.

Although the Docker option is available in Visual Studio, we recommend using it in Visual Studio Code. This is because, in Visual Studio, selecting Docker as the launch profile causes code changes to take a significant amount of time to apply. In contrast, Visual Studio Code offers a more efficient workflow.

By clicking on Open a Remote Window and selecting Reopen in Container from the dropdown, you can run the project in Docker in the background. This approach allows Visual Studio Code to operate within Docker, along with all its extensions and SDKs, leading to a much faster development experience.

Connecting Client to Server
To connect the client to the server, set the ServerAddress inside Client.Core/appsettings.json to the appropriate IP address. The default value does not need to be changed for Web, Windows app, or Android Emulator.

For iOS and Android devices, there are two solutions:
  1. Same Network Connection: Ensure that your Android/iOS device and PC are on the same network, and make sure the firewall does not interfere. A sample configuration would look like this: "ServerAddress": "http://192.168.1.17:5030/"
  2. Dev Tunnels: Alternatively, you can use dev tunnels. Below is a sample value for dev tunnels:
    "ServerAddress": "https://r3c136gg-5030.euw.devtunnels.ms"
    For additional details about dev tunnels, please refer to the following video and docs.



Run Windows Apps
To run the project on the Windows platform, either set Client.Maui or Client.Windows as the startup project. If you need to access the Developer Tools, simply use Ctrl + Shift + I on the opened windows application.

Android, iOS Browser Dev Tools
Opening Browser Dev Tools for Android and iOS can be somewhat complex. For more detailed instructions applicable to macOS, which also apply to Windows and Linux, please refer to the following video:


You can use the same techinque to inspect web apps running inside Android/iOS devices and simulators.

Run MAUI in VS Code for iOS, Android and macOS
To run MAUI in VS Code for iOS, Android and macOS, assuming all the requirements are installed based on our documentation, see the following video:


Next in order to run on an Android Device follow the instructions in this video:


And in order to run on an iOS device see this video:



Run MAUI in Visual Studio for iOS, Android
Running your project on Android, Windows, and Web using Visual Studio is straightforward. However, testing a macOS version with Visual Studio isn't possible. For iOS, if you have a Mac connected to the same network as your Windows PC, you can follow this documentation to connect your Visual Studio to the mac device and run the iOS project using Visual Studio while coding on Windows.

If you don't have a Mac but do have an Apple Developer Account and an iOS device, you can follow the guide below to test the iOS version on Windows and Visual Studio without needing a Mac. Set the MAUI project as the startup project.



Create project