Learn how to write Typescript react component


Usually every developer writes react components using javascript default

Typescript is a advanced version of javascript with more features like strict type checking and lot of advantages.

React with Typescript

Requirement

  • Node and npm installed already
  • React javascript,css,html
  • Visual studio code editor

How To Create a React App Using Typescript

First create an react using create-react-app cli tool

npx create-react-app react-typescript-app --template typescript

create-react-app by default create a react javascript prototype codebase add –template typescript to create a react app in typescript codebase.

Go to application folder, You can start the application by npm run start command

components

In React everything is an component,

Let’s discuss how to write a component in typescript

There are two types of components in react

  • Functional components also called stateless component
  • Class components also called stateful components

How to create a typescript functional components

Create a typescript Class Components in React

React components has Props and state object as a parameter to class components

proptypes using

event binding

using refs in typescript

THE BEST NEWSLETTER ANYWHERE
Join 6,000 subscribers and get a daily digest of full stack tutorials delivered to your inbox directly.No spam ever. Unsubscribe any time.

Similar Posts
Subscribe
You'll get a notification every time a post gets published here.