UI5 로딩 느려지는 실수 5가지 #shorts #SAP #UI5
📖 개요: 이 글에서 다루는 것 UI5 앱을 처음 열었을 때 흰 화면이 3~5초씩 이어진다면, 대부분은 서버 성능이 아니라 부트스트랩과 리소스 로딩 방식 의 문제입니다. 이 실전 예제에서는 SAPUI5/OpenUI5(1.120 LTS 기준) 앱의 초기 로딩 속도를 개선하는 7가지 방법
@readonly vs @Core.Computed 뭐가 다를까 #shorts #SAP #CAPforJava
📖 개요 및 핵심 체크리스트 CAP Java 프로젝트가 커지면 어느 순간 이런 질문이 반복됩니다. "이 필드는 @readonly 로 막아야 하나, 아니면 핸들러에서 검사해야 하나?" "권한은 @requires 인가 @restrict 인가?" 어노테이션은 종류가 많은 데다 이름이 비슷해
req.error vs reject — 에러 처리 3단계 #shorts #SAP #CAPforNode
개요 및 이 글에서 다루는 것 SAP CAP(Cloud Application Programming Model) Node.js 런타임에서 Custom Handler를 작성하다 보면, 비즈니스 규칙 위반·외부 시스템 장애·데이터 정합성 문제를 어떻게 클라이언트에 전달할지 고민하게 됩니다.
Object Page 버튼 어노테이션 vs manifest 액션 #shorts #SAP #Fiori
📖 이 글에서 다루는 것 Fiori Elements Object Page는 어노테이션만으로 화면 대부분이 만들어지지만, 실무에서는 표준 CRUD 버튼 외에 업무 고유의 액션 버튼 이 반드시 필요해집니다. 이 글은 물류 도메인의 출하 모니터링 앱을 가정하고, Object Page 헤더에
Component vs Library 프리로드 캐시 차이 #shorts #SAP #UI5
이 글에서 다루는 것과 도달 지점 SAPUI5/OpenUI5 앱의 초기 로딩 성능을 좌우하는 두 가지 번들, Component-preload.js 와 library-preload.js 를 빌드 최적화 관점에서 비교합니다. 두 파일이 각각 언제 생성되고 어떤 시점에 로드되는지, UI5 T
req.error 써도 왜 안 멈추지? #shorts #SAP #CAPforNode
들어가며: 이 글에서 다루는 것 CAP(Cloud Application Programming Model) Node.js 런타임에서 에러 핸들링은 겉보기엔 단순합니다. req.error() 와 req.reject() 두 API만 알면 될 것 같지만, 실제 프로젝트에서는 "에러를 던졌는데
Formatter 없이 표현식만 쓰다 무너지는 3가지 #shorts #SAP #UI5
이 글이 답하는 질문 화면에 값을 그대로 뿌리는 경우는 거의 없습니다. 상태 코드를 한글로 바꾸고, 금액에 통화를 붙이고, 조건에 따라 색을 달리해야 합니다. 이때 선택지가 둘 있습니다. XML 뷰 안에 표현식을 직접 쓰는 방법과, 자바스크립트 함수로 빼는 방법입니다. 둘 다 되기 때문
ServiceException 없이 500 — 매핑 3가지 #shorts #SAP #CAPJava
개요: 왜 모든 오류가 500으로 나가는가 CAP Java로 서비스를 개발하다 보면, 핸들러 안에서 발생한 예외가 아무 처리 없이 그대로 올라가 클라이언트에게 500 Internal Server Error 로 반환되는 상황을 자주 만납니다. 재고 부족처럼 명백한 "업무 오류"조차 500
UI5 i18n 없이 다국어? 이 3단계면 끝 #shorts #SAP #UI5
📖 이 글에서 다루는 내용과 목표 UI5 앱에서 버튼 라벨과 메시지를 뷰에 하드코딩하면, 영어 사용자에게도 한국어 화면이 그대로 노출되고 문구 하나를 바꿀 때마다 뷰 파일을 전부 뒤져야 합니다. 이 글은 SAPUI5의 i18n(ResourceModel) 모델과 .properties 파
아직도 Fiori UI 직접 코딩? — CDS Annotation으로 #shorts #SAP #CAP
📖 개요 및 이 글에서 얻어갈 것 SAP CAP(Cloud Application Programming Model)으로 백엔드를 만들고 나서, UI를 위해 SAPUI5 화면을 처음부터 코딩하고 있다면 이미 먼 길을 돌아가고 있는 것입니다. CAP은 CDS 모델에 annotation 몇
GridList 없이 Fiori 모바일 대응하면 큰일 #shorts #SAP #Fiori
개요 및 이 글에서 다루는 것 SAP Fiori 앱을 데스크톱에서만 테스트하고 배포한 뒤 "모바일에서 표가 잘려 보인다"는 컴플레인을 받아본 개발자가 많을 것입니다. Fiori 디자인 가이드라인은 세 가지 폼팩터(Phone/Tablet/Desktop)를 동시에 지원해야 한다고 명시하지만
UI5 개발자 90%가 놓치는 Formatter 변환 패턴 #shorts #SAP #UI5
개요 및 이 글에서 다룰 것 SAP UI5 애플리케이션에서 화면에 데이터를 뿌릴 때, 백엔드에서 내려온 원본 값을 그대로 노출하면 사용자 경험이 어색해집니다. 예를 들어 20260714 라는 문자열, 1500000.00 이라는 숫자, P 라는 코드 값은 각각 2026-07-14 , 1,
초기 로딩 90% 빠르게 — Lazy Loading 설정법 #shorts #SAP #Fiori
개요 및 이 글에서 얻어갈 것 Fiori 앱을 오픈하는 순간 사용자 눈에 처음 보이는 것은 로딩 스피너입니다. 초기 렌더링이 3초를 넘어가면 이탈률이 급격히 상승한다는 UX 통계가 있는데, Fiori/UI5 앱의 경우 라이브러리 파일이 워낙 방대하다 보니 최적화 전략 없이는 첫 화면(T
아직도 헷갈려요? MessageBox vs Toast 차이 3가지 #shorts #SAP #UI5
이 글에서 다루는 내용과 확인 포인트 SAPUI5 애플리케이션에서 사용자에게 정보를 전달하는 두 가지 대표 위젯인 sap.m.MessageBox 와 sap.m.MessageToast 는 얼핏 비슷해 보이지만 UX 측면에서 완전히 다른 역할을 담당합니다. 이 글은 두 컴포넌트의 동작 원리
아직도 Fragment 없이 Dialog? 재사용 3단계 #shorts #SAP #UI5
개요 및 이 글에서 얻어갈 것 SAPUI5에서 Dialog를 컨트롤러 내부에서 new sap.m.Dialog(...) 로 즉석 생성하는 코드를 흔히 볼 수 있습니다. 프로토타입 단계에서는 편리하지만 화면 수가 늘어나면 같은 다이얼로그 코드가 여러 파일에 흩어지고, 스타일 변경 한 번에
Dialog 중복 금지 — Fragment 30초 분리법 #shorts #SAP #UI5
이 글에서 얻어갈 것 SAPUI5에서 Dialog는 사용자와의 상호작용에서 가장 자주 등장하는 컨트롤입니다. 그런데 많은 개발자들이 여전히 컨트롤러 안에서 new sap.m.Dialog({...}) 를 직접 호출하며 코드를 길게 늘어뜨리고 있습니다. 이 방식은 화면이 하나일 때는 괜찮지
날짜·금액·상태 변환 코드 90% 줄이는 Formatter #shorts #SAP #UI5
UI5 Formatter가 해결하는 실무 문제 SAP UI5 애플리케이션을 개발하다 보면 OData 서비스에서 내려오는 원본 데이터와 사용자가 실제로 화면에서 보고 싶어하는 형태 사이에 큰 간극이 존재합니다. 예를 들어 백엔드는 날짜를 /Date(1717200000000)/ 형태의 Ed
직접 변환 금지 — Formatter 패턴 3가지 #shorts #SAP #UI5
개요와 이 글에서 얻어갈 것 SAPUI5 화면에서 백엔드가 내려주는 값은 대부분 "가공되지 않은 원본"입니다. OData 서비스가 DeliveryDate 를 /Date(1751846400000)/ 또는 ISO 문자열로 내려주고, NetAmount 는 1234567.89 라는 숫자로, S
E2E 테스트 코드 중복 생겼다면? — Opa5 Page Object 3단계 #shorts #SAP #UI5
placeholder
public vs private — UI5 모듈 API 설계 패턴 #shorts #SAP #UI5
UI5 모듈 API 설계 — public vs private 분리 패턴