How can I integrate TypeScript with my React project?

How can I integrate TypeScript with my React project?

To integrate TypeScript with React, you can start by creating a new React app using Create React App with TypeScript support. Use the command: npx create-react-app my-app --template typescript.

What if I already have a React project? Can I add TypeScript to it?

Yes, you can add TypeScript to an existing React project. First, install TypeScript and the necessary types with npm install --save typescript @types/react @types/react-dom. Then, rename your .js files to .tsx.

Are there any specific TypeScript configurations I should be aware of?

Yes, you should create a tsconfig.json file to configure TypeScript options. Common settings include strict, jsx, and moduleResolution.

Can you give me an example of a simple component in TypeScript?

Sure! Here's a simple functional component in TypeScript:

import React from 'react';

interface Props {
  name: string;
}

const Greeting: React.FC<Props> = ({ name }) => {
  return <h1>Hello, {name}!</h1>;
};
export default Greeting;