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


  • 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


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

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
You'll get a notification every time a post gets published here.