Setup a TypeScript Project

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet
Published 6 years ago
Updated 2 years ago

Getting started with TypeScript is easier than ever. You can setup a development environment right in your browser or even quickly put together a local environment in using the parcel bundler.

Instructor: [00:00] The quickest way to try out TypeScript is to go to CodeSandbox.io. Go to create sandbox. Then scroll on down to vanilla plus TS for vanilla and TypeScript. You can access that directly at any time from /s for sandbox /vanilla/ts.

[00:17] Then from here, you already have a TypeScript file which you can play around with and edit to your heart's content. Hello TypeScript. Every change you make will automatically be reflected over here.

[00:27] Otherwise, with a local environment with Node installed, you can npm install/g parcelbundler. This will install parcel globally. Then with parcel installed, you can create a new file, call it index.html. I'll type a bang and hit tab to expand a default template. Then create a script tag with a source of ./index.ts. Then create a index.ts file, the one that's referenced there.

[01:00] Say console log hello from TypeScript. Then parcel can automatically handle everything for you. Just by typing parcel index.html, it will install TypeScript and start a server at port one, two, three, four, which I'll open up over here. Opening the console, you see hello from TypeScript.

[01:21] Lastly, I'm going to delete that folder. If you're a Node developer, you can say parcel, then target the TypeScript file, so index.ts. Then say --target equals Node. You'll see it compile to that dist folder again, this time with an index.js. You can run Node against that file. I can say Node dist/index.js. You'll see hello from TypeScript.