HTML만으로 첫 번째 "Hello World"를 구축해보자

Preview

01_preview.png

Coding

Walkthrough - Step 1.

webapp/index.html (New)

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>SAPUI5 Walkthrough</title>
</head>
<body>
    <div>Hello World</div>
</body>
</html>

Index.html은 root HTML file이라 불린다. Html 문서는 [head]태그와 [body]태그 두 섹션으로 구성된다.

1) [head]: 브라우저에서 문서를 처리하는데 사용

2) [meta]: 브라우저에의 동작에 영향을 주는 태그, Microsoft Internet Explorer에 최신 렌더링 엔진 (edge)을 사용하고 문자는 UTF-8로 설정한다.

3) [title]: 브라우저에 표시 될 App의 제목

4) [body] : 페이지의 레이아웃

[p]태그를 사용하여 브라우저에 "Hello World"를 표시해보자

일반적으로 webapp 폴더의 파일들은 application package로써 Web server에 배포된다.

tip : webapp 폴더 자체를 URL로 배포할 때 index.html 파일에 webapp의 경로가 포함되어야 한다.

Conventions

  • index.html 응용 프로그램의 루트 HTML 파일 이름을 지정하고 webapp 폴더에서 찾는다.