Was this article helpful?
Thanks for your feedback
Blazor is a feature of ASP.NET, a popular web development framework that extends the .NET developer platform with tools and libraries for building web apps.
This guide will help you create a starter marketing website using Blazor with minimal steps. It uses Contentstack .NET SDK to store and deliver the website content from Contentstack.
Note: For this tutorial, we have assumed that you are familiar with Contentstack and ASP.NET Blazor. If not, please refer to the Contentstack docs and ASP.Net Blazor for more details. Also, for Visual Studio installation, please follow this link for configuration setup.
Here is an overview of the steps involved in creating our .Net app:
To use the North American, European, or Azure North American endpoint, run the following command in your terminal (command prompt):
csdx config:set:region <<region>>
Note: - For North American users, set the region as NA.
- For European users, set the region as EU.
- For Azure North American users, set the region as AZURE-NA.
To import content to your stack, first, you must log in to your Contentstack account via CLI by running the following command in your terminal:
csdx auth:login
This command will ask you to provide your Contentstack’s account credentials (email and password).
The ‘seed’ command lets you import content to your stack in a few steps. To do so, run the following command in your terminal:
csdx cm:seed -r "contentstack/stack-starter-app"
This command will prompt the following options as follows:
Stack preference:
Next, you need to select your choice to create a new stack:
Tip: To avoid the chances of any error, we recommend that you select the option of creating a new destination stack. If you choose to import content to an existing stack, ensure that the stack is empty.
Finally, you’ll get the content imported to your stack.
A delivery token lets you fetch published content of an environment.
You can create a delivery token for the “development” environment for running the website on localhost. Later, while deploying your site, you can create tokens for other environments.
Navigate to the project folder in Visual Studio and create a configuration file named appsettings.json. Add the following code to the file, provide your credentials, and save the file.
Note: The below code is for North America region users only. Refer the configuration code for European region and Azure North American region on the regions configuration page.
{ "ContentstackOptions": { "Host": "cdn.contentstack.io", "ApiKey": "<API_KEY>", "DeliveryToken": "<DELIVERY_TOKEN>", "Environment": "<ENVIRONMENT_NAME>" } }
Note: Use ASP.NET version 5.0 or above for sample application.
That’s it! Now that we have a working project ready, you can build and run it.
You can view the website at the dynamically generated URL http://localhost:<port number>. And you also have the stack that has all the content and resources for the website. Try experimenting by creating new entries and publishing them in the “development” environment. You should be able to see the changes on the website at the localhost.
The easiest and quickest way to deploy a .NET starter website on production is to use Heroku. You need a Heroku account before you start deploying.
Perform the following set of steps to deploy your app:
First, you must have Docker set up locally to continue:
$ docker ps
Next, log in to the Container Registry:
$ heroku container:login
Build the Dockerfile in the current directory and push the Docker image.
$ heroku container:push -a <your_application_name> web
Release the newly pushed images to deploy your app.
$ heroku container:release -a <your_application_name> web
Was this article helpful?
Thanks for your feedback