Deploy Your C# Blazor App To Vercel

Maximilian Leodolter — Mon, 17 Jun 2024 12:32:42 +0000

Vercel, known for its seamless deployment and scalability, is a popular choice among developers. While Vercel primarily supports JavaScript frameworks, it’s entirely possible to deploy C# applications too. Let's dive into how you can deploy your C# projects to Vercel, making your build fast and shipping faster.

Why Choose Vercel?

Vercel offers a robust platform for deploying applications with ease. Its features include:

Automated Deployments: Every push to your Git repository can automatically deploy your app.
Scalability: Vercel’s infrastructure scales your application effortlessly.
Global Edge Network: Your applications are served from the edge, ensuring low latency and fast load times.
Built-in CI/CD: Vercel integrates continuous integration and continuous deployment, streamlining your development workflow.

Prerequisites

Before we start, ensure you have the following:

A Vercel account
Node.js installed on your machine
.NET SDK installed
Git installed and configured

Check if .NET is installed correctly:

 dotnet --version

Thid command should output:

 8.0.XXX

Create a New C# Project

First, let's create a new C# Blazor project. Open your terminal and run the following commands:

dotnet new blazorwasm -o NameOfYourProject

This will create a new Blazor project in a directory named NameOfYourProject.
The directory contains by default an example project for you to play around.
To get into more details read this tutorial from the official microsoft website: https://dotnet.microsoft.com/en-us/learn/aspnet/blazor-tutorial/intro

To run the project locally navigate into the project folder:

cd NameOfYourProject

Use this command to start up the local development server:

dotnet watch

It even has hot reloading!

Build your Project for Deployment

To deploy your C# application to Vercel, you need to build it first on your machine.
Use this command to generate the output files.

dotnet publish -c Release

The output files will be located in this folder:

bin/Release/net8.0/publish/wwwroot

Please note that the exact path my vary a bit. Depending on your .NET version.

Initialize a Git Repository

Next, initialize a new Git repository and commit your code:

git init
git add .
git commit -m "Initial commit"

No push the code to your git repository.
First connect the github repo to your local repository:

git remote add origin https://github.comXXXXX
git push origin master

Deploy to Vercel

Now, it’s time to deploy your application to Vercel. Follow these steps:

Go to Vercel
Add New Project
Select the repository from your github account
Set custom Build & Development Settings
Override the Output Directory to: bin/Release/net8.0/publish/wwwroot

Thats it!
You should now see a preview of your deployed C# Blazor App.

If you want to publish changes follow these instructions:
1.

bash dotnet publish -c Release

2.

git add . && git commit -m "Your Commit Message"

3.

git push origin master

Vercel will take care of the rest and you should see the live changes in 1-2 minutes on your website.

Final Thoughts

Deploying C# applications to Vercel may seem unconventional given its JavaScript-centric nature. Vercel’s powerful platform allows you to build and ship your C# Blazor applications faster than ever.

By following the steps outlined above, you can harness the power of Vercel for your C# projects, ensuring smooth deployments and high performance. So, gear up, start building, and ship your applications faster with Vercel!

Checkout our services: https://onit.eu
we have more interesting articles on: https://www.onit.eu/blog

DEV Community: Maximilian Leodolter