This is a great video for devs not running Windows (no Visual Studio) who must create and share a Web API endpoint with other apps (such as mobile/desktop). Doing it this way also helps devs learn all the moving pieces in Blazor and Web API. Otherwise, you are creating an unnecessary web endpoint to deploy/secure and will miss out on the great built-in tools included with Visual Studio. I think implementing Web API for just one consumer website on the same web server is like driving a car across the street to Starbucks to get a cup of coffee. Thank you for the video, Gavin.
Thank you for your feedback. :) I wanted to keep the code simple and teach the relevant basic concepts rather than potentially muddy the waters (as it were) by include architectural concerns. I will include architectural related concepts in up coming videos.
I ve been learning C# for some time now, using your videos, and I just wanted to say thank you for unbeliavable content, your's channel is a sacred place for me because I m aiming to become a .NET backend developer, keep them coming, wish you best!
Thank you so much for your very positive message! It is greatly appreciated! I'm so glad that you feel you are benefiting from the videos on this channel. I think it is a wise choice to become a backend .NET developer - good backend .NET developers are always in huge demand! More content like this is coming soon :)
I am glad to see this tutorial: Had been trying to code Blazor on Linux for ages, and couldn't find anywhere to show how to reference another project. That said, even if I follow 1:1 the steps, I can't include MovieWeb, it just won't see it. I ended giving up and going back to my trusty ANSI C
I'm sorry to see that you are having trouble getting this .Net project to play nicely on Linux. I would like to do a video on .NET and Linux at some point in the future.
Great video Gavin, do you know if it is possible or will it be possible to integrate the api within the main app project? Something similar to the current ASPNET core hosted solution that we have currently available.
Hi :) You can, within the main web app project, include server side code (that for e.g. includes database related functionality). So you could simply create a service class within the main web app project that encapsulates database related functionality (within that service class you could leverage for e.g. custom repository classes - within the blazor web app project). You could also include calls to the web api compoment from within server side code included within the main web app project code. I wanted to demonstrate specifically how to integrate a web assembly component that calls a web api component within a blazor web app project. You could have just created Blazor server components and written your server side code directly within the blazor web app project. So how you design your blazor project architecturally depends on your specific requirement, however, the point of videos like this is to show howBlazor on .NET 8 gives you the flexibility to leverage various architectural designs for your components and server side code.
That's a great question :) There are pros and cons that come with using either Visual Studio Code or Visual Studio 2022. Visual Studio Code is cross platform and light weight. So the installation is light and you don't have to install all the features that come with Visual Studio 2022 to develop sophisticated .NET applications. You can create sophisticated applications using Visual Studio Code. With the C# Dev Kit extension installed - Visual Studio Code becomes a pretty powerful IDE where you can for e.g. perform sophisticated debugging operations. Visual Studio 2022 is arguably easier to use in many ways for example installing NuGet packages. It comes with a lot of sophisticated features right out of the box. I think Visual Studio Code is less convenient in many ways but once you get used to using it, it is a great tool! I could write an entire article on this subject but I hope this gives you at least a basic insight on the pros and cons of using either of these great software development tools for developing .NET applications. :) Many developers prefer to use Visual Studio Code over Visual Studio 2022. I'm happy using either of these great tools :)
I appreciate the use of VS Code in this instance because I could not get it to run on Windows because of .NET version conflicts. So I created an Ubuntu VM from scratch and loaded VS Code and .NET 8 and was able to get most of it to run well. The only problem is that I am missing the sidebar navigation and the Counter doesn't work. But at least I have a place to start debugging.
@@GavinLon I'm sure you know, but for the people watching, when working with preview versions and you want to add nuget via the cli you can include "--prerelease" instead of version to simplify it, though i only think it works when using the most up to date preview.
Hi! That is a great question. The emphasis in this tutorial is Web Assembly and Web API. In a real world application, depending on your requirement, you may wish to mix your render modes differently in order to optimally address the requirements of your particular application. I'll create a tutorial specifically mixing render modes for a Blazor app that runs on .NET 8 in a future video :)
@Vsd13 - I have just tested loading the code in Visual Studio 2022 and all worked as expected. I don't get the error that you are getting. Please make sure that you have installed the latest rc version of the .NET 8 SDK which is rc.2. Also please make sure that you have installed the latest preview release of Visual Studio 2022. All should then work correctly. :) Bear in mind that we are working with preview releases at the moment so these are not the final official releases so there may be a few fiddly issues to get around at the moment.
@@GavinLonIn this case, the application is launched via dotnet run, without any problems, but does not start using the buttons run in the interface Visual Studio. In VS code, also runs via terminal
@@GavinLon Thank you very much for your help, as it turns out I just didn't pay attention to the Visual Studio version, a pre-release version was required 😂
@@Vsd13 No problem - I'm sure most devs will be able to relate to issues like that. We all encounter them at times :) Glad you're up and running with Visual Studio :)
Thanks for your feedback. I prefer to use Visual Studio than Visual Studio Code for C# and .Net applications but I think it is also important to know how to use Visual Studio Code - great for cross-platform development!
I'm not aware of a particular bug of this nature. I'm sorry, It's hard for me to troubleshoot as I don't know your environment and can't see your code. All I can advise is that you have the latest preview version of .NET 8 installed.
@@GavinLon I am running the latest version of preview RC2. Here is the test Code. @page "/hs2022" @attribute [RenderModeInteractiveAuto] @implements IDisposable @inject HttpClient _Http HS20A This component demonstrates showing data. @if (Tariffs == null) { Loading... } else {
id text parent
@foreach (var TarVal in Tariffs) { foreach (var Item in TarVal.results) {
} void IDisposable.Dispose() { // persistingSubscription.Dispose(); } } public class ClrHS2022 { public bool more { get; set; } public int minimumInputLength { get; set; } public string? classCode { get; set; } public string? className { get; set; } public Result[]? results { get; set; } } public class Result { public string? id { get; set; } public string? text { get; set; } public string? parent { get; set; } }
I believe that you created a Blazor Server project not a Blazor Web app project, because if what you claimed was correct, then you will get the Blazor WASM project without the need of creating it then making a reference.
Hi. I created a project based on the Blazor Web App project template, a new project template made available with .NET 8. Prior to .NET 8, you would create either a Blazor Server project or a Blazor WASM project. Now with .NET 8 you can use the Blazor Web App project template and integrate, Blazor server components, Blazor WASM components, with the new features available in .NET 8 like SSR and streaming rendering, and using the new Blazor Web App project template means you can integrate all of these features into one project. At the time of creating this video, in order to integrate a Blazor WASM component into a project based on the Blazor Web App project template, you needed to create a separate Blazor WASM project and then reference the Blazor WASM project from within the main project (based on the Blazor Web App project template).
@@GavinLon You're right, I am new to .Net 8 and was not aware that the Web App template didn't include WASM project during the time of creating this video. Thanks for the explanation!
I get the "warn: Microsoft.AspNetCore.HttpsPolicy.HttpsRedirectionMiddleware[3] Failed to determine the https port for redirect." problem when using dotnet run? How do I fix this?
The answers here look pretty good. See if any of these work. Further down the page you'll see an answer by yehonatan yehezkel - that might be your solution. I hope this helps :) learn.microsoft.com/en-us/answers/questions/1297509/how-to-fix-this-error-warn-microsoft-aspnetcore-ht
This is a great video for devs not running Windows (no Visual Studio) who must create and share a Web API endpoint with other apps (such as mobile/desktop).
Doing it this way also helps devs learn all the moving pieces in Blazor and Web API.
Otherwise, you are creating an unnecessary web endpoint to deploy/secure and will miss out on the great built-in tools included with Visual Studio.
I think implementing Web API for just one consumer website on the same web server is like driving a car across the street to Starbucks to get a cup of coffee.
Thank you for the video, Gavin.
Thank you for your feedback. :) I wanted to keep the code simple and teach the relevant basic concepts rather than potentially muddy the waters (as it were) by include architectural concerns. I will include architectural related concepts in up coming videos.
I ve been learning C# for some time now, using your videos, and I just wanted to say thank you for unbeliavable content, your's channel is a sacred place for me because I m aiming to become a .NET backend developer, keep them coming, wish you best!
Thank you so much for your very positive message! It is greatly appreciated! I'm so glad that you feel you are benefiting from the videos on this channel. I think it is a wise choice to become a backend .NET developer - good backend .NET developers are always in huge demand! More content like this is coming soon :)
I am glad to see this tutorial: Had been trying to code Blazor on Linux for ages, and couldn't find anywhere to show how to reference another project. That said, even if I follow 1:1 the steps, I can't include MovieWeb, it just won't see it. I ended giving up and going back to my trusty ANSI C
I'm sorry to see that you are having trouble getting this .Net project to play nicely on Linux. I would like to do a video on .NET and Linux at some point in the future.
great work on a hot topic. but i have waited for new render modes on air.
Great video Gavin, do you know if it is possible or will it be possible to integrate the api within the main app project? Something similar to the current ASPNET core hosted solution that we have currently available.
Hi :) You can, within the main web app project, include server side code (that for e.g. includes database related functionality). So you could simply create a service class within the main web app project that encapsulates database related functionality (within that service class you could leverage for e.g. custom repository classes - within the blazor web app project). You could also include calls to the web api compoment from within server side code included within the main web app project code. I wanted to demonstrate specifically how to integrate a web assembly component that calls a web api component within a blazor web app project. You could have just created Blazor server components and written your server side code directly within the blazor web app project. So how you design your blazor project architecturally depends on your specific requirement, however, the point of videos like this is to show howBlazor on .NET 8 gives you the flexibility to leverage various architectural designs for your components and server side code.
I would like to know how to make vs code run both projects at once for debugging purposes.
Just asking, why use Visual Studio Code and not Visual Studio 2022? Just asking, .
That's a great question :) There are pros and cons that come with using either Visual Studio Code or Visual Studio 2022. Visual Studio Code is cross platform and light weight. So the installation is light and you don't have to install all the features that come with Visual Studio 2022 to develop sophisticated .NET applications. You can create sophisticated applications using Visual Studio Code. With the C# Dev Kit extension installed - Visual Studio Code becomes a pretty powerful IDE where you can for e.g. perform sophisticated debugging operations. Visual Studio 2022 is arguably easier to use in many ways for example installing NuGet packages. It comes with a lot of sophisticated features right out of the box. I think Visual Studio Code is less convenient in many ways but once you get used to using it, it is a great tool! I could write an entire article on this subject but I hope this gives you at least a basic insight on the pros and cons of using either of these great software development tools for developing .NET applications. :) Many developers prefer to use Visual Studio Code over Visual Studio 2022. I'm happy using either of these great tools :)
The loading time is enough for me to not use it. It's not a lot I know
@@GavinLonCan you make a video on how to configure VS Code in order to replace most of the Visual Studio 2022 basic functionalities?
@mgame8082 I think that is a great suggestion for a video topic - I think many developers may appreciate a video like that :)
I appreciate the use of VS Code in this instance because I could not get it to run on Windows because of .NET version conflicts. So I created an Ubuntu VM from scratch and loaded VS Code and .NET 8 and was able to get most of it to run well. The only problem is that I am missing the sidebar navigation and the Counter doesn't work. But at least I have a place to start debugging.
Great stuff as always!
Thank you! :)
@@GavinLon I'm sure you know, but for the people watching, when working with preview versions and you want to add nuget via the cli you can include "--prerelease" instead of version to simplify it, though i only think it works when using the most up to date preview.
@@anthonyliljegren1664 Thanks for your comment., That is useful information for everyone who reads your comment. :)
Is this necessary even with the released version of .net 8?
Hi! That is a great question. The emphasis in this tutorial is Web Assembly and Web API. In a real world application, depending on your requirement, you may wish to mix your render modes differently in order to optimally address the requirements of your particular application. I'll create a tutorial specifically mixing render modes for a Blazor app that runs on .NET 8 in a future video :)
I use visual studio and when I run the program, an error appears that says that the file is missing .csproj. This only happens on the version Net 8
@Vsd13 - I have just tested loading the code in Visual Studio 2022 and all worked as expected. I don't get the error that you are getting. Please make sure that you have installed the latest rc version of the .NET 8 SDK which is rc.2. Also please make sure that you have installed the latest preview release of Visual Studio 2022. All should then work correctly. :) Bear in mind that we are working with preview releases at the moment so these are not the final official releases so there may be a few fiddly issues to get around at the moment.
@@GavinLonIn this case, the application is launched via dotnet run, without any problems, but does not start using the buttons run in the interface Visual Studio. In VS code, also runs via terminal
@Vsd13 - Please also ensure that in Visual Studio - you set the startup project to MovieWeb - Thanks :)
@@GavinLon Thank you very much for your help, as it turns out I just didn't pay attention to the Visual Studio version, a pre-release version was required 😂
@@Vsd13 No problem - I'm sure most devs will be able to relate to issues like that. We all encounter them at times :) Glad you're up and running with Visual Studio :)
Thanks, but i think visual studio will be good for us than visual sfudio code jt meeds much code
Thanks for your feedback. I prefer to use Visual Studio than Visual Studio Code for C# and .Net applications but I think it is also important to know how to use Visual Studio Code - great for cross-platform development!
I have an issue with .net 8 and loading local json WASM file. Getting error on call to GetFromJsonAsync file not found. Is this a bud?
I'm not aware of a particular bug of this nature. I'm sorry, It's hard for me to troubleshoot as I don't know your environment and can't see your code. All I can advise is that you have the latest preview version of .NET 8 installed.
@@GavinLon I am running the latest version of preview RC2. Here is the test Code.
@page "/hs2022"
@attribute [RenderModeInteractiveAuto]
@implements IDisposable
@inject HttpClient _Http
HS20A
This component demonstrates showing data.
@if (Tariffs == null)
{
Loading...
}
else
{
id
text
parent
@foreach (var TarVal in Tariffs)
{
foreach (var Item in TarVal.results)
{
@Item.id
@Item.text
@Item.parent
}
}
}
@code {
private List? TarFile;
protected override async Task OnInitializedAsync()
{
// Simulate asynchronous loading to demonstrate streaming rendering
await Task.Delay(500);
TarFile = await _Http.GetFromJsonAsync("test.json");
}
void IDisposable.Dispose()
{
// persistingSubscription.Dispose();
}
}
public class ClrHS2022
{
public bool more { get; set; }
public int minimumInputLength { get; set; }
public string? classCode { get; set; }
public string? className { get; set; }
public Result[]? results { get; set; }
}
public class Result
{
public string? id { get; set; }
public string? text { get; set; }
public string? parent { get; set; }
}
file Path = "wwwroot/"test.json"
Sample Data ->
[
{
"more": false,
"minimumInputLength": 2,
"classCode": "H6",
"className": "HS2022",
"results": [
{
"id": "01",
"text": "01 - Animals; live",
"parent": "TOTAL"
},
{
"id": "999999",
"text": "999999 - Commodities not specified according to kind",
"parent": "9999"
}
]
}
]
Error message:
HttpRequestException: Response status code does not indicate success: 404 (Not Found).
System.Net.Http.HttpResponseMessage.EnsureSuccessStatusCode()
System.Net.Http.Json.HttpClientJsonExtensions.g__Core|12_0(HttpClient client, Task responseTask, bool usingResponseHeadersRead, CancellationTokenSource linkedCTS, Func deserializeMethod, TJsonOptions jsonOptions, CancellationToken cancellationToken)
Test82.Client.Pages.Hs2022.OnInitializedAsync() in Hs2022.razor
+
TarFile= await _Http.GetFromJsonAsync("test.json");
Sorry for the mess. Have this issue for a week now.
I believe that you created a Blazor Server project not a Blazor Web app project, because if what you claimed was correct, then you will get the Blazor WASM project without the need of creating it then making a reference.
Hi. I created a project based on the Blazor Web App project template, a new project template made available with .NET 8. Prior to .NET 8, you would create either a Blazor Server project or a Blazor WASM project. Now with .NET 8 you can use the Blazor Web App project template and integrate, Blazor server components, Blazor WASM components, with the new features available in .NET 8 like SSR and streaming rendering, and using the new Blazor Web App project template means you can integrate all of these features into one project. At the time of creating this video, in order to integrate a Blazor WASM component into a project based on the Blazor Web App project template, you needed to create a separate Blazor WASM project and then reference the Blazor WASM project from within the main project (based on the Blazor Web App project template).
@@GavinLon You're right, I am new to .Net 8 and was not aware that the Web App template didn't include WASM project during the time of creating this video. Thanks for the explanation!
Just a suggestion
The video thumbnail could get lot better 🤐
Okay thanks! :)
I get the "warn: Microsoft.AspNetCore.HttpsPolicy.HttpsRedirectionMiddleware[3]
Failed to determine the https port for redirect." problem when using dotnet run? How do I fix this?
The answers here look pretty good. See if any of these work. Further down the page you'll see an answer by yehonatan yehezkel - that might be your solution. I hope this helps :)
learn.microsoft.com/en-us/answers/questions/1297509/how-to-fix-this-error-warn-microsoft-aspnetcore-ht