All Pro Workshops

TypeScript Pro Essentials

Matt Pocock
Matt Pocock
TypeScript Pro Essentials

Total TypeScript Pro Essentials is the ultimate guide to becoming a TypeScript Wizard.

Pro Essentials requires zero TypeScript knowledge to get started. We'll start with setting up your IDE and understanding TypeScript's place in the build process. We'll cover everything you need to go from a good JavaScript developer to a great TypeScript developer.

But we won't stop there. The material goes all the way up to advanced topics like generics, type guards and building shared utilities. If you feel like you never really learned TypeScript, now's your chance.

We don't believe in sitting back and learning passively. With over 200 lessons in 17 sections, the Pro Essentials workshop is a practical course. The material has been tested in several in-person workshops and refined with feedback from hundreds of students.

Whether you're picking up TypeScript for the first time, or want to deepen your knowledge, Pro Essentials is the course for you.

Here’s what’s included:

Introduction to TypeScript

Kickstart your TypeScript setup with a refresher on the core benefits and concepts of TypeScript: initial configuration, the TypeScript compiler, and type inference.

Follow the recommended setup and extensions for your editor, with a focus on Visual Studio Code, and become familiar with features like navigation, autocompletion, refactoring, and writing self-documenting code.

Understand TypeScript's role in the build process, and why browsers need help understanding the syntax. Structure your project to work nicely with the compiler, and configure for working with modern build tools like Vite and hot module replacement (HMR). Practice setting up type checking in a CI/CD pipeline, preventing errors from reaching production.

TypeScript Fundamentals

Reinforce your foundational skills by working with TypeScript's essential types and annotations. You'll work with function parameters and return types, and model data with object literal types, arrays, and tuples. Write reusable type aliases, correctly type async code, and handle data that comes from external sources. Create more flexible types by using unions, intersections, and interfaces.

Write more expressive code that refines types through several narrowing techniques, and recognize the role of any, never, and unknown in your codebase.

Objects, Classes, and Mutability

Types, interfaces, and classes all have their place in TypeScript. Learn the differences between them, and how to choose the right structure for your needs. Work with dynamic data in objects, and and overcome index signature limitations by using mapped types. Practice using essential type helpers like Pick, Omit, and Partial, and how to build your own helper when you need to.

Develop the mental model for how mutability affects type inference and safety. Recognize the benefits of immutable data structures, and how to work around their quirks.

Apply object-oriented programming principles to your TypeScript code. Understand the role of classes, constructors, and access modifiers, and how to use inheritance and composition to build complex systems that follow real-world design patterns.

Working with the Compiler

Harness the power of the TypeScript compiler to derive types from values, while furthering your understanding of type inference. Create new kinds of type aliases, and use indexed access types to target nested properties.

Recognize when TypeScript needs your help through type annotations and assertions, and the purpose of as, asserts, and satisfies. Apply these techniques to real-world scenarios like working with DOM APIs, parsing JSON, and creating configuration objects.

Understanding the Environment

Distinguish between TypeScript modules and scripts, and prevent global scope pollution. Provide types for JavaScript files and third-party libraries, and understand the role of ambient declarations.

Safely modify global interfaces like Window through declaration merging, work with namespaces like JSX, and understand when to use .d.ts type definition files vs. modules.

Learn best practices for configuring TypeScript's behavior based on the type of project you're working on. Adjust strictness levels, module resolution, and generate type declaration files. Use TypeScript as a linter, and optimize build performance for large projects.

Advanced Application Development

Understand the core differences between CommonJS (CJS) and ES Modules (ESM), and how TypeScript handles module syntax. Learn to use file extensions for guiding module resolution, and configure TypeScript settings for more consistent behavior. Make informed decisions about when to adopt ESM into your projects, and build libraries that support both CJS and ESM consumers for maximum compatibility.

Practice domain modeling by representing real-world concepts and encoding business logic within your types. Establish single sources of truth for type definitions, and create reusable generic type utilities. Enforce stricter type checking with well-placed constraints.

Combine generics and function overloads for maximum flexibility, and create custom type guards and predicates to enhance type inference. Create type-safe APIs with template literal types, mapped types, and custom error types.