본문 바로가기
React Native/이론

[React Native] 리액트 네이티브 마크업 언어 용어

by ssollacc 2021. 9. 23.
728x90

HTML 마크업 언어는 xml 마크업 언어의 부분집합(subset)입니다.

XML은 태그나 속성을 마음대로 확장할 수 있으나 HTML은 그렇지 못하기 때문입니다.

JSX가 'JavaScript HTML'이 아니라 'JavaScript XML'인 이유는 HTML은 문서를 구성하는 요소의

태그 이름이 모두 고정되어 있지만 XML은 문서 구성 요소의 태그 이름을 자유롭게 지정할 수 있기 때문입니다.

이것이 '확장 가능(eXtensible)'의 의미 입니다.

 

마크업 언어 문법은 다음처럼 div와 같은 태그(tag)를 꺾쇠 기호(<>)로 감싼 시작 태그를 <div>처럼 만들고

</div>처럼 태그 이름 앞에 / 기호를 추가한 끝 태그로 감싼<div></div> 형태가 기본 입니다.

그리고 시작 태그에는 id, style과 같은 속성(attribute)을 함께 기술할 수 있으며

속성값은 항상 작은 따옴표( ' ' )나 큰따옴표( " " )로 감싸야 합니다.

 

<div id="test" style="display: flex">
	<h1> Hello World</h1>
</div>

 

시작태그와 끝 태그 사이에 <h1> Hello World</h1> 와 같은 자식 요소(child element)를 삽입할 수 있습니다.

여기서 자식 요소란 XML 요소(XML element)나 문자열을 의미합니다.

만일 Hello World처럼 문자열이 자식 요소라면 따옴표와 같은 이용 부호는 생략합니다.

자식 요소가 없다면 <태그/>형태로 표현할 수 있는데 , 이를 스스로 닫는 태그(self-closing tag)라 합니다.

 

 

 

 

 

 

 다음 내용은 위 책을 참고하여 작성하였습니다:)

728x90

댓글