Setting Up React and TypeScript

Question 1

What does React.ReactNode allow as children in a React component?

Answer 1

It allows JSX elements and strings.

Question 2

How do you define a type for props in React with TypeScript?

Answer 2

Use type Props = { type?: string; heading: string; children: React.ReactNode; closable?: boolean; onClose?: () => void; }.

Question 3

How can you ensure type safety when passing props in React components?

Answer 3

Define a Props type and use it when declaring the component function.

Question 4

How can you define a state type explicitly in React with TypeScript?

Answer 4

Use a generic argument, e.g., const [visible, setVisible] = useState<boolean>();.

Question 5

What is the purpose of React DevTools’ Profiler panel?

Answer 5

It analyzes performance and detects slow components during interactions.

Question 6

Why should useState types be explicitly defined in some cases?

Answer 6

useState may not always infer types correctly, so explicit types ensure type safety.