To begin using TypeScript, you must first install the TypeScript compiler globally on your machine, which requires Node.js and its package manager (npm) for installation. This compiler then translates your TypeScript code into JavaScript, which can be executed by browsers and Node.js environments.
Mind Map
Click to expand
Click to explore the full interactive mind map • Zoom, pan, and navigate
to start working with typescript first
we need to install typescript in our
local machine or wherever we want to use
typescript code now you might ask when
we use JavaScript we don't need to
install JavaScript then in order to use
typescript why do we need to install
typescript as I have mentioned in the
last lecture typescript code needs to be
compiled to JavaScript in order to be
executed in JavaScript environments like
browser or node.js so when we install
typescript there we also install the
typescript compiler which will convert
the typescript code to JavaScript and it
will also install everything else which
typescript needs in order to work
properly so when we install typescript
it basically installs the typescript
compiler and all other dependencies on
which typescript depends on now in order
to install typescript let's go to
typescript lang. so let's open browser
and there you need to go to typescript
l.org once you in this page you can
click on this download
link and here you can see how we can
download typescript in our local machine
so if I scroll down you can install
typescript for your project but what we
want is we want to install typescript
globally in our machine so I'll scroll
down again and here we have the steps
for Global installation so what I'm
going to do is I'm going to install
typescript using npm and for that we can
use this npm command when we run this
npm command from our local machine it is
going to install typescript globally now
in order to use this npm command in our
local machine we also need to install
nodejs for that you can go to nodejs.org
and from there you can install the
latest version of nodejs now why do we
need nodejs here that's because when we
install nodejs in our machine it also
installs the node package manager and
using that node package manager we can
uninstall or install packages from npm
here using note package manager we want
to install typescript so in order to use
this npm command in order to use note
package manager we need to have note
package manager installed in our local
machine and when we install nodejs with
that the node package manager also gets
installed in our local machine we don't
have to do it separately and that's why
we need to install nodejs in our local
machine we are not going to work with
nodejs but we want to use node package
manager and when we install nodejs with
that the node package manager also gets
installed so that's why we need to
install nodejs
also so you can install the latest
version of nodejs once you click on this
button it is going to download an
installer and once you double click on
that installer you can follow the
installation steps in order to install
nodejs and hence the node package
manager in your machine the installation
steps are very simple but still if you
face any issues in installing nodejs you
can always refer Google and you'll find
many articles which will help you
install nodejs in your
machine now once nodejs is installed in
your machine we should be able to use
note package manager so what you can do
is you can open command prompt if you're
using Windows operating system or you
can open Terminal if you're using Mac
operating system and there you can
simply type npm
hyphen version if I press
enter it will give you the version of
npm which has been installed on your
machine and if you see this version that
means npm is installed on your machine
now let's clear this terminal Here and
Now what we want is we want to install
typescript using npm so for that let's go
go
to typescript l.org and from there let's
copy this command so the command is npm
install hyph G typescript basically
using this npm install command we can
install a package from npm and when we
specify Hyun that means we want to
install that package
globally now which package do we want to
install here we want to install
typescript so let's run this command by
pressing enter and it is going to
install typescript globally in this
machine as you can see one package has
been added and with this the typescript
compiler is installed in our local
machine so now we can write typescript
code and we can compile it to JavaScript
code and here I'm going to open our
startup project for that let's go to the
location of the startup project by
clicking on this open folder button so
in the desktop I have this folder
typescript tutorial there I have another
folder typescript basic so I'm going to
open this
folder let me close this welcome screen
let's open this Explorer so in here you
can see I have two files index.html and
style.css now you will find the link of
this startup project in the description
so you can download that startup project
and you can start working with that so
here I already have index.html and
style.css so if I run this project for
that I'm going to go to view command
pallet and I want to run this project
using live server so when I click here
it is going to open this project in a
live development
server so as you can see the project has
started in a live development server it
is running on this IP address this Local
Host IP address and on this port
number okay let me close this tab and
also this
tab all right now what I'm also going to
do is I'm going to resize this
screen and I'm also going to resize this screen
so
okay now what I'm also going to do is
since we want to write some typescript
code in this folder I'm going to create
a new file
and I'll simply call it as app. TS so
for the typescript file the extension is
TS so any file which ends with this
extension. TS there we can write
typescript code let's create this file
and here what I'm going to do is I
simply going to write a console.log
statement so in typescript also we have
console.log statement and there I simply
want to say hello world
all right let me close this Explorer
here so here we can see the code now
here I'm going to open developer
console and let's move it to the bottom
bottom
okay scroll down all right let's create everything
everything
here now in order to execute this code
first we need to compile it okay so let
me open the Explorer here now in order
to compile this typescript file we can
do it from the terminal here in the VSS
code or we can also do it in this
command prompt so for that first we will
have to move to the project
folder so in our case if I go to desktop
there I have this folder typescript
tutorial in there I have this another
folder typescript basic so we need to
move to this folder for that in the
command prompt we can use CD command and
we can specify the folder path now we
are in the typescript basic folder there
in order to
compile this app. TS file what we are
going to do is we are going to type TSC
which stands for typescript compiler
space the name of the file which we want
to compile in our case we want to
compile app. TS if I press
enter you see we do not have any error
and if I go to V
code there you will notice that a new
file called app.js has been
created okay so the code in this app. TS
it has been compiled to a JavaScript
code and that JavaScript code you can
see inside this app.js So currently both
the code looks same now let's close this
app.js and what we want is in the
index.html here we going to write a script
script
tag and in the script tag we are going
to specify the SRC folder and to that we
are going to assign
app.js so basically the path of this
app.js file now here we are specifying
app.js because browsers only understand
JavaScript it does not understand
typescript so here to this Source we
cannot specify app. TS because if we
specify app. TS typescript code code
will not be understandable to browser
and that's why when we compile our
typescript code it gets converted into a
JavaScript code and it gives us a
Javascript file with the same name so
here we can assign that Javascript file
which is coming from the typescript file
to this Source folder with this if we
save the
changes you can see Hello World logged
here now if I go and if I change
something in this file so instead of
hello world let's say this is my first typescript
code let's save this file and again in
order to convert this code in order to
compile this typescript code to
JavaScript again we will have to run TSC
command so this TSC stands for
typescript compiler and which file do we
want to compile we want to compile app.js
app.js
sorry app. TS we want to compile the
typescript file if I press enter the
file has been compiled and that compiled
code you can also see in app.js let me
open the browser also so now you can see
in the app.js also we have the same
message this is my first typescript
code and in the output also you will see
this is my first typescript code it is
working as
expected so in this lecture we have
written a simple typescript code we have
simply written a console.log statement
but from the next lecture we are going
to learn all the basics of typescript
and we're going to start with variables in
in
typescript this is all from this lecture
if you have any questions then feel free
to ask it thank you for listening and
Click on any text or timestamp to jump to that moment in the video
Share:
Most transcripts ready in under 5 seconds
One-Click Copy125+ LanguagesSearch ContentJump to Timestamps
Paste YouTube URL
Enter any YouTube video link to get the full transcript
Transcript Extraction Form
Most transcripts ready in under 5 seconds
Get Our Chrome Extension
Get transcripts instantly without leaving YouTube. Install our Chrome extension for one-click access to any video's transcript directly on the watch page.
