Dependency Injection with .NET Blazor

in an earlier video i have explained the basics of dependency injection it's time to get with a concrete example so in this video we're going to see how to do dependency injection with the different scopes in blazer so here's the end result of the thing that we're about to see in this video um of course dependency injection you know is not something that you can typically see from the outside but um here we have two of the same end result applications that we have here and we're going to find out one of the things um how it can be that we have 15 here in this incognito window and whenever i click here in this one it starts with 16 and then we go to 18 and we go back to the other window it starts at 18 and goes up to 21. how can that be let's see how to implement this animal and here we are in visual studio 2019 on windows um i have here a file new blazer server project so this is blazer server not blazer web assembly now note that you can do everything i'm going to show you in this video you can also do that with blazer web assembly so if you're not sure which is which let me know in the comments and i will make a video for you just explaining that one but this one's all about dependency injection so for blazer server it's it's kind of you know more interesting with the kind of scopes that i will go over and for blazer web assembly that runs on the client so you know the singleton might not be as useful um but for for this case it doesn't really matter so let's just dive straight in we have the program and the startup right here um so this is a little difference that you will see in web assembly there you will not have the startup class depending on the options you um select when creating the new webassembly application but you know in the program cs you will see sort of the same thing where you can say services but then it will say builder dot services and then you can say dot add singleton or we have some other things as well we have add transient so transient is that will give you a different instance for each request for each session so basically each time you reload a page or you go to a different page you will get a new instance of the class that you're going to register here then you have add scoped which is scoped to your current session so blazer has this way in asp.net core this is by the way very similar or exactly the same way that asp.net core does it will add a scope to your session so it has a way to figure out if you are still the same user doing multiple requests and whatever you do during that session you will each time get the same object back so when you're maybe doing some things with your user profile that will be scoped to your session um and you will get back the same instance each time now the ad singleton is already in the line above at singleton oops singleton there we go is one instance for you know the whole application so it doesn't matter if it's a different session or a different request but the signal thing will always return that same instance now this is useful for for instance on the blazer server application where you know this is actually hosted on the server which returns you the same instance but if you go the blazer webassembly route then um you know you will have that running locally on the client so it's a singleton on that client but you know that doesn't really have a purpose as the same singleton for other users of your web application so beware of that one but we're running in a server instance here so let me actually just create a new class so i'm going to right click on my project at um new class here we go and let's call this my singleton counter so here we go add that one this is just a regular class i'm actually just going to add one property so this is going to be public int my counter value with a getter and a setter so of course this can have methods all the kinds of things i'm just going to do this with a symbol property which is enough to demonstrate the thing that i want to show you and we're going to add that singleton here so let's add the singleton counter it should show up in my intellisense there we go and like this we've registered this thing as a singleton now of course you can also use interfaces but um you know not everything has to be an interface so whenever you have a need create an interface for it else you can also register concrete classes like this this will instantiate of course you have overloads of the ad singleton and ad scoped and all of things where you can provide an action so let's have a look at one of these overloads where you can have this action this function actually that you know provides you with an implementation of the thing um so here you can say hey i want to [Music] get this factory in i think and we're going to give the implementation back but it can infer that so here you can say new singleton counter like this as well and it will just return that which is useful in the case of where you maybe have parameters in your constructor or something that you need to provide or you know maybe some other scenario so that's the way you can do that but in its simplest form you can just do the singleton counter like this and it will call the default constructor and create that instance for you so now that we have that in place let's also implement it somewhere so that's kind of interesting because you know now whenever you go to some kind of c-sharp code you still have of course the dependency injection here so if i do this in my startup which is which is not going to work this is not the greatest example but if you have some other constructor of another object you can hear say hey i want this singleton counter counter and it will automatically inject that for you it will go look in the dependency injection container first see if it has an instance for you and it will inject that in the constructor for you like i said in the startup case is not the best example because here it's not registered yet because that's actually happening in this class but for any other instance of code that you might have it works but the real interesting thing of course in blazer is whenever you do it in razer pages so if we go to the pages and we're going to go to the counter razor page um here we can say at the top we can say inject which is you know the way to inject the actual thing um and here we're going to say our singleton counter here we go so this is the type that you want to have injected this can be the interface or the concrete class just whatever you've registered registered with in the dependency injection container and then we can say the variable name that you want to reference it by so now we have a my counter that will be injected automatically you don't need to do anything else besides just registering it in your startup class so now we have this my calendar and i can replace this here the current count is my counter dot my counter value that's the property again this can be a method this can be anything we don't need this current account anymore so let's just remove that and in my increment count i'm going to say also my counter dot counter value is plus plus so now we did everything to use our singleton counter right here so let's just start this application and see what it comes up with here we go here is our application let me zoom that in for you a little bit so you can see it just fine we're going to go to this counter page and i can increment this this this just works so it injected our singleton counter thing and it's now at five so the interesting thing because this is blazer server so i can copy this address and i can go to the incognito mode and i can put it in here and you can see because it's a singleton this has five too because this is a singleton it's true for all applications all requests all things so we both have five and if i click here now it doesn't update live but you can see i put it here online and whenever i continue this on the the other instance then it will go to 10. you see so it shares this instance it's all the same class so this is what the singleton does again only in blazer server because if you're going to do blazer web assembly then it's it's going to be locally so that's not going to work now let's quickly see the difference to round this off um if we do the singleton counter let's just keep the name but now we are going to register it as the add scoped and we should see that this behavior now changed and now we're going to have it per session so it shouldn't you know share that same value for both these um so we have the counter we're going to do one two three four five um copy this address go to incognito mode go to the counter and you can see this is zero because this is a different session so i can do here and this is separate from each other so because they both have a different instance of that singleton counter class because we now registered it as a scoped one and of course you know if you do the transient one then this is going to be different per request which is not the greatest example to actually illustrate this so i'm going to skip that for now then of course the question is like hey when do you use which and i guess you know it depends um based on my experience you the scoped is i think 90 of what you want to do because you probably want to use it for the users per session the singleton then and the transient one is for really throwaway objects but the transient one i find it um not really something that i use often so it's the scoped usually the singleton sometimes and that's basically all the things that you need to do do you have any scenarios where you use the transient i'm curious to know so let me know in the comments below um what that is and of course if you want to do more about any of the stuff that i've shown here or if you have any questions let me know in the comments too and i'll be happy to answer them or maybe make a follow-up video on that now you know how to apply dependency injection in blazer so that's cool and if you've watched this video then you automatically know how to do it in asp.net too because you know blazer is just asp.net so you now know how to do that too um thank you for watching this video if you've liked it please click that like button so that it goes into the youtube algorithm of happiness and other people can share the joy as well um please if you haven't already if this is the first video you see from this channel subscribe to my channel for more content let me know if you want to see more blazer right now at the time of recording it's more examining that that kind of stuff but you know i want to expand my horizon maybe to blazer asp.net some azure things let me know what you want to see down in the comments and um subscribe to my channel so you'll be notified automatically of new content and then i'll be seeing you for my next video keep coding

Channel: Gerald Versluis

Views: 1,509

Rating: 5 out of 5

Keywords: dependency injection, inversion of control, c#, c# dependency injection, c# dependency injection tutorial, dependency injection tutorial, blazor server tutorial, blazor webassembly, blazor webassembly tutorial, blazor dependency injection, asp.net dependency injection, dependency injection scopes c#, dependency injection singleton vs scoped, dependency injection explained, dependency injection scoped, dependency injection transient, asp.net core dependency injection, razor pages

Id: roWkfJoDf3w

Length: 11min 20sec (680 seconds)

Published: Fri Apr 30 2021