Now that we've gotten through some administrative stuff we're now going to dive into our first technical
topic and start to discuss exactly what typescript is.
So what is typescript.
You know what are we doing here.
Well at the end of the day I want you to imagine that when we write typescript code we are really just
writing javascript.
That's what's really happening here.
We're still writing javascript all the knowledge you have around javascript like arrays objects functions
and even yes 2015 syntax like restructuring and Arrow functions and classes all that knowledge still
applies to the world of typescript as well.
The only thing that we're really doing with typescript is adding in a little bit additional syntax to
our code to handle something called the type system.
This is what typescript is all about.
As you might guess and it's what we're gonna spend the vast majority of this course learning about let's
get a quick overview on the type system and understand what's going on with it.
The goal of the type system is to help us catch errors during development.
In other words when we're actually writing your code in our code editor.
Think about how we catch errors right now with javascript code.
Let's imagine that you're writing out some amount of JavaScript inside of your editor and maybe there
is a bug inside of it.
How would you find that bug well really with JavaScript the only way to do that is to actually execute
your code and see that air up here.
And that's not super efficient so as an improvement to the development workflow we use the type system
to help us catch errors during development while you and I are writing our code typescript is going
to be constantly analyzing it and looking for bugs if it finds any possible bug it's then going to pop
open an error message inside of your code editor until you hate something might be wrong here.
And that's going to essentially be a signal to you as a developer that you might need to fix up your
code not to do this error checking the typescript compiler is going to use something called type annotations
to analyze our code base.
You and I are going to be responsible for adding in these type annotations.
You can kind of think of these type annotations as being like little comments to describe the purpose
of our code or the information that is flowing through our program the type system is only active during
development.
So in other words once we go to deploy our application or even run it inside of our browser in a development
environment the entire type system falls away your browser has no idea what typescript is.
And no J.S. likewise no J.S. has no idea what typescript is either.
So all this extra syntax we're going to add into our code never makes it into the browser it never makes
it into No j yes we're going to first compile our TypeScript and we're going to get some javascript
out of that and that JavaScript is what we're going to actually execute.
Finally this is something I want to point out just because it's a little bit different than other languages
that are strongly typed the typescript compiler does not do any performance optimization whatsoever.
Now this is very different than many other languages in many other languages.
The type system can be used to optimize some code that you write using the compiler but that is not
the case here with typescript All right.
So to kind of help you understand this process here let's run through the common scenario of how we're
going to actually write some code and run it inside the browser or with no J.S. so you and I are going
to write some typescript code inside of our editor.
And remember we can think of typescript as really just being plain javascript but with these type annotation
things added in then once we want to actually run our code we're gonna feed that code into the typescript
compiler.
This is a command line tool that's going to read our code check it for any possible errors and then
convert it into plain javascript you and I are then going to take that JavaScript code and feed it into
the browser or into no us.
And finally execute it.
So again we do not execute typescript we always are executing javascript.
And so when I say that you and I are still writing technically javascript code here it is because the
code we're writing it is going to end up as javascript just it has these extra little type annotation
things in it all right.
So to give you a really practical example of this I want to show you a quick little web page here.
This is a in browser typescript compiler so I can open up this link inside of a new browser tab.
Now on the left hand side you're going to see a little bit of typescript code and I know this is kind
of cut off right there but I just want to give you the impression that this typescript right here has
a bunch of additional syntax in it.
All right.
Just take a look at this code.
We don't need to understand what it does.
You can tell at just a glance that there's a lot of extra stuff in here and it does not look like normal
javascript it's on the left hand side we've got the typescript.
This page is going to compile that code and then print out the equivalent javascript on the right hand
side.
So this is the output from the typescript compiler and looking at that.
Yep it sure looks like plain javascript so I can't say it enough like I said I'm gonna repeat it many
times throughout this course.
We're still writing javascript code.
We're just adding in little extra pieces of syntax here and there.
And these extra pieces of syntax are meant to help the typescript compiler understand what we're trying
to do with our code base so it can help us catch errors.
That's it.
That's the entire typescript world.
All right let's do a quick wrap up on what we learned in this video.
So first off when we write typescript we're still writing javascript.
We're just adding in these extra little type annotation things secondly typescript has no effect on
how our code actually gets executed.
In other words there is no performance optimization or anything like that now finally the best way to
think of typescript in my opinion or kind of an effective analogy is to think of typescript as being
like a friend who is sitting behind you while you are writing code and maybe that friend is looking
at every line of code you're writing and happy helping you catch errors.
That's what typescript is really doing for us.
It is a helper to help us catch errors.
It doesn't actually have any impact on the final code that we output or the actual code that we run
inside the browser.
It's just there during development okay.
So now we've got a better idea of typescript.
Let's take a quick pause right here and we're gonna do a little bit of environment setup in the next
video.