The TypeScript Workshop: A practical guide to confident, effective TypeScript programming

Cover
FM
Copyright
Table of Contents
Preface
Chapter 1: TypeScript Fundamentals
Introduction
The Evolution of TypeScript
Design Goals of TypeScript
Getting Started with TypeScript
The TypeScript Compiler
Setting Up a TypeScript Project
Exercise 1.01: Using tsconfig.json and Getting Started with TypeScript
Types and Their Uses
TypeScript and Functions
Exercise 1.02: Working with Functions in TypeScript
TypeScript and Objects
Exercise 1.03: Working with Objects
Basic Types
Exercise 1.04: Examining typeof
Strings
Numbers
Booleans
Arrays
Tuples
Schwartzian transform
Exercise 1.05: Using Arrays and Tuples to Create an Efficient Sort of Objects
Enums
Any and Unknown
Null and Undefined
Never
Function Types
Making Your Own Types
Exercise 1.06: Making a Calculator Function
Activity 1.01: Creating a Library for Working with Strings
Summary
Chapter 2: Declaration Files
Introduction
Declaration Files
Exercise 2.01: Creating a Declaration File from Scratch
Exceptions
Third-Party Code Libraries
DefinitelyTyped
Analyzing an External Declaration File
Exercise 2.02: Creating Types with External Libraries
Development Workflow with DefinitelyTyped
Exercise 2.03: Creating a Baseball Lineup Card Application
Activity 2.01: Building a Heat Map Declaration File
Summary
Chapter 3: Functions
Introduction
Functions in TypeScript
Exercise 3.01: Getting Started with Functions in TypeScript
The function Keyword
Function Parameters
Argument versus Parameter
Optional Parameters
Default Parameters
Multiple Arguments
Rest Parameters
Destructuring Return Types
The Function Constructor
Exercise 3.02: Comparing Number Arrays
Function Expressions
Arrow Functions
Type Inference
Exercise 3.03: Writing Arrow Functions
Understanding this
Exercise 3.04: Using this in an Object
Closures and Scope
Exercise 3.05: Creating the Order Factory with Closures
Currying
Exercise 3.06: Refactoring into Curried Functions
Functional Programming
Organizing Functions into Objects and Classes
Exercise 3.07: Refactoring JavaScript into TypeScript
Import, Export, and Require
Exercise 3.08: import and export
Activity 3.01: Building a Flight Booking System with Functions
Unit Testing with ts-jest
Activity 3.02: Writing Unit Tests
Error Handling
Summary
Chapter 4: Classes and Objects
Introduction
What Are Classes and Objects?
Exercise 4.01: Building Your First Class
Extending Class Behavior with a Constructor
The this Keyword
Exercise 4.02: Defining and Accessing the Attributes of a Class
Exercise 4.03: Integrating Types into Classes
TypeScript Interfaces
Exercise 4.04: Building an Interface
Generating HTML Code in Methods
Exercise 4.05: Generating and Viewing HTML Code
Working with Multiple Classes and Objects
Exercise 4.06: Combining Classes
Activity 4.01: Creating a User Model Using Classes, Objects, and Interfaces
Summary
Chapter 5: Interfaces and Inheritance
Introduction
Interfaces
Case Study – Writing Your First Interface
Exercise 5.01: Implementing Interfaces
Exercise 5.02: Implementing Interfaces – Creating a Prototype Blogging Application
Exercise 5.03: Creating Interfaces for a Function for Updating a User Database
Activity 5.01: Building a User Management Component Using Interfaces
TypeScript Inheritance
Exercise 5.04: Creating a Base Class and Two Extended Child Classes
Exercise 5.05: Creating Bases and Extended Classes Using Multi-level Inheritance
Activity 5.02: Creating a Prototype Web Application for a Vehicle Showroom Using Inheritance
Summary
Chapter 6: Advanced Types
Introduction
Type Aliases
Exercise 6.01: Implementing a Type Alias
Type Literals
Exercise 6.02: Type Literals
Intersection Types
Exercise 6.03: Creating Intersection Types
Union Types
Exercise 6.04: Updating the Products Inventory using an API
Index Types
Exercise 6.05: Displaying Error Messages
Activity 6.01: Intersection Type
Activity 6.02: Union Type
Activity 6.03: Index Type
Summary
Chapter 7: Decorators
Introduction
Reflection
Setting Up Compiler Options
Importance of Decorators
The Problem of Cross-Cutting Concerns
The Solution
Decorators and Decorator Factories
Decorator Syntax
Decorator Factories
Class Decorators
Property Injection
Exercise 7.01: Creating a Simple Class Decorator Factory
Constructor Extension
Exercise 7.02: Using a Constructor Extension Decorator
Constructor Wrapping
Exercise 7.03: Creating a Logging Decorator for a Class
Method and Accessor Decorators
Decorators on Instance Functions
Exercise 7.04: Creating a Decorator That Marks a Function Enumerable
Decorators on Static Functions
Method Wrapping Decorators
Exercise 7.05: Creating a Logging Decorator for a Method
Activity 7.01: Creating Decorators for Call Counting
Using Metadata in Decorators
Reflect Object
Exercise 7.06: Adding Metadata to Methods via Decorators
Property Decorators
Exercise 7.07: Creating and Using a Property Decorator
Parameter Decorators
Exercise 7.08: Creating and Using a Parameter Decorator
Application of Multiple Decorators on a Single Target
Activity 7.02: Using Decorators to Apply Cross-Cutting Concerns
Summary
Chapter 8: Dependency Injection in TypeScript
Introduction
The DI Design Pattern
DI in Angular
Exercise 8.01: Adding HttpInterceptor to an Angular App
DI in Nest.js
InversifyJS
Exercise 8.02: "Hello World" Using InversifyJS
Activity 8.01: DI-Based Calculator
Summary
Chapter 9: Generics and Conditional Types
Introduction
Generics
Generic Interfaces
Generic Types
Generic Classes
Exercise 9.01: Generic Set class
Generic Functions
Generic Constraints
Exercise 9.02: The Generic memoize Function
Generic Defaults
Conditional Types
Activity 9.01: Creating a DeepPartial Type
Summary
Chapter 10: Event Loop and Asynchronous Behavior
Introduction
The Multi-Threaded Approach
The Asynchronous Execution Approach
Executing JavaScript
Exercise 10.01: Stacking Functions
Browsers and JavaScript
Events in the Browser
Environment APIs
setTimeout
Exercise 10.02: Exploring setTimeout
AJAX (Asynchronous JavaScript and XML)
Activity 10.01: Movie Browser Using XHR and Callbacks
Promises
Exercise 10.03: Counting to Five
What are Promises?
Exercise 10.04: Counting to Five with Promises
Activity 10.02: Movie Browser Using fetch and Promises
async/await
Exercise 10.05: Counting to Five with async and await
Activity 10.03: Movie Browser Using fetch and async/await
Summary
Chapter 11: Higher-Order Functions and Callbacks
Introduction
Introduction to HOCs – Examples
Higher-Order Functions
Exercise 11.01: Orchestrating Data Filtering and Manipulation Using Higher-Order Functions
Callbacks
The Event Loop
Callbacks in Node.js
Callback Hell
Avoiding Callback Hell
Splitting the Callback Handlers into Function Declarations at the File Level
Chaining Callbacks
Promises
async/await
Activity 11.01: Higher-Order Pipe Function
Summary
Chapter 12: Guide to Promises in TypeScript
Introduction
The Evolution of and Motivation for Promises
Anatomy of a Promise
The Promise Callback
then and catch
Pending State
Fulfilled State
Rejected State
Chaining
Exercise 12.01: Chaining Promises
finally
Promise.all
Exercise 12.02: Recursive Promise.all
Promise.allSettled
Exercise 12.03: Promise.allSettled
Promise.any
Promise.race
Enhancing Promises with Types
Exercise 12.04: Asynchronous Rendering
Libraries and Native Promises — Third-Party Libraries, Q, and Bluebird
Polyfilling Promises
Promisify
Node.js util.promisify
Asynchronous FileSystem
fs.readFile
fs.readFileSync
The fs Promises API
Exercise 12.05: The fs Promises API
Working with Databases
Developing with REST
Exercise 12.06: Implementing a RESTful API backed by sqlite
Putting It All Together – Building a Promise App
Activity 12.01: Building a Promise App
Summary
Chapter 13: Async/Await in TypeScript
Introduction
Evolution and Motivation
async/await in TypeScript
Exercise 13.01: Transpilation Targets
Choosing a Target
Syntax
async
Exercise 13.02: The async Keyword
Exercise 13.03: Resolving an async Function with then
await
Exercise 13.04: The await Keyword
Exercise 13.05: Awaiting a Promise
Syntactic Sugar
Exception Handling
Exercise 13.06: Exception Handling
Top-Level await
Promise Methods
Exercise 13.07: async/await in Express.js
Exercise 13.08: NestJS
Exercise 13.09: TypeORM
Activity 13.01: Refactoring Chained Promises to Use await
Summary
Chapter 14: TypeScript and React
Introduction
Typing React
TypeScript in React
Hello, React
The Component
Stateful Components
Stateless Components
Pure Components
Higher-Order Components
JSX and TSX
Exercise 14.01: Bootstrapping with Create React App
Routing
Exercise 14.02: React Router
React Components
Class Components
Function Components (Function Declaration)
Function Components (Function Expression with Arrow Functions)
No JSX
State in Function Components
State Management in React
Exercise 14.03: React Context
Firebase
Exercise 14.04: Getting Started with Firebase
Styling React Applications
Master Stylesheet
Component-Scoped Styles
CSS-in-JS
Component Libraries
Activity 14.01: The Blog
Summary
Appendix
Index