JSX란?

mangjell·2022년 3월 17일
0

JSX(JavaScript XML)는 Javascript에 XML을 추가한 확장한 문법!

JSX의 장점은, 하나의 파일에 자바스크립트와 HTML을 동시에 작성하여 편리하다.

유의해야할 점은,
1. 반드시 부모 요소 하나가 감싸는 형태여야한다.
ex) 예시

function prac() {
	return(
    	<>
        	<div>안녕하세요</div>
        <>
    );
}

여기서, <>는 Fragments 라는, React에서 DOM에 별도의 노드를 추가하지 않고 여러 자식을 그룹화 할 수 있는 태그이다!

  1. JSX 안에서도 자바스크립트 표현식을 사용할 수 있다.
    ex) 예시
function prac() {

	const username = "짱구"
	return(
		<>
        	<div>{username}님</div>
            <div>안녕하세요!</div>
		<>
    )
}
profile
프론트엔드 개발자

0개의 댓글