Getting started with TypeScript
Tags: typescript, javascript, functional, programming
Published: 2019-05-31 19:39:21

---
title: Getting started with TypeScript
published: true
description: 
tags: TypeScript, JavaScript, Functional, Programming
---


Everybody’s talking about the Microsoft-backed superset of JavaScript. Many new libraries are being written with types in mind, and many still are adding types for both safety and improved developer experience.

Getting started can be a little challenging, especially if your background is in more dynamic languages (true for me). What follows are some resources that helped me get ramped-up and familiar with the syntax and ecosystem. Enjoy!

### Setup

There are a few ways to try out TypeScript.

If you’re already using Babel, there’s a new preset that shipped with Babel 7. Check out this article for more: [https://iamturns.com/typescript-babel](https://iamturns.com/typescript-babel/)

If you want to use CRA (create-react-app), use the`--typescript` flag when generating a new project from the CLI. [link](https://facebook.github.io/create-react-app/docs/adding-typescript)

Want to add Typescript to an existing CRA? There’s a [migration path](https://vincenttunru.com/migrate-create-react-app-typescript-to-create-react-app/).

If you simply want to try out the language in a browser, try the [Official Playground](http://www.typescriptlang.org/play/)

Finally, if you want to try out the compiler locally, use the [Getting Started Guide](https://www.typescriptlang.org/docs/tutorial.html).

### Learning Typescript

Somewhat paradoxically, TS has opened up the front-end world to a lot of developers from more traditional backgrounds in statically typed languages.

Most important is probably the [**_Official Handbook_**](https://www.typescriptlang.org/docs/handbook/basic-types.html).

There are a lot of blogs and articles dedicated to on-ramping, style, OOP, common pitfalls, advanced types, etc. — here are a few highlights.

- [Gentle Intro To TypeScript (interactive videos)](https://scrimba.com/g/gintrototypescript) ⭐  
- [Understanding TypeScript’s type notation - 2ality](http://2ality.com/2018/04/type-notation-typescript.html) ⭐  
- [TypeScript Deep Dive - Basarat](https://basarat.gitbooks.io/typescript)  
- [TypeScript Practical Introduction](https://auth0.com/blog/typescript-practical-introduction/)  
- [TypeScript Evolution](https://blog.mariusschulz.com/series/typescript-evolution) (covers 2.0)

### Typescript + React

**_Introductory_**  
- [https://fettblog.eu/typescript-react](https://fettblog.eu/typescript-react/)  
- [https://github.com/piotrwitek/react-redux-typescript-guide](https://github.com/piotrwitek/react-redux-typescript-guide)  
- [https://github.com/sw-yx/react-typescript-cheatsheet](https://github.com/sw-yx/react-typescript-cheatsheet)

**_Use cases_**
- [https://tinkerylabs.com/react-context-api-with-hooks](https://tinkerylabs.com/react-context-api-with-hooks/)

## Functional Typescript

Libraries like Lodash and Ramda have been empowering a functional style for a long time, now developers can implement ideas directly from languages like Haskell and Scala.

### A few very notable projects:

- [FP-TS](https://github.com/gcanti/fp-ts)
- [Purify](https://github.com/gigobyte/purify)
- [piotrwitek/utility-types](https://github.com/piotrwitek/utility-types)
- [FunFix](https://github.com/funfix/funfix)

#### Some articles on FP

- [http://vindum.io/blog/lets-reinvent-frp](http://vindum.io/blog/lets-reinvent-frp/)  
- [https://www.synthesis.co.za/functional-fun-typescript-generics](https://www.synthesis.co.za/functional-fun-typescript-generics/)  
- [https://www.reaktor.com/blog/fear-trust-and-javascript](https://www.reaktor.com/blog/fear-trust-and-javascript/)

That last one is a kind of refutation on the incompatibility of JavaScript and FP with types. It’s not wholly hostile, and I learned something from reading it, so I’ll leave it in (for balance!)