타입스크립트(TypeScript)에서 JSX는 자바스크립트 확장 문법으로, XML과 유사한 구문을 사용하여 UI 요소를 작성할 수 있게 해줍니다.

JSX란 무엇인가요?

JSX는 자바스크립트의 구문을 확장하여 XML과 유사한 구조로 UI 요소를 작성할 수 있도록 도와주는 문법입니다. 타입스크립트에서 JSX를 사용하면 UI 요소를 더 직관적이고 가독성 좋게 작성할 수 있습니다.

// JSX 예시
const element = <h1>Hello, World!</h1>;

타입스크립트와 JSX

타입스크립트는 JSX를 지원하며, JSX를 사용하기 위해서는 확장자가 .tsx인 파일을 사용해야 합니다. 또한, JSX 안에서 타입스크립트의 타입 시스템을 활용하여 타입을 지정할 수 있습니다.

// JSX에서 타입 지정
interface Props {
  name: string;
}

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

결론

타입스크립트에서 JSX를 사용하면, 자바스크립트를 확장하여 UI를 작성할 수 있으며, 타입스크립트의 강력한 타입 시스템과 함께 사용할 수 있습니다.

더 많은 정보는 타입스크립트 공식 문서를 참고하시기 바랍니다.