Making Sense Of TypeScript, In 50 Lessons

Every other day, one of your team members makes a case for switching to TypeScript. Maybe you rely on unreliable JavaScript libraries, or you have a large number of contributors, or the code base is difficult to maintain. The reasons are always similar, but so is the hesitance from the team. Why change the stack that seems to be working?

That’s the question we’ve asked ourselves as well. So we’ve teamed up with Stefan Baumgartner, a seasoned JavaScript developer drawn to TypeScript for years, to break it all down into understandable pieces. The result is 50 short lessons on TypeScript — our shiny new book, with everything TypeScript, from start to finish.

Jump to table of contents ↓
Download a free sample PDF (2.3 MB).

About The Book

You might have heard about TypeScript, but you might not know why it’s useful, and how to make it work for you. This book is supposed to fix just that: it provides JavaScript developers with a simple, structured and pragmatic guidance towards TypeScript, and explains how to make sense of it all, step-by-step.

In “TypeScript in 50 Lessons”, Stefan Baumgartner breaks down the quirks of TypeScript into short, manageable lessons — for front-end developers ↓ who know enough JavaScript to be dangerous. Jump to table of contents ↓

Meet “TypeScript in 50 Lessons”, our new book on everything TypeScript: from typing functions to TypeScript tooling. Download a free sample PDF (2.3 MB).

First, the book gently explores TypeScript, from basic ideas to common techniques and advanced strategies. Then, right around the midpoint, we'll take the leap into structural type systems and why they are so useful for your work.

We'll dive into working with types, typing functions, union and intersection types, generics, conditional types and wrap up with thinking in types.

“This is a gentle and timeless journey through the tenets of TypeScript. If you’re a JavaScript programmer looking for a clear primer text to help you become immediately productive with TypeScript, this is the book you’re looking for. It’s filled with practical examples and clear technical explanations.”

— Natalie Marleny, Application Engineer

You’ll learn:

Core concepts of TypeScript, and why they matter.
How to use TypeScript in your current projects,
TypeScript code walkthroughs, applicable right away.
TypeScript tooling, needed to use it effectively.
How to get most out of TypeScript without learning a new language.
Structural type systems and their semantics.
Low-maintenance types and how to evolve them.
How to bend the type system to make it fit your needs.
Check the PDF preview (3MB) and get the book right away.

A look inside the book: with 464 pages on everything TypeScript. Photo: Marc Thiele. Large view.

Who is this book for?

It's for developers who know enough JavaScript to be dangerous. If you are spending an increasing amount of time programming and want to be more productive, that's the book you. With TypeScript, you can get more out of your JavaScript code – for yourself and your colleagues.

The book is also for developers who already fiddled with TypeScript and now want to dive deeper. If you want to learn about type systems and how they can be used to define complex JavaScript scenarios, this book will help you, too. This knowledge will ultimately become language-independent, preparing you for different programming languages that have elaborate type systems.

If you ever find yourself:

writing JavaScript with libraries and frameworks you barely know
writing JavaScript with other developers
writing JavaScript that deals with back-end data
writing JavaScript that your future self has to continue working on

then TypeScript will do right by you.

Programming books have a tendency to become outdated very quickly. When Stefan set out to write this book, his most important goal was that it had to be timeless. TypeScript gets at least two major releases a year, so there are new features and changes coming regularly.

That’s why the book focuses on the long-lasting aspects of the type system. You'll understand how TypeScript works, and how to apply new features long after you've turned the last page of this book.

The book is split into 7 chapters.

1. TypeScript for Smashing People

In this chapter, we want to debunk myths. TypeScript can be so many things, and many people have different views on this programming language that has become so popular in recent years. What is TypeScript actually about? Let’s see what TypeScript has in store for us.

We go on a hunt for red squiggly lines. If a word processor can highlight our spelling and grammar mistakes, why shouldn’t a programming editor do the same? We will see that – given the right tools – we might already be using TypeScript without realizing. With TypeScript being a gradual type system, we can gently encourage the programming language to give us more insights into our code. We will also write our first types.

2. Working with Types

We learn about some major features of TypeScript, like type annotations, type inference, and control flow. We will define primitive and complex types, and learn about the difference between types and interfaces. For every variable or constant we can create, we find a way to provide a type.

3. Functions

We’ll take a good look at functions. Functions are essential in JavaScript, and there are lots of different typing scenarios available to us. To make functions tangible, we’ll look at a website’s search field: a search field with type-ahead, that shows some results the moment a user types a search query.

We learn about function heads and bodies, structural typing for functions, and how we can define different behavior for the same function.

4. Union and Intersection Types

TypeScript’s type system can be seen as an endless space of values, and types are nothing but discrete sets of values inside this space. This allows for algebraic operations like union and intersections, making it a lot easier for us to define concrete types for values. We learn about type widening and narrowing, top and bottom types, and how we can influence control flow.

5. Generics

Generics are a way to prepare types for the unknown. Whenever we know a certain behavior of a type but can’t exactly say which type it affects, a generic helps us to model this behavior. We learn about generic constraints, binding generics, mapped types, and type modifiers.

6. Conditional Types

With conditional types, we get the last tool in our toolbelt to make most sense out of JavaScript code. Conditional types allow us to validate an input type’s set, and decide on an output type. To be sure, some conditional types can be mind-blowingly hard to understand, and their potential is sometimes hard to grasp. But this is what we want to clear up!

Conditional types allow us to introduce a level of meta-programming unseen in programming languages, where we can create if/else clauses to determine a type based on the input type. This allows for a powerful set of tools we can use to define model and behavior once, and make sure we don’t end up in type maintenance hell.

7. Thinking in Types

In the final chapter, we’ll work to strengthen our knowledge by seeing solutions to problems you might encounter every day in your TypeScript life. Our goal is to write just a couple of types to make our life easier, so we can focus on coding more JavaScript.

We'll get into a thinking-in-types mindset, where we take care about a robust and well-defined set of types before starting implementation. This helps us validate that what we code is what we expect.

“Stefan Baumgartner’s book finally made me want to use TypeScript. Until now, I didn't understand why I should use TypeScript. Without knowing the core principles, it made things more complicated for me. After reading this book, I know how to use the power of TypeScript to my advantage.”

— Vanessa Böhner, Software Developer and Chapter Leader at Front-End Foxes

“Stefan walks you through everything from basic types to advanced concepts like the infer keyword in a clear and easy to understand way. The book is packed with many real world examples and great tips, transforming you into a TypeScript expert by the end of it. Highly recommended read!”

— Marvin Hagemeister, Creator of Preact-Devtools

464 pages. The eBook is available (PDF, ePUB, Amazon Kindle). Shipping now. Written by Stefan Baumgartner. Designed by Rob Draper.

About the Author

Stefan Baumgartner is a software architect based in Austria. He has published online since the late 1990s, writing for Manning, Smashing Magazine, and A List Apart. He organizes ScriptConf, TSConf:EU, and DevOne in Linz, and co-hosts the German-language Working Draft podcast.

Technical Details

ISBN: 978-3-945749-90-6 (print)
Quality hardcover, stitched binding, ribbon page marker.
Free worldwide airmail shipping from Germany. (Check your delivery times). Due to Covid-19 and import restrictions, there could be some delays. But you can start reading the eBook right away.
eBook is available as PDF, ePUB, and Amazon Kindle.
Get the book right away.

Code Snippets and Hands-On Examples

TypeScript in 50 Lessons is a very practical book. It features lots of examples that not only give you an idea about syntax and semantics, but show you actual use-cases that you might encounter in your applications.

To help you follow the code examples in the book, Stefan has set up projects on Code Sandbox and the TypeScript playground, where you can fiddle around on your own and see how the TypeScript's type system behaves. You'll find all code snippets on the TypeScript book website.

Book Photos

We take time to carefully craft, edit and print our printed books. This one in no exception. Not just a wonderful book to learn from, but also a beautiful book that looks lovely on a kitchen table. The cover and the chapter illustrations designed with love by Rob Draper. Photos taken by a good friend of ours, Marc Thiele.

Community Matters ❤️

Producing a book takes quite a bit of time, and we couldn’t pull it off without the support of our wonderful community. A huge shout-out to Smashing Members for their ongoing support in our adventures. As a result, the eBook is and always will be free for Smashing Members. Plus, Members get a friendly discount when purchasing their printed copy.

Stay smashing, and thank you for your ongoing support, everyone!

More Smashing Books & Goodies

Promoting best practices and providing you with practical tips to master your daily coding and design challenges has always been (and will be) at the core of everything we do at Smashing.

In the past few years, we were very lucky to have worked together with some talented, caring people from the web community to publish their wealth of experience as printed books that stand the test of time. Paul and Adam are some of these people. Have you checked out their books already?