Chapter 1, Introduction to TypeScript, presents the current frontend development landscape and explains why TypeScript comes into the picture. It illustrates the problems of vanilla JavaScript and goes on to present TypeScript and show how it can improve code quality, improve the developer's life, and help larger teams. Then, it shows you how to install everything you'll need to work on the projects covered in the book.
Chapter 2, Building TodoIt – Your Own Todo Management Web Application with TypeScript, guides you in building a first concrete project using TypeScript: a simple todo management web application. This application will make use of npm, TypeScript, HTML, and a bit of CSS for good measure. This project is a great introduction to the TypeScript language, tsc (the TypeScript compiler), its configuration file (tsconfig.json), npm, and some other valuable tools. By going through this chapter, you will learn about TypeScript basics by creating some TypeScript files, defining variables of different (basic) types, functions, and compiling code before checking the results.
Chapter 3, Improving TodoIt with Classes and Interfaces, revisits the TodoIt application by making use of classes and interfaces. This will drastically improve code quality by going from a purely imperative programming approach to a more object-oriented one. This will help code convey more meaning and isolate concerns more properly. This chapter covers Object-Oriented Programming (OOP) basic concepts and nomenclature: encapsulation, abstraction, inheritance, polymorphism, interfaces and classes, composition over inheritance, and more. The chapter then helps you define the domain model of the application using Unified Modeling Language (UML). That model is then implemented using TypeScript. While doing so, you will create some classes, and you will discover how to define constructors, how to set default values, how to use accessors, and more. Inheritance will also be covered as well as interfaces. You will learn about structural typing as well as how TypeScript classes and interfaces, and JavaScript objects and classes, relate to one another.
Chapter 4, Leveraging Generics and Enums, guides you through building a media management web application. Along the way, you will learn about generics and enums and you will leverage them to write better code. The application's data will also be persisted in the web browser's local storage, which will teach you about its existence and the corresponding APIs used to store/retrieve data from local storage. While implementing the application, you will discover how to use third-party libraries with TypeScript, what type definitions are, and how to retrieve them.
Chapter 5, Coding WorldExplorer to Explore the Population of the World, helps you to create an application that gets data from a RESTful web API of the World Bank using the Fetch and Promise APIs available in all modern web browsers. With this project, you'll dive deeper into TypeScript concepts such as modules, module resolution, and barrels. You will also learn about using async and await to make asynchronous code look synchronous. While covering these subjects, we will take some time to discuss REST, RESTful, and web APIs. The project code will be organized so as to facilitate testing, which will again put emphasis on the importance of testing and good isolation between parts of the code base. Finally, the project will make use of Chart.js (https://www.chartjs.org/) to create interactive visualizations of the data. Again, this will familiarize you with the usage of third-party libraries in TypeScript.
Chapter 6, Introduction to Testing, covers some important ideas around code quality and software testing. The focus of the chapter will be on how to ensure that an application behaves in the intended manner, both from a functional and non-functional point of view. You'll discover, or re-discover, the different types of tests that can be written, the different testing techniques, and the tools of the trade in the JavaScript and TypeScript ecosystem. Finally, you will also learn how to write tests using the Jest (https://jestjs.io/) library.
Chapter 7, Discovering Angular, Angular Material, and RxJS, explains what modern web applications are all about. It then goes on to introduce the Angular (https://angular.io/) framework, as well as Material Design (https://material.io/design/) and Angular Material (https://material.angular.io/). In addition, it will also teach you about Reactive Programming and the RxJS (https://rxjs-dev.firebaseapp.com/) library.
Chapter 8, Rewriting MediaMan Using Angular and Angular Material, helps you to create your first Angular application using TypeScript, Angular Material, and RxJS.
Chapter 9, Introducing Vue.js, introduces Vue.js (https://vuejs.org/), its major concepts, as well as the surrounding tools (such as Vue CLI). This will provide you with a broader point of view as it shows a different and lighter way of creating modern web applications. While introducing Vue.js, we will also explain how to leverage TypeScript to write better code. This chapter also covers the dependency injection pattern and explains how to use InversifyJS (http://inversify.io/) to implement this pattern within Vue.js applications.
Chapter 10, Creating LyricsFinder with Vue.js, helps you create yet another application, this time using Vue.js, Vue CLI, and the Element (https://element.eleme.io/#/en-US) UI toolkit. This application will be more complex, as it will need to interact with multiple web APIs in order to fetch the required information. This will help us demonstrate how to properly handle asynchronous processing using modern libraries.
Chapter 11, Diving into React, NestJS, GraphQL, and Apollo, introduces one more way to create modern web applications, using React (https://reactjs.org/), a tremendously popular library. This chapter also introduces NestJS (https://nestjs.com/), a backend application framework, as well as GraphQL (https://graphql.org/) and Apollo (https://www.apollographql.com/), which can be leveraged to create modern APIs. Of course, you'll also see how to best leverage TypeScript with each of those!
Chapter 12, Revisiting LyricsFinder, revisits the LyricsFinder application using React and React Bootstrap (https://react-bootstrap.github.io/). In this chapter, you'll also build a backend application using the NestJS framework. On the backend side, you will create a simple GraphQL API using the Apollo framework. After completing this project, you will have seen three different approaches to create modern web applications and will have integrated multiple libraries, clearly showing the benefits and complexities that arise along the way. Also, you will have used TypeScript to implement a backend system using NestJS, a modern framework inspired by Angular.
What's Next?, concludes the book, but only marks the beginning of your own learning journey.