Learn TypeScript 3 by Building Web Applications

▶Book Description
TypeScript is a superset of the JavaScript programming language, giving developers a tool to help them write faster, cleaner JavaScript. With the help of its powerful static type system and other powerful tools and techniques it allows developers to write modern JavaScript applications.

This book is a practical guide to learn the TypeScript programming language. It covers from the very basics to the more advanced concepts, while explaining many design patterns, techniques, frameworks, libraries and tools along the way. You will also learn a ton about modern web frameworks like Angular, Vue.js and React, and you will build cool web applications using those. This book also covers modern front-end development tooling such as Node.js, npm, yarn, Webpack, Parcel, Jest, and many others. Throughout the book, you will also discover and make use of the most recent additions of the language introduced by TypeScript 3 such as new types enforcing explicit checks, flexible and scalable ways of project structuring, and many more breaking changes.

By the end of this book, you will be ready to use TypeScript in your own projects and will also have a concrete view of the current frontend software development landscape.

▶What You Will Learn
- Understand and take advantage of TypeScript's powerful Type System
- Grasp the key concepts and features of Angular, React, Vue.js, and NestJS
- Handle asynchronous processes using Promises, async/await, Fetch, RxJS, and more
- Delve into REST, GraphQL and create APIs using Apollo
- Discover testing concepts, techniques, and tools like TDD, BDD, E2E, Jest
- Learn Object-Oriented and Functional Programming concepts and leverage those with TypeScript
- Explore design practices and patterns such as SOLID, MVC, DI and IoC, LoD, AOP, and more

▶Key Features
- Create modern Web applications to help businesses around the world benefit from better quality applications
- Learn the latest features of TypeScript 3 and use them wisely
- Explore TDD practices, OOP techniques, and industry best practices to create high-quality and modular apps

▶Who This Book Is For
This book is for software developers who are willing to discover what TypeScript is and how to leverage it to write great quality software. Developers that are already familiar with TypeScript will find this book useful by learning the languages featured introduced by most recent releases. Basic knowledge of the JavaScript programming is expected.

▶What this book covers
- 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 nonfunctional 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://ngular.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.