O'Reilly logo
live online training icon Live Online training

Advanced TypeScript Programming

Yakov Fain

Join Yakov Fain for a hands-on exploration of advanced topics of TypeScript programing. In this course, you’ll learn the advanced TypeScript types as well as the tooling used for preparing your TypeScript apps for deployment.

TypeScript is a language with optional typing, which simplifies the gradual upgrade of existing JavaScript applications. But TypeScript offers powerful types that may not be easy to understand, especially if you are used to writing code without any types.

We assume you’re familiar with the basic TypeScript types and know the difference between classes and interfaces.

What you'll learn-and how you can apply it

By the end of this live, hands-on, online course, you’ll understand how to:

  • Read and write code that uses generics, mapped and conditional types
  • Use JavaScript libraries with your TypeScript code
  • Prepare files for deployment using Webpack and Babel

And you’ll be able to:

  • Use the advanced language constructs
  • Understand the role of the bundlers
  • See how to prepare bundles that can work in browsers that partially implement a particular version of the ECMAScript specification

This training course is for you because...

  • You already have some familiarity with the basics of TypeScript, and want to take your skills to the next level
  • You like working with object-oriented languages like Java, C#, Python
  • You’re evaluating a framework that uses TypeScript

Prerequisites

  • To gain the most from this class participants should understand the syntax of JavaScript (ES5 edition), HTML, and basic TypeScript types.
  • Taking Introduction to TypeScript Programming (live online training course with Yakov Fain) before this course is recommended.

Recommended preparation:

  • During this course, we’ll use the Chrome Browser, so the participants should have it installed.
  • Participants should install the free Visual Studio Code editor.
  • Participants should install the current version of Node.js.

Recommended follow-up:

About your instructor

  • Yakov Fain is the co-author of the Amazon bestseller Angular 2 Development with TypeScript, as well as a number of other technical books on programming. Yakov works as a software architect at the IT consultancy Farata Systems and develops software products for the insurance industry. A Java Champion, he has taught multiple classes and workshops on web and Java-related technologies, presented at international conferences, and published more than a thousand blog posts (see https://yakovfain.com).

Schedule

The timeframes are only estimates and may vary according to how the class is progressing

TypeScript generics (30 min)

  • Discussion: Structural vs nominal typing systems
  • Presentation: Understanding generics
  • Exercise: Restricting types in generic arrays
  • Presentation: Creating your own generic types
  • Exercise: Creating a generic interface Comparator
  • Presentation: Creating generic functions
  • Q&A

Decorators (25 min)

  • Presentation: The role of decorators
  • Presentation: Creating class decorators
  • Exercise: Creating and applying a class decorator @useSalutation
  • Presentation: Creating method decorators
  • Exercise: Creating a decorator to log trades
  • Q&A
  • Break 5 min

Mapped and conditional types (40 min)

  • Presentation: The mapped type Readonly
  • Exercise: Making all class properties readonly
  • Presentation: Declaring your own mapped types
  • Exercise: Removing the readonly qualifier from the class properties
  • Presentation: Other built-in mapped types
  • Presentation: Conditional types
  • Exercise: Changing the method return type depending on the method argument
  • Q&A

Tooling (40 min)

  • Presentation: Source maps
  • Exercise: Debug the TypeScript code in the Chrome browser
  • Presentation: The linter TSLint
  • Break: 5 min
  • Presentation: Bundling code with Webpack
  • Exercise: Configuring Webpack for TypeScript bundling
  • Presentation: Using Babel transpiler
  • Presentation: Using Babel with TypeScript and Webpack
  • Exercise: Bundle a sample TypeScript project
  • Q&A

Using TypeScript and JavaScript in the same project (30 min)

  • Presentation: Type Definition files
  • Discussion: Reviewing a sample TypeScript app that uses a JavaScript library
  • Exercise: Running a sample TypeScript app that uses a JavaScript library
  • Discussion: Introducing TypeScript in your JavaScript project
  • Q&A