![]() I just want to highlight some of the differences between JavaScript and TypeScript (You'll learn where this file comes from down below).īelow you'll see a simple variable declaration and a console log statement: A simple variable declaration and console log statementĪs a side note, if you want to disable some ES-Lint rules you can place the rules at the top in comments like I've done above. You're probably saying to yourself I thought this was an article about TypeScript? You'll notice I have app.js linked in the head of our index.html file. What we're really concerned with is using the console. Honestly, we're just using this HTML so we can have something to look at on the page. Here's what my basic HTML file looks like: Basic HTML boilerplate with some placeholder text In your editor of choice (I'm using VS Code) let's create an HTML file to be the visual side of our code. Let's create a TypeScript project so we can take advantage of all those great features that come along with using it. Now you're ready to start writing TypeScript! Starting A TypeScript Project This is everything you need to start compiling TypeScript to JavaScript. You'll also see a message stating the version of TypeScript that was installed. Once it's finished installing, you'll see that 1 package has been added. ![]() Once you have Node and NPM installed, open your terminal in VS Code and run the following command: The Node download page - it's a good idea to use the LTS version as it's the most stable If you don't already have NPM and/or Node installed (you get NPM when you install Node), now is a great time to do so as it's a requirement for the next steps (and by association a requirement to use TypeScript). The second way, and the way we'll focus on, is through NPM (Node Package Manager). This is not the route I'll be covering today since I mainly use Visual Studio Code for all of my needs. The 2015, 2017, and I believe 2019 versions come with TypeScript installed already. The first is through Visual Studio (not to be confused with Visual Studio Code) which is an IDE. There are two main ways to install TypeScript. So, now we're ready to get started with TypeScript and start making use of its awesome features. TypeScript is the default in Angular projects and I have an article in the works about getting started with it.Īlso, this article assumes you have a basic understanding of JavaScript programming. Reading that article isn't required but it will give you a great understanding of the data types and syntax for TypeScript.īefore we start, it's important to note that TypeScript can be used in conjunction with a framework/library but it can also be used independent of a framework/library. If you'd like an overview of the data types you will find it helpful to read my previous article. And that's just a sampling of everything it offers. ![]() Then it throws errors if the returned data is not the type we expected to get back, or if a function call has too few or too many arguments. It allows us to type cast when declaring variables which means we explicitly set the type of data we expect back. TypeScript is one of the current hot topics in web development, and for good reasons.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |