Blazor API Client using REST & GraphQL APIs - Full Course
HTML-код
- Опубликовано: 4 окт 2024
- In this step-by-step tutorial I take you through how build a Blazor WebAssembly (WASM) app that will allow you to call both REST & GraphQL APIs.
This video includes:
Application architecture overview
Blazor theory and core concepts including WebAssembly, SignalR and websockets
Building Blazor Components
HttpClient & HttpClientFactory
Building Data Service to call REST & GraphQL APIs
Level: Intermediate
📕 My Book: www.apress.com...
🤩 Patreon Site (Exclusive Member Benefits!): / binarythistle
📕 Webhooks Course on Udemy: www.udemy.com/...
💻 GitHub Repo: github.com/bin...
🔗 DTO Class Construction: app.quicktype.io/
🔗 Open Iconic: useiconic.com/...
🔗 Blazor Event Handling: docs.microsoft...
🔗 Bootstrap Course: www.udemy.com/...
🔗 Insomnia Client download: insomnia.rest
🔗 JSON Editor Online: jsoneditoronli...
🔗 Newtonsoft Vs Microsoft: docs.microsoft...
⏲️ Time Codes ⏲️
PART 1 - INTRODUCTION
1:20 Welcome
2:29 Demo
7:00 Course Overview
9:30 Solution Architecture
12:13 Ingredients
PART 2 - THEORY
13:13 What is Blazor?
17:58 Why use Blazor?
19:10 Size by Size - the 2 flavours of Blazor
23:33 Blazor Server Closer Look
26:28 Blazor WASM (Client) Closer Look
PART 3 - CODING PART 1 - OUR FIST COMPONENT
29:46 dotnet new... (Start the prject build)
32:25 Project anatomy
47:55 A look at our first Component
49:21 Our Component UI
1:00:47 Adding UI Events
1:05:46 @Code - Adding our methods and properties
1:13:37 Error handling
PART 4 - CODING PART 2 - STARTING API CALLS
1:15:29 A look at our APIs
1:18:10 Exercising our APIs with Insomnia
1:29:47 A look at the "Fetch Data" Component
1:33:47 Working with JSON & DTOs
1:46:58 Calling our REST API
1:54:02 Separating Concerns
2:00:26 Adding an appsettings.json file
2:05:14 HttpClient & HttpCLientFactory
PART 5 - CODING PART 3 - DATA SERVICES
2:08:32 Creating our "Launches" Component
2:13:04 Introducing Data Services with HttpClientFactory
2:24:57 Our REST Data Service
2:28:54 Using out Data Service
2:32:46 Revisiting the GraphQL Payload
2:35:00 A new DTO
2:40:35 GraphQL Data Service
PART 6 - WRAP UP
2:56:33 Wrap up and Final thoughts
3:58:06 Patreon Supporter Credits
Hey, this video is looking real good! Because you have already timestamped the video, if you put 00:00 in the description, RUclips will automatically create chapters in the progress bar
Also, small note, the last timestamp should be 2:58:xx and not 3:58:xx
Always an exiting day when Les Jackson releases a new course/video. Thank you so much!
*exciting
Best intro ever JavaScript is an abomination
Found your channel probably a few months ago. Really good videos dude. I like your style how you make them.
I subscribed to probably 100 channels of different things and you're probably one of the three channels that I actually clicked the bell on. Keep up the great work.
Hey James thanks for the sub man! Glad you like the content, cheers, Les
@@binarythistle The content you make is always appreciated.
@@binarythistle I also stumbled across a few months ago. Made sure to share with my team at work. I think everyone has watched and learned a ton. Thanks and keep up the great work!
Dude, your videos are amazing. You cover real world scenarios.
Though the industry does not accept Blazor WASM like React or Angular, this course helped me on gaining knowledge on GraphQL, HttpClientFactory and quicktype tool. Hats Off!!!
What a timing! I needed this for what I'm building, just finished the MVC REST API video as well, I've learned a lot, thank you!!!
I'm going thru it!
This is perfect timing! I was just giving up on Javascript!
Same here - JS is a mess of a language IMO.
Nice! Glad i could help!
Persevere! Spend a bit of time *properly* understanding Promises and Observables and life gets easier. It opens up so many opportunities. I learned a bit of Angular and suddenly I was able to write production quality mobile apps using Ionic.
TypeScript makes writing cleaner code much easier for C# devs too.
man thats amazing i just commented to ask for blazor and in the same day i get the full course
i canot believe it
I aim to please! ;)
I am so happy that Tyson Fury knows a lot about blazor LOL love your content man :)
Still working on the previous video, I made my first graphql server thanks to you, Love from Puerto Rico my brother.
I want to say "great work" on your blazor tutorials. I am really enjoying it. Carlo
thanks for this, your channel is underrated. i've taken a lot of udemy course but i can say you're lessons are equally or much better than those. keep it up. My only additional input is that I feel like I'm listening to my strict professor.
@ 2:44:00 I am happy u made that choice. as viewers get to know what's underneath without thinking that it's some sorta magic.
Blazor stuff! Yes! Thanks Les - you're a STAR!!!
It much better that you are standing. You are far more animated. This is a good thing. Carlo
I've been using Blazor for a while but I enjoy watching these videos as there's always new things to learn: i.e. I didn't know about the appsettings on the client.
However, the GraphQL service could have been simplified by using PostToJsonAsync and then the ReadAsJsonAsync extension method on the reponse.Content property.
It would be amazing to see a video about blazor server from you. Your vids are great btw
A very good presentation, keep up the good work, learnt heaps about Blazor and GraphQL.
This is so awesome and I so appreciate you!!
Thanks for this very useful tutorial! GraphQL is new to me, was great to learn, and also your useful tools.
This is really wonderful to follow (just my sort of liking in the way and order you explain things in sufficient and enough detail) and learn along the way. So a great THANKS from someone hugely interested in making a professional career switch as a code-developer towards Blazor in the broadest sense. So once again thanks! Pls. continue teaching this way. Have a great day.
Excellent learning tutorial!!
In Visual Studio you can create your classes from JSON using - Edit > Paste Special - creates much less noise and much simpler
Thank you for the work you put in your videos, they are very in-depth as well as conceptualized. I learnt how to write API from watching your .NET 5 Api tutorial
This dude saves lives
Always happy to help my fellow devs!
Very high quality, thank you.
Thanks for your efforts in sharing us what you know ...very generous indeed ...love to see more videos from you ...thanks again
Wow.. Thank you for this video. I am a big fan and can not wait for more..
Every your lessons are amazing . Thanks you very much.
At 1:13:20 and I am thinking rock on my brother, thank you for this video, and again thanks for not being Tim "All about me me me" Correy.
Thanks Les... exactly what I needed to learn. (ps. I'm in Bentleigh VIC with real insomnia)
Another great training course !!
one of your best video's. nice job!!
great video. thanks
Thanks a lot for this quality content!
Thank you sir, great tutorial.
Awesome video. Very useful for getting the newbie grads at work up-to-date with actual knowledge they can use. Would be good if you could cover OData as another option. Provides the filtering, sorting capability over a REST API. So a potential comparison for GraphQL. Would also advise using the UTC time from spacex api. In a real world app you want a specific locale to ensure back-end consistency. Also wold be good to have a deep-dive for system.text.json (maybe with use of Dahomey.Json library for the extra supported functionality)?
LOL! Amazing intro!
I see JavaScript books thrown into the trash can - I give like.
Les deserves more subs
Les deserves more :)
Just a note that the spacex api seems to be dead, and the creator said (in github issues) that hes going to shut it down. I recommend trying other rest+graphQL apis for this course, there are plenty available :)
how the hell do you get past the CORS issue with blazor wasm? I cannot find anything about this...everything refers to app which is not in blazor wasm. saw one thing builder.Services.AddCors() but that is not recognized.
Thanks for providing some clarity on this topic!
Two things are confusing me about Blazor wasm applications-- not your presentation, but really about Microsoft's intention:
1) I notice that the default template project brings in bootstrap CSS. Does that mean we are "required" to use bootstrap? Are there any implicit hooks into bootstrap itself within a blazor wasm application? Would I be setting myself up for a world of pain if I strip out the bootstrap and instead just use the more modern CSS grid for layout?
2) The blazor/wasm template brings in the CSS part of bootstrap, but not its usual js dependencies of Jquery and Popper. These are used for things like collapsing navbar menus, dropdowns, etc. If I am going to use bootstrap, I would very much like to use it like in the bootstrap docs and handle all low-level UI with bootstrap's facilities that depend on jquery. I notice that the template uses a method in an @Code block to handle collapsing the navbar menu. Does that mean it is not possible to add jquery js to HTML template and then just use bootstrap's data-target attributes to collapse the navbar menu (like in the bootstrap docs)?
If everyone had a teacher like Les Jackson, 2021 would have been COVID Free
#100 comment, your course are really great,
As always, a great video. Toooooop
Thanks Raouf!
I am a front end javascript developer, always looking out for new stacks. You haven't convinced me, But good Video. Thanks
very very good learning content. can you please make a course about GRPC
Les Jackson you should minimize that windows search field to have more space on taskbar.
Go right click on taskbar and than you'll find some option to display only the search icon!!
I hope that you see it, cause is so annoying to watch you change between taskbar levels 🤣🤣
#My mentor. Whereever I am whenever I am.. you will always be my mentor. 😍🤘🤘🤘🤑
Thanks Radha! What a privilege that is! Les
... Fantastic 🔥
you are really inspiration for us. eagerly waiting your videos to watch and learn some new concepts in dot net. while watching your videos one man comes to my mind The Braun Strowman WWE. you are like him strongest superstar. and one request could you please make a video on Kafka with dot net .
Woah, first person I've seen coding C# in VS Code, does he have a VS Code setup tutorial?
Thanks for the awesome video! What program did you use for the UI mock up? Cheers
Thank you sir
Is this tutorial available as book? thank you for your great video
I wanna make a career as a c# web dev.. please advice what to avoid and what to follow
You had me at, no Javascript. 😄
Which day will the ".NET Community Standup" feature you! should .NET have an Academy, you should be in the team. thanks again
I like long videos
I keep looking for jobs in Blazor on Indeed, but there are hardly any available. Is learning Blazor worth it if no one is hiring for it?
Love your videos man, can you please make videos on azure functions
Try this? ruclips.net/video/Ft34VWPpiA4/видео.html
@@binarythistle Yes already watched it, I just want more detailed with some business logic as an example.
Oh you hero! I thought it was just me that thought javascript and it's attendant bloat was an enormous bad code smell!
Can you please explain how we can integrate above project with Kubernetes?
what are you using as extension to be able to auto implement interface methods etc
What are your thoughts on the latency issues in wasm project.
He is Baaaahhhck!
Yes Mate! Good to be back!
hey jackson, when is the dotnet redis tutorial coming up? i need it T _ T
This sounds promising….
how do you store tokens securely on the blazor client? or is it even possible?
I have the same question
You deserve a million subs. It is so sad that there are so many stupid channels and those are the ones people cares about 🤦🏻♂️
How to implement ADFS SAML Assertion Consumer with Redirct binding in .net core razor pages application? Please help
Thanks Les, just subbed, I'm a React user but interested in C# world. Is it perfectly fine to use vs code as opposed to visual studio, thanks!
It's perfectly fine.
Am lazy so I use visual studio.
@@barryblack8332 Thanks Barry!
clicked for blazor, stayed for the GraphQL
hot reload for the annoying ctrl+c dotnet run
tl;dr
dotnet watch -p "directory name" run
Anyone can help me with Data Validators to use in GraphQL projects? I Have seen only FluentValidation, but I don't know if exists another good validator
No esta activado el subtítulos en ingles :), saludos de los andes peruanos
your movie has lots of associate producer but no director? did I miss something?
Hi H.J.! The Associate Producer credit is a benefit of supporting me on Patreon: www.patreon.com/binarythistle so it's important to me they go in at the start. In the past I have put the other credits, (Director, Editor etc.) at the end of the video, but as they're all me I've stopped doing that!
i code blazer and still find i need js interopt and js lol , at the moment anyways, hopefully they will remove the need for jsinteropt altogether, i never wanted to go any where near js but sadly my boss made us do it for 2 years :/
What kind of keyboard are you using?
Hey Vasko, Logitech Pro with Romer G switches: ruclips.net/video/BW5-Ve-yiBI/видео.html
Hey, what's the deal with heavy vocabulary in code?
Basically,you don't see that kind of vocabulary in js channnels for basic api fetch tutorial like this🙄
Does anyone else get error messages from the App.razor file? The type or namespace name 'MainLayout' could not be found (are you missing a using directive or an assembly reference?) [BlazorAPIClient].
Hi there, I am getting this error when I try to split my components. Were you able to resolve this issue?
Js should go back to being only a frontend tool for web designers. Aka, not for programmers.
fuckin legend
First :-)
Nice!
In most cases we treat javascript as if it was not a programming language, just something that is there for support
Hi.....
Hi mate!
Hey Les, I like Your classes but I suggest You find a way to split it in more clips. 3 hours is too long. Shorter clips are easier to handle in my opinion
Are you interested in getting help and private lessons via email in exchange for a small donation to a charitable organization ? You may find my email address in the stackoverflow site under the profile for the "enet" user.
HATE js also
Please not so big videos!!!!! You are making great videos but you loose it because it is 3 hours and more. PLEASE DONT DO IT!!!!!!"! You can split it to smaller ones max 1 hour each. It is a shame to make so good videos but because they are toooooooooooooo big someone cannot watch them after the first hour.
PLEASE DONT MAKE SO BIG VIDEOS PELASE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
My advice : Make use of the handy added 'Time codes' which distinguish and separate the video-parts which make this full video complete.