0%

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