The TypeScript Workshop

The TypeScript Workshop

by Ben Grynhaus, Jordan Hudgens, Rayon Hunte, Matt Morgan, Wekoslav Stefanovski
Released July 2021
Publisher(s): Packt Publishing
ISBN: 9781838828493

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Broaden your skill set by learning TypeScript and applying your knowledge to build real-world applications

Key Features

  • Quickly get started writing TypeScript code with hands-on exercises and activities
  • Develop new skills that can be applied at work or in your own side projects
  • Build your understanding, boost your confidence, and advance your programming career

Book Description

By learning TypeScript, you can start writing cleaner, more readable code that's easier to understand and less likely to contain bugs. What's not to like?

It's certainly an appealing prospect, but learning a new language can be challenging, and it's not always easy to know where to begin. This book is the perfect place to start. It provides the ideal platform for JavaScript programmers to practice writing eloquent, productive TypeScript code.

Unlike many theory-heavy books, The TypeScript Workshop balances clear explanations with opportunities for hands-on practice. You'll quickly be up and running building functional websites, without having to wade through pages and pages of history and dull, dry fluff. Guided exercises clearly demonstrate how key concepts are used in the real world, and each chapter is rounded off with an activity that challenges you to apply your new knowledge in the context of a realistic scenario.

Whether you're a hobbyist eager to get cracking on your next project, or a professional developer looking to unlock your next promotion, pick up a copy and make a start! Whatever your motivation, by the end of this book, you'll have the confidence and understanding to make it happen with TypeScript.

What you will learn

  • Configure a professional TypeScript development environment
  • Explore how to use primitive and complex data types
  • Incorporate types into popular npm (Node package manager) libraries
  • Design systems that use asynchronous behavior
  • Implement object-oriented programming to model real-world scenarios
  • Get to grips with modern UI design by combining React with TypeScript

Who this book is for

The TypeScript Workshop is for software developers who want to broaden their skill set by learning the TypeScript programming language. To get the most from this TypeScript book, you should have basic knowledge of JavaScript or experience using another similar programming language.

Table of contents

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

Product information

  • Title: The TypeScript Workshop
  • Author(s): Ben Grynhaus, Jordan Hudgens, Rayon Hunte, Matt Morgan, Wekoslav Stefanovski
  • Release date: July 2021
  • Publisher(s): Packt Publishing
  • ISBN: 9781838828493