Carousel로 이미지 슬라이드? — UI5 완성 #shorts #SAP #UI5
1. 개요 및 이 글에서 얻어갈 것 SAPUI5로 화면 좌우 슬라이드 전환이 필요한 UI를 만들 때, 많은 개발자들이 처음에는 setTimeout 이나 CSS transition을 직접 조합해서 애니메이션을 구현하려 시도합니다. 하지만 SAPUI5에는 이런 슬라이드 패턴을 위해 설계된
window 전역 변수 그만 — UI5 스코프 관리 3단계 #shorts #SAP #UI5
개요 — window 전역 변수와 결별하기 UI5 화면을 처음 만들 때 가장 흔한 실수 중 하나가 window.currentSalesOrderId = 4711; 같은 코드입니다. 빠르게 동작하기 때문에 유혹적이지만, 이 한 줄은 향후 수개월간 디버깅 지옥을 예약하는 행위와 같습니다. 이
접근성 테스트 안 하면 큰일 — UI5 A11y 체크 #shorts #SAP #UI5
개요 및 이 글의 목표 SAPUI5 애플리케이션을 만들 때 시각·청각·운동 제약을 가진 사용자가 동일한 기능을 사용할 수 있도록 보장하는 작업이 접근성(Accessibility, 줄여서 a11y)입니다. 화면에 보이는 픽셀만 잘 그리는 것으로는 부족합니다. 스크린 리더, 키보드 내비게이
BusyDialog vs BusyIndicator — 언제 뭘 써야 해? #shorts #SAP #UI5
이 글의 목적과 도달점 SAPUI5 화면에서 사용자에게 "지금 처리 중"이라는 신호를 주는 방법은 크게 두 갈래입니다. 하나는 화면 전체를 막아버리는 sap.m.BusyDialog , 다른 하나는 컨트롤 단위로 부분 차단을 거는 setBusy(true) 혹은 전역 sap.ui.core.
UI5 배열 바인딩 이렇게 못 하셨다면? #shorts #SAP #UI5
이 글에서 다루는 범위와 도달 목표 SAPUI5 애플리케이션에서 배열(컬렉션) 데이터를 화면에 표시할 때 개발자가 가장 자주 마주치는 의사결정은 "어떤 바인딩 방식을 선택할 것인가"입니다. 같은 Product 배열을 두고도 인덱스로 직접 꺼낼 수도 있고, 컨테이너 전체에 컨텍스트를 묶어
UI5 리스트 그룹 실수 3가지 #shorts #SAP #UI5
이 글의 목표와 체크포인트 SAPUI5의 sap.m.List 에서 단순 정렬을 넘어 의미 있는 그룹으로 묶어 보여주는 작업은 실무에서 매우 자주 등장합니다. 이 글은 SalesOrder(판매 주문) 리스트를 SalesOrg(판매 조직) 단위로 그룹핑하는 시나리오를 통해, Sorter 의
Toolbar vs Bar 차이 — UI5 레이아웃 제대로 #shorts #SAP #UI5
Toolbar와 Bar를 혼용할 때 생기는 문제 SAP Fiori 화면을 만들다 보면 상단 헤더에 제목과 검색 버튼, 하단 푸터에 저장/취소 버튼을 배치하는 일이 빈번합니다. 이때 많은 개발자가 sap.m.Bar 와 sap.m.Toolbar 를 거의 같은 컨트롤로 착각하고 아무 곳에나
오류 수집 직접 코딩? — UI5 MessageModel로 자동화 #shorts #SAP #UI5
1. 수동 오류 수집의 문제점 UI5 애플리케이션을 처음 작성할 때 가장 흔히 마주치는 안티 패턴은 컨트롤러마다 onError , onValidationError , onParseError 핸들러를 따로 두고 sap.m.MessageBox.error() 를 호출하는 방식입니다. 입력 필
OData 호출 90%가 낭비 — $batch 묶기 #shorts #SAP #UI5
개요 및 핵심 포인트 SAP Fiori/UI5 애플리케이션이 복잡해질수록 화면 하나에서 발생하는 OData 호출 수가 빠르게 늘어납니다. 주문 목록, 고객 정보, 배송 상태, 첨부 파일을 각각 별도의 HTTP 요청으로 보낸다면 네트워크 왕복 비용과 서버 세션 부담이 모두 누적됩니다. 이
UI5 개발자 90%가 놓치는 EventBus 패턴 #shorts #SAP #UI5
왜 EventBus가 필요한가 대형 SAP Fiori 애플리케이션은 보통 여러 개의 Component로 쪼개져 있습니다. 주문 목록을 보여주는 컴포넌트, 주문 상세를 띄우는 컴포넌트, 사이드 알림 패널을 다루는 컴포넌트가 서로 다른 페이지·다른 라이프사이클을 가진 상태에서 "방금 사용자
백엔드 없이 OData? — Mock Server 3단계 설정 #shorts #SAP #UI5
이 글이 답하는 질문 백엔드 API가 없는 상황에서도 UI5 앱을 실행할 수 있나? Mock Server는 어떻게 설정하고 OData를 어디서 흉내 내나? 운영 배포 코드에 Mock이 섞이지 않게 하려면? 직접 해보기 1. 디렉토리 구조 잡기 webapp/ localService/ me
UI5 i18n 삽질 끝 — 다국어 지원 한 번에 #shorts #SAP #UI5
SAPUI5 i18n 다국어 지원 완전 정복 — Resource Bundle 설정부터 XML View 바인딩, Controller 동적 텍스트 처리까지
손으로 클릭 테스트? 그만 — OPA5로 E2E 자동화 #shorts #SAP #UI5
OPA5로 E2E 테스트 자동화하기 SAPUI5 애플리케이션은 복잡한 사용자 상호작용을 포함합니다. 매 배포마다 수동 테스트를 반복하는 것은 비효율적이며 오류 발생 위험이 높습니다. OPA5(One Page Acceptance)는 SAPUI5 전용 E2E 테스트 프레임워크로, 사용자 동