HTML만으로 첫 번째 "Hello World"를 구축해보자
<!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의 경로가 포함되어야 한다.
이제 HTML 본문의 "Hello World"텍스트를 SAPUI5 컨트롤 sap.m.Text로 대체하여 빌드 해보자 처음에는 JavaScript 컨트롤 인터페이스를 사용하여 UI를 설정하고 컨트롤 인스턴스를 HTML 본문에 배치한다. Preview 03_preview.png Coding Walkthrough - Step 3. ...
SAPUI5를 사용하여 작업이 처음 시작될 때 로드 및 초기화 프로세스를 boot strapping이라 한다. 이번 튜토리얼에선 부트스트랩이 끝날 때 경고 창을 표시해 보자. Preview 02_preview.png Coding Walkthrough - Step 2. note: SAPUI5는 응용 프로그램이 위치한 동일한 웹 서버 ...
OpenUI5의 모든 주요 개발 패러다임을 알아보자 Model-View-Controller같은 기본 개발 패러다임을 소개하고 애플리케이션의 best-practice 구조를 확인한다. "Hello World"를 통해 기본적으로 앱을 설정하고 실행시켜 본다 그 다음 스텝으로 SAPUI5의 기본 데이터 바인딩 개념을 소개하고 송장 목록을 보여주는 기능...