1. 유용한 사이트 (Code Beautify, W3Schools Valiidator)
[1-1] Code Beautify - XML Viewer
- XML Syntax Checking (XML 구문 검사)
- XML Node Hierarchy (XML 노드 계층 구조)
https://codebeautify.org/xmlviewer
특징
- 'beauty' 버튼을 클릭 시, 작성한 코드를 정렬해서 보여준다.
- syntax error 발생 시, 오류를 알려준다.
[1-2] Code Beautify - HTML Viewer
- HTML5에서는 eng tag가 없어도 큰 문제는 없다. (하지만 사용하는 것을 추천한다.)
https://codebeautify.org/htmlviewer
예시
error가 발생한 이유
1. </p> 태그가 없다.
2. <em> 태그에 '/'가 없다.
[2] W3Schools Validator
- 해당 사이트에서는 syntax에 대한 자세한 설명을 제공한다.
https://www.w3schools.com/xml/xml_validator.asp
2. About XML
[1] XML Tree Structure
종류
- Root Element : root 태그
- Element : 태그
- Attribute : 태그에 대한 속성
- Test : 실질적인 정보
[2] What is an XML Element?
: XML 요소는 요소의 시작 태그부터 요소의 끝 태그까지(포함) 모든 것을 의미한다.
Empty XMl Elements
: 콘텐츠가 없는 요소를 'Empty element (비어 있는 요소)'라고 한다.
- XML에서는 다음과 같이 빈 요소를 나타낼 수 있습니다.
[3-1] Syntax : XML Naming Rules (XML 명명 규칙)
규칙
- 대소문자를 구분함
- 문자 또는 밑줄로 시작해야 함
- xml(또는 XMl, Xml 등) 문자로 시작 불가능함
- 문자, 숫자, 하이픈, 밑줄, 마침표 포함 가능함
- 공백을 포함할 수 없음
- etc) 하지만, 하이픈, 밑줄, 점 사용을 비권장되는 이유
[3-2] Syntax : Best Naming Practices (모범 이름 지정 사례)
1. 설명적인 이름. <person>, <firstname>, <lastname>
2. 짧고 간단한 이름. <book_title>이렇게 하지 마세요</book_title>
3. '-' 을 사용하지 말 것. (일부 소프트웨어에서는 마이너스(빼고 싶다)로 생각할 수 있다.)
4. '.'을 사용하지 말것. (일부 소프트웨어는 객체의 속성으로 인식할 수 있다.)
[3-3] Naming Styles
: XML 태그는 naming Styles가 정의 되어 있지 않다.
Lower / Uppder / Underscore / Pascal / Camel 방식
: 이 중에서 Camel case를 권장한다.
[4-1] XML Tags are Case Sensitive
: Opening Tag와 Closing tag는 반드시 같은 format으로 되어야 한다.
[4-2] XML Attribute Values Must Always be Quoted
: XML Attribute Values는 반드시 따옴표로 감싸야 한다.
[5] XML Elements Must be Properly Nested
: XML 요소는 올바르게 중첩되어 있어야 한다.
- HTML에서는 허용될 수 있어도, XML에서는 허용되지 않는다.
[6] XML Elements are Extensible
: XML은 요소를 확장해도 기존 애플리케이션이 영향을 받지 않고 동작할 수 있다
- 새로운
<date>와<heading>요소를 추가한 XML 문서를 보자.
이 경우에도 애플리케이션은 여전히<to>,<from>,<body>요소를 추출하여 동일한 결과를 생성할 수 있어야 한다.
[7] Entity References (Special meaning)
: 특수 기호를 사용하고 싶을 때 &와 ;를 사용한다.
[8] Comments in XML
: HTML와 유사하게 <!-- -->를 사용하여 주석을 사용할 수 있다.
잘못된 경우
안녕하세요, 사용자들의 문제 해결을 중심으로 하는 프론트엔드 개발자입니다. 티스토리로 전환했어요 : https://pangil-log.tistory.com