How to Get Started Using React with Typescript

#react #typescript #guides

I got started using React with TypeScript about 2 years ago now and have been working on several projects both at home and at work that utilize both technologies. I'm loving it but I also see a lot of questions around specific patterns around using TypeScript with React. Many of these questions I've tackled in my projects but haven't sat down to write about, though I have talked about many of them.

In 2019 my goal was to write more about these topics and so far I have published three guides that cover the topics you need to get started from scratch and take you through statically typing React.

The benefit to sharing these guides is primarily to help people and to see if there's enough interest to warrant pitching a course or other long-form content on the topic! I've been a TypeScript user for over 5 years and I love how much it's growing in the community!

Guides

Disclosure: The guides are free to read without a Pluralsight subscription and I don't get any kickbacks. I've already gotten paid to write them initially which made them a good use of my time! Now I just want people to know they exist.

Getting Started with React and TypeScript - Zero to bootstrapped project using multiple ways like create-react-app, from scratch, Webpack, and Parcel.
How to Statically Type React Components with TypeScript - Covers patterns on statically typing React components, props, and state.
Composing React Components with TypeScript - Covers common patterns of composing React components such as inheritance, specialization, and render props.
How to Test React Components in TypeScript - Covers using Jest with TypeScript to test React components
Handling Safe Destructuring in TypeScript - Covers patterns on avoiding excessive destructuring and how to effectively handle defaults/fallbacks with object destructuring

Other resources I've created:

Building Scalable, Maintainable Apps Using TypeScript and React - Conference talk I gave recently on some patterns & practices I've picked up that I use in my apps.
Sample React & TypeScript Patterns Repo - Companion repository for my talk that has all the code samples.

Other resources I've seen:

Complete React & TypeScript Guide - This is pretty amazing work by

Piotrek Witek
React & TypeScript Cheatsheet Repo - Fantastic resource for lots of examples and recipes

I hope this helps others to learn the nuances of using TypeScript with React and I'll be sure to update this post as I put out more guides or find more resources!

Be sure to share other resources if you're also using React and TypeScript, I'd love to see them!