1-2 JAX의 예시

JAX는 JavaScript의 확장 버전이기 때문에 모든 JavaScript의 문법을 지원한다.

const name = '홍길동';
const element = <h1>내 이름은, {name}</h1>;

ReactDOM.render(
    element,
    document.getElementById('root')
);

위에서 볼 수 있드시 javaScript와 html이 섞인 형태로 작성된다.

html코드를 사용하다 JavaScript 코드를 사용하고 싶다면 중괄호 안에 {javaScript코드}를 넣어주면 된다.

 

function formatUserInfo(user) {
    return "내 이름은 " + user.name + ", 나이는 " + user.age;
}

const user = (
    name: '홍길동',
    age: 18
);

const element = (
    <h1> 안녕, {formatUserInfo(user)}</h1>;
);

ReactDOM.render(
    element,
    document.getElementById('root')
);