Vitor Gomes
3 min readJan 30, 2023

--

How to deploy Sites using Blazor, Angular and React with a repository on GitHub to Cloudflare.

If you want to experiment or even create a laboratory there is a free option. It has limited features but for giving it a try it’s great.

First you are create and authentication on the Cloudflare, there is a menu Pages.

Next step you need to click on create a project.

Next you select how we’ll send our code to CloudFlare. Click connect to git.

When connecting to Git, all repositories linked to your account will be listed, just select the one you are interested in deployment. My first deploy is with Blazor as you can see below.

Next you will provide some information to perform the deploy with Blazor.

First Build Command

curl -sSL https://dot.net/v1/dotnet-install.sh > dotnet-install.sh; chmod +x dotnet-install.sh; ./dotnet-install.sh -c 6.0 -InstallDir ./dotnet6; ./dotnet6/dotnet — version; ./dotnet6/dotnet publish -c Release -o output;

Second Build output directory

/output/wwwroot

When saving will start the deploy process.

To deploy the React app, you just need to select the Framework Preset, It will automatically fill in the “Build Command” and “Build Output Directory”

When saving will start the deploy process.

To deploy the Angular app, you need to select the Framework Preset, It will automatically fill in the “Build Command” and “Build Output Directory”

In “Build Output Directory” probably you need to include the name of the application.

In my case, I had to add an environment variable with the Node Version.

NODE_VERSION -> v16.13

Cloudflare will generate the URL for you if you want to link it to your domain.

- Blazor
- React
- Angular

--

--