>> If you were a C^Sharp developer who wants to work in a
fast editor environment, and who also wants to learn
more C-Sharp as you go, I think you should learn VS
Code for C-Sharp development. In fact, I think that all C^Sharp developers
should use VS code at least sometimes in their
project in order to grow their experience and
understanding of C^Sharp. Now before we get into
more of the why and then into how to actually use
this, lets start off. Who am I? My name is Tim Corey. It's my goal to make
learning C-Sharp easier. I have a YouTube channel
you can check out at YouTube/iamtimcorey that has over 450 videos dedicated to C-Sharp and the
surrounding technologies. I love you to check it out. Also go to iamtimcorey.com and
look the resources section. There you'll find
even more resources that will help you as a developer. I have my podcasts that comes out weekly that
covers developer questions, questions you might have
about being a developer. I also have the
C-Sharp projects site, which is a free resource
that will help you understand the various
project types in C-Sharp, how they work, how to
get started in them, and how to go deeper
into those topics. If you have a suggestion, there's also a suggestion
side the bottom that will allow you to ask your question or get your particular topic
covered in future content. That's who I am. Let's jump into what is VS Code and why is it important
for C^Sharp developers? Lets start with the why
first and then jump into actually doing stuff
with the code. So why? Well, the first why is because it's just a fast cross-platform editor. It's going to work the same
on Windows, Mac, and Linux. You can just jump right in
and edit your code on any of those platforms and
it's going to look and work the same way. That's Number 1. But Number 2 is, it's going to give you
better experience with.Net command line and that
makes me step backwards. You may say Tim, Visual
Studio is amazing. It does all those things for me. I don't have to know
a dotnet command in order to run my application ISA F5, and it runs, well, that's true, but Visual Studio isn't always
going to be there for you. For example, if you want to have a CIC process in GitHub
actions or Azure DevOps, then you're going
to need to know how the dotnet command line works
in order to build your project, test your project, publish
your project, and more. It's better to learn that now in VS code so that you understand
the intricacies of how it works. You better understand
how to automate things and have a better
understanding of what command you'll need in order to set up a great process for building and
publishing your application. That's Number 2. Number 3 is getting a better knowledge
of C-Sharp syntax. Sometimes Visual Studio
comforts you a little bit with these nice pre-done templates
and item templates and so on that allow you to forget all the stuff
that's behind the scenes. But the downside is it
becomes a black box or magic that when it breaks,
you don't know how to fix it, so the VS Code, it pulls back on some
of that and you have to understand how
various things work, which is a good thing. You have better understanding of the foundation that you're
building your applications on. Finally, it's going to give you
a new perspective on your code. Just by looking at your
code at a different editor, you will see things differently. So trying a step back look at the VS Code and say,
how did this work? How is it working?
How should it work, and what am I missing? I think that VS Code is a
very important tool for C-Sharp developers to use to
also learn C-Sharp better. Let's jump right into
the code and see how VS Code works with
our C-Sharp code. Now, I'm going to switch to my editor here and the
first thing I'm going to do is I'm going to show you I have one extension installed
that's important to you. It's a C-Sharp extension. We have the C-Sharp extension. This is all you need,
is from Microsoft, powered by OmniSharp and it is the tool for working
with C-Sharp in VS Code. Nice stuff installed, but that's the only one
relevant to today's discussion. Right now, I have
nothing in this folder. Let's go over to the folder itself
and just see there's nothing in this console folder so let's get started at looking
at how dotnet works. The first thing I'll do is
I will pull up my terminal and the terminal here is going to allow me to interact
with the command line, so the dotnet command line, and here a dotnet is going to
give you some information. The way to get help and
the way get information, and the list of SDKs and so forth. Let's look at the dotnet info and this shows you which things
are installed on my machine. You're going to see that I
have a number of SDKs from 3.1 through 7.0 and that [inaudible] which is about
the same that you'll have right now with the production
version of dotnet setup, but it wasn't available
when I'm recording this. It's a bunch of different
things installed. We're going to use
the dotnet 7 today, but you can use whichever
version you want, whichever one is installed and
if you have a SDK that you want, just search for dotnet SDK
in Google or Bing and you're going to find the list of SDKs
you can install on your machine. With that, we can get started
on creating stuff in dotnet. We're going to say dotnet new sln. We're creating a new solution
we're going to call it name is confsln and this creates for us a dotnet solution
called confsln dotsln. Then from there you're going to say, well Tim, how did you
understand that command? Because that seems like it's magic. There is no such thing. Well, it's not magic.
Let me show you how. Dotnet new and I can say list. If I'd done dotnet new dash h or tell me the different
opposite can call, but lists is one of those, and this list is a list
of the templates that I have installed on this
machine that I can use. One of those down here is SLN. Now another one is the gitignore. Have you ever create
a dotnet product and forgot about the gitignore and then try to put in a
Git source control? It causes some problems. There's a lot of stuff
it needs be ignored. But trying to manually
create that file is also annoying. Let's do this. We're going to say dotnet
new gitignore. Done. >> There is our gitignore file
with all the settings we need. We're not going to
work at Git today, but I just want to show you
that that super easy to do is a really helpful
tool and you can even do this on existing projects in case they don't have a
gitignore and they need one. Now let's go back and we're
going to clear screen again, and we're going to say
dotnet new console. This is a new console application. But I'm going to
give it a framework, so -f and say net7.0. I can change this framework or
have leave it off and we'll use the latest framework that's
installed on my machine. The name is going to be TestUI. Now we've created a new
project type called Test UI. There is our console application. Pretty cool. Now I can come
back to our command line. We can clear this screen again, and this time we're going to
do is say dotnet new classlib, for class library,
again -f for net7.0, and you want to say
this name is HelperLib. There we go. We now
have a helper library. It's again in.NET 7. There's our Class1.cs.
We're good to go. That is our setup for our
project in our solution, but we haven't associate the two
together yet. Let's do that. Let's clear this screen here.
We're going to say dotnet sln, for solution, and give
it which solution. We'll say add TestUI/TestUI.csproj. This will add the
project to the solution, hit "Enter", and we're going
to do the same thing again. This time, I'll wipe
this out and we're going to say HelperLib/HelperLib.csproj. Again, we're going to
add the helper library to the solution as well. We're going to add both
of those solution, and now let's bring us back down. I want to open up the TestUI.csproj. In here, again, this is where you get
to know C# better. In your csproj file is
where you have references. If I wanted to reference
the class library, I have to add a reference
in here in my csproj file. I could do that manually or I
can come to the command line. Let's see those. Like it is, you can see what happens to
the csproj file automatically. I can say dotnet add TestUI/TestUI.csproj reference
HelperLib/HelperLib.csproj, and that adds a reference
to the helper lib project. I could type it out manually, but this way is another option
for you and it's different than just a VS Code's checkbox
so you know how to do this even you're not
in Visual Studio. The Visual Studio checkbox is nice, but this shows what's happening
and how you could do it yourself. Now, let's do something
similar in the helper library. Go there and we're going
to clear the screen. In this library, I want to add a reference
to a NuGet package. Not know how to use
this for the demo, but I just want to show you
how to add a NuGet package. We're going to say or change the
directory into the helper lib, that's makes it easier,
and we're going to say dotnet add package Dapper. There you go. That's how you'd
add Dapper to your csproj file. You could just type this, but you can also run it
from the command line. Both options are available to you. Now, so far we built a project, we built a second project. We've added both to a solution. We've referenced the
library in the UI projects. We've added a NuGet package, but let's see how we actually
run this application. Let's delete this terminal. I'm going to come down
here to our Program.cs, and I wanted to hit "F5". But if I do, it says,
what do you mean? Nothing seemed to happen here. Well, that's because we don't
have two projects that are normally created by
OmniSharp by default, but sometimes they don't
get set up that way. No problem. What we can do is
Control Shift P to bring up our UI here and say.NET generate
assets for build and debug. When you do that, it creates this VS Code folder with our
launch.json and our tasks.json. If you ever actually delete
this folder, no worries. You can just do Control Shift P and generate the assets
for build and debug. With that, we have the two files we need to
launch our application, but we're not quite done yet. There's one thing I want to tweak, and that's in launch.json. Now right down here,
it says console. Which console do you want to run? For our web projects, this isn't a problem
to lead us as it is. But for our console applications, we might have a console reline. We don't want the internal console because it doesn't have the
ability to send data to it. We want the, there's IntelliSense here,
integrated terminal. That will be the terminal
inside of VS Code. We could also say that you want the external terminal and
that will give you a pop-up, that is your separate
command window. We're going to do the
IntegratedTerminal , not console, IntegratedTerminal. With that, I'm going to hit "F5"
like you would in Visual Studio. It's going to launch,
it's going to run, and it's going to jump
over the debug console. But if you go back to the terminal, we'll see that we have
Hello World right here. Now, this application
didn't do a whole lot. It just has Hello World. Let's do a little bit more here. Let's do our Console.Write
please enter your first name, and then we're going to say string firstName equals Console.ReadLine, and then we're going to
say Console.WriteLine, and we're going to say hello, firstname, like so. Our console now this does
say, hey, you know what? That's actually a nullable, which is something that's now
built into OmniSharp which says, I know about nullability, and if you go to your csproj, you'll see that nullable is enabled. It's saying, hey,
strings can be nullable, therefore warn if we're trying to switch from nullable to
non-nullable and so on. That's a good warning. We
can leave it alone though. But now let's do this. Let's put a break point right
here before our WriteLine, and let's hit "F5". >> If we go back to our terminal, will see please enter your
first name at the bottom here. I'm going to say,
Tim, I hit "Enter". Now we're at the breakpoint. We can inspect the first name
variable and see that it has the name Tim inside of it. This is just like our Visual Studio experience or
close to it but it's in VS Code. I can just hit "Continue" and now it prints out
Hello Tim to the console. That's how you would
set up a project. But let's start all over this
time with a web project. Let's do some a little
harder. Let's close this out. I move up one level
and we're going to a Blazor folder which
has nothing in it, you going to right-click and
say show more. Open a terminal. I can just say code. that works too. Also now I
have Visual Studio open again. I could open my terminal with
the control in the backtick, and let's create a new
Blazor project dotnet, new solution, name, BlazorSln. Let's add our dotnet new
gitignore. Just we have it. Then let's say dotnet
new blazorServer. Name is BlazorDemo. I'm not going to specify the
framework of this point. Just go. I capitalize s, looks like. I couldn't find that
template, no problem. There you go. There's a template. Now with that, if you
go look at the csproj, you'll find that the net 7 project. I didn't specify it,
but because that's the latest version on my
machine, that's what it gets. With that all set up, I need to clear a screen here. Let's expand this. Let's add dotnet sln,
BlazorSln.sln add BlazorDemo/BlazerDemo.csproj. Add that to our
solution, just the one. We're going to do is, we're going to clear screen. Let's say kill a terminal. Now we need to do the Control-Shift p to the.NET
Generate Assets for Build, and says, hey I can't find it, now it says, I can find it now. Hit "Yes", there we go. Sounds OmniSharp isn't started
quite yet, I went quite fast. But if I figured out that this is a cs project file and set
everything up for me for launch. We should be good to go, well, let's find out. If I were to hit "F5" right now and run this,
what's going to happen? Well, it should launch
my web browser. It did, and it should
launch Blazor, cool. Now I have Blazor up and running, and you can see, let's
zoom in here a little bit. We find that command
here. There we go. We click the "Counter"
it works, cool. That's all great, there is couple
of things that are wrong here. First of all, notice that
this is the HTTP version. You can notice by the port number. There we go. The port number
isn't the 5,000 series, not the 7,000 series. HTTP, if you also check here it says your connection
is not secure, so we don't have the HTTPS version. Why is that? Well, it's because of
how we set things up. Let's go ahead and stop this. You've stopped this and we can even get rid of
terminal if you want. Let's make some changes to our setup so we understand how things work and
set it up correctly. First of all, you should
know and if you don't ask, no problem you'll learn now. Under Properties, there's
a launchSettings.json. This is true not just for VS Code, but for all web projects
in asp.net core. This tells the system how
to launch your web project. In here, notice we
have IIS settings, but then under the profiles, we have an HTTP setting, an HTTPS setting, and
we have an IIS Express. If you were in Visual Studio, these three options
will be in a drop-down. You get to choose which
one you wanted to launch. But we don't have a dropdown here, so which one is it launching? Well, by default, it's launching the first one. We haven't specified anything
which only has HTTP. Now you could delete this. That would make the
first one the default, which was this one, and
that does have HTTPS. That's not an ideal solution. Instead, let's go
into our launch.json, and we're going to set the
launch settings profile. In here, we're going to set, let's go right here. Now if you have
IntelliSense we going to say launch settings profile, and we are going to say HTTPS. How do I know that?
In large settings, we have profiles, HTTP, HTTPS and IIS Express. You could change those names. Those are just identifiers for you. But we're going to use
the built-in HTTPS. Let's start that next. So just with that one change, hit "F5" and launch Blazor server, and says your connection
is not private. I have not yet approved that
certificate that's okay. We can do that in a little bit. But for now, we'll continue
on and there we go. We have under HTTPS Blazor
server. That works. But we're not quite done
yet because we don't have the idea of Hot Reload. I really like Hot
Reload as a feature, so let's add that to our VS Code. In order to do that,
we need to change the pre-launch task right
here in the launch.json. Instead of build, want to change
this to watch, that's it. Hit "F5" and now we're going
to have the hot reload. Notice it says Hello, world. Let's see if we can
minimize this a little bit. I'm going to minimize my VS Code
a little move over and see if I can get this all on one
screen. There we go. Let's go to our index page. I'm going to minimize the Explorer window so we have
everything or the side window. Everything is visible here.
Let's change this to.NET Conf. I haven't touched
anything, it just updated. As soon as my page saved, it went ahead and did the Hot Reload and loaded the new
changes on my Blazor app. This is all done with
the command line. Here's some really cool stuff
you can do inside of VS Code. If we go back and look, we have talked about debugging. We've talked about
launching your application. Let's go ahead and stop this. By the way, we can stop this. It's not quite stopped
yet with terminal. It's still load, let's hit
"Delete". That'll stop it. With that, we've
looked at debugging, we've looked at breakpoints, we looked at adding projects and
solutions and NuGet packages, and doing the dotnet watch for looking at our application
and doing hot reload. We've changed our web server. We've done a ton of stuff in VS Code and really just
scratched the surface. There's so much more we can do in here that it's pretty impressive. Again, it works just like
our other environments. We can just dive right
in here and start making changes to our Blazor page
and we're good to go. We can just see those
reflected on a pages. We can have our web browser and a different monitor and see those pages reflect the
changes immediately. There's a lot of stuff
you can do with dotnet, but it's all command line. I would encourage you
get to know our VS Code, get to know the actual, it's called the
actual terminal here. Just seems easier. Let's
say dotnet and just start doing dotnet
-h Here's your list. So we have add, build, clean, format, list, nsbuild, new, nuget, pack, publish,
remove, restore. There's a lot of stuff in this list that will
allow you to manage and manipulate your dotnet
projects without having to have an editor
to do a job for you. Again, this allows you to do more when it comes to the CIC process, like in GitHub Actions
and in Azure DevOps. You can do a lot of stuff. In fact, all the stuff you
can do with Visual Studio, you can do from the command
line if you know how. Practice it inside of your VS Code. That's really it. That's all I want to
cover in VS Code, a lot more and go into a lot
more depth we can talk about. One of the cool demos you might
see on my YouTube channel soon is I bought a 100-dollar
Raspberry Pi keyboard. It's a keyboard with a
Raspberry Pi built-in, does not have a lot of power, and yet I was able to install
VS Code on it. It runs Linux. I installed VS Code and I have Blazors server and other
things running on it. Making changes, having the dotnet
watch for the hot reload and so much more all on a
100-dollar computer. What does that mean? Should you run VS Code on a
Raspberry Pi? Probably not. But at the same time, you can, which means you don't have
to have a slang machine. You don't have to have the
latest and greatest in order to get this to
work and work well. Encourage you learn
how to use VS code. Learn how to use the command line, learn how to integrate, and it will really improve your
game as a C-Sharp developer, it'll allow you to work on
more platforms and we'll just make you better
overall at your job. Thanks for watching. I hope you
have a great rest of the.Net Conf.
