더북(TheBook)

2.4.2 자바스크립트 표현

JSX가 단순히 DOM 요소를 렌더링하는 기능밖에 없었다면 뭔가 좀 아쉬웠을 것입니다. JSX 안에서는 자바스크립트 표현식을 쓸 수 있습니다. 자바스크립트 표현식을 작성하려면 JSX 내부에서 코드를 { }로 감싸면 됩니다. 자바스크립트 값을 JSX 안에서 한번 렌더링해 봅시다.

src/App.js

import React from 'react';
 
function App() {
  const name = '리액트';
  return (
    <>
      <h1>{name} 안녕!</h1>
      <h2> 작동하니?</h2>
    </>
  );
}
 
export default App;

코드를 저장하고 브라우저로 확인해 보세요. 오류 없이 조금 전과 같은 화면이 나타났나요?

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.