Start using TypeScript in React Projects

What is TypeScript?

• Superset of JavaScript developed by Micrpsoft.
• Compiles to plain JavaScript.
• Easily integrated into JavaScript projects.
• Designed for development of large scale applications.

Static Type Checking

With typescript, we can check and assign variables, parameters, and function types.

TypeScript Types

• String
• Number
• Boolean
• Array
• Any
• Null
• void
• Tuple
• Enum
• Generics

Get Start using TypeScript with reactjs

To initialize project with boiler plate run this command
npx create-react-app my-app --template typescript

With Props

• React.FC:React.FC show the Text component is functional component.
• interface Props:We are defining types there.We can also pass object(Details) to our Props
• App.tsx:We are passing everything in Text component.Missing anything will generate error

With hooks

So this was the small intro to use TypeScript with react.

Follow me on Github Shamaz Saeed

Comments

[calag4n]

Nice 👍 🙂

[Marcel Scherf]

Start using prettier to format your code. The inconsistency triggers my code-OCD.