4월, 2025의 게시물 표시

6. SAP UI5 Component.js Configuration

이미지
SAP UI5 Component.js Configuration  이번 단계에서는 Component.js를 활용하여 application 전체에 공통으로 사용 가능한 Model, Function 등을 관리하여 Application의 동작을 더욱 유연하게 할 수 있다. 추가적으로 이 단계에서 모든 UI 자산을 index.html 파일과 독립적인 구성 요소로 캡슐화 한다. 이 아키텍처 변경을 통해 Application은 정적 인덱스.html 페이지보다 더 유연한 환경에서 사용할 수 있다.  (In this step, you can use Component.js to manage models and functions that can be used in common throughout the application to make the application more flexible. Additionally, at this step, all UI assets are encapsulated into independent components of the index.html file. This architectural change allows the application to be used in a more flexible environment than a static index.html page.) 실행결과(Results of this step)  이전 단계의 결과와 동일한 UI와 동작을 보여준다. 단, 이번 단계는 Application 내부적인 동작을 좀 더 유연하게 관리하기 위한 단계이다. (It shows the same UI and operation as the result of the previous step. However, this step is to manage the internal operation of the application more flexibly.) 실행 순서(Order of execution of this step): C...

5. SAP UI5 Resource Model Apply

이미지
SAP UI5 Resource Model Apply (다국어 처리 - Translatable Texts) 이 단계에서는 UI5의 Data 처리를 위한 Model 중 하나 인 Resource Model을 활용하여 다국어를 적용하는 방법에 대해 살펴본다.  (In this step, we will look at how to apply multiple languages using the Resource Model, one of the models for data processing in UI5.) 실행 결과(Results of this step) 실행 순서(Order of execution of this step): i18n property 파일 생성한다. (Create the i18n property file.) Controller에서 ResourceModel 선언 및 View에 할당한다. (The Controller assigns ResourceModel Declaration and View.) View에서 ResourceModel 연동한다. (In View, link ResourceModel.) 1. i18n property 파일 생성한다.    (Create the i18n property file.) webapp/i18n/i18n.properties 파일 생성 및 코드 작성한다. 파일 이름은 사전에 약속된 Naming Rule로 정해져 있다. (Create and code the "webapp/i18n/i18n.properties file." The file name is set to the Naming Rule that was previously promised.)      1 2 showHelloButtonText=Say Hello helloMsg=Hello {0}           코드 해석(Code description) hel...

4. SAP UI5 JSON Model Apply

이미지
SAP UI5 JSON Model Apply 이번 단계에서는 화면에 JSON 형태의 data를 담을 수 있는 JSONModel 변수를 사용하여 화면에 Text 문구를 표시하는 방법을 작성한다.  (In this step, a method of displaying text phrases on the screen is created using the JSONModel variable that can contain JSON-type data on the screen.) 실행 결과(Results of this step) 실행 순서(Order of execution of this step): Controller에 JSON Model 선언 및 Data를 할당한다. (Assign JSON Model Declaration and Data to Controller.) View에서 JSON Model을 참조하여 UI 표시할 수 있도록 처리한다. (Process to display UI by referring to JSON Model in View.) 1. Controller에 JSON Model 선언 및 Data를 할당한다.     (Assign JSON Model Declaration and Data to Controller.) webapp/controller/App.controller.js 에 JSON Model 선언 및 Data를 할당한다. (Assign JSON Model declaration and Data to webapp/controller/app.controller.js.)      1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 sap.ui.define([      "sap/ui/core/mvc/Controller"  ,      "sap/m/MessageTo...

[참조] SAP UI5 Model Type

이미지
SAP UI5 Model Type 여기서는 UI5의 MVC 패턴 중 M(Model)에 해당하는 3가지 Type의 Model에 대해서 작성한다. 3가지 Type은 JSON Model, Resource Model, ODataModel이다. 이 장에서는 간단한 소개만 작성하고, 실제 사용 방법은 다음 글에서 작성한다.   (Three types of models corresponding to M (Model) among the MVC patterns of UI5 are created. The three types are JSON Model, Resource Model, and OData Model.) JSON Model JSON 형식({id:value} 구조)의 Data를 관리하기 위한 Model로 UI5에서 Data를 처리하기 위해 사용되는 가장 기본이 되는 Data Model이다. (It is a model for managing data in JSON format ({id:value} structure) and is the most basic data model used to process data in UI5.) 예시(Example):       1 2 3 4 5  {recipient: [                 {name:"Tom"},                   {name:"Joe"}              ] } cs Resource Model UI Module(...