Typescript React Cheat Sheet

Posted : admin On 1/2/2022
← Go Back
Broken Post? → Let me know

React typescript cheat sheet; react.fc typescript; typescript cheat sheet 2020; typescript cheat sheet; react.fc typescript props; typescript cheatsheet; Learn how Grepper helps you improve as a Developer! INSTALL GREPPER FOR CHROME. More “Kinda” Related C# Answers View All C# Answers ». Npm run build creates a build directory with a production build of your app. Set up your favorite HTTP server so that a visitor to your site is served index.html, and requests to static paths like /static/js/main.js are served with the contents of the /static/js/main.js file. For more information see the production build section.

Introduction

A note to self lest I forget the resources I learned from.

React

As I was going thru Swyx's React TypeScript Cheatsheet, Props: Omit prop from a type, I had trouble understand the definition of Omit.

Could not wrap my heads around it so Googled and found Marius Schulz's blog posts.

Blog read order

I read these backwards initially but the posts in following order seems to make sense.

  1. keyof and Lookup Types in TypeScript - Learn about keyof used for Omit and Exclude
  2. Conditional Types in TypeScript - To understand Exclude
  3. The Omit Helper Type in TypeScript - To finally learn how Omit is implemented

References

Advaned utlity type document and sources for

  1. Omit<Type, Keys>

    • Definition: Constructs a type by picking all properties from Type and then removing Keys.
    • Documentation: https://www.typescriptlang.org/docs/handbook/utility-types.html#omittype-keys
    • Source: https://github.com/microsoft/TypeScript/blob/master/lib/lib.es5.d.ts#L1504
  2. Pick<Type, Keys>

    • Definition: Constructs a type by picking the set of properties Keys from Type.
    • Documentation: https://www.typescriptlang.org/docs/handbook/utility-types.html#picktype-keys
    • Source: https://github.com/microsoft/TypeScript/blob/master/lib/lib.es5.d.ts#L1480
  3. Exclude<Type, ExcludedUnion>

    • Definition: Constructs a type by excluding from Type all union members that are assignable to ExcludedUnion.
    • Documentation: https://www.typescriptlang.org/docs/handbook/utility-types.html#excludetype-excludedunion
    • Source: https://github.com/microsoft/TypeScript/blob/master/lib/lib.es5.d.ts#L1494

Jsdoc Typescript Cheat Sheet

Misc. Link

Need to watch Marius Schulz's Egghead course, Advanced Static Types in TypeScript.

Typescript React Redux Cheat Sheet

Image by Edward Lich from Pixabay

cuz, Donut's hole reminds me of Omit 😉

Typescript React Cheat Sheet Download

Webmentions

Loading counts...

Fetching Replies...