SAPUI5 ile Arayüz Geliştirme (UX400) Eğitimi

Eğitim Hakkında

SAPUI5 ile Fiori uygulaması geliştirme

Eğitim, SAPUI5 çerçevesiyle Fiori tasarım ilkelerine uygun uygulama geliştirmeyi kapsar: bootstrap ve manifest.json, MVC ve XML View, JSON ve OData Model ile veri bağlama, formatter ve expression binding, sap.m kontrolleri, routing ve navigation, i18n, OData v2 CRUD işlemleri, Fiori elements ve annotation, özel kontrol, uygulama özelleştirme ve OPA5/QUnit ile test.

Süre ve Format

3 Gün. Her gün dört modül; SAPUI5 Temelleri ve Veri Bağlama; OData, Routing ve Fiori; Test, Güvenlik ve Yaşam Döngüsü ekseninde ilerleyen uygulamalı program.

Seviye

Orta Seviye — SAPUI5 ve OpenUI5: MVC, veri bağlama, OData, Fiori tasarımı ve test

Öğrenme Metodu

Her konu SAP Business Application Studio veya UI5 Tooling ile adım adım geliştirilen bir uygulama üzerinde işlenir.

Neden Bu Eğitim?

🧱MVC mimarisi

XML View, Controller ve Model ayrımıyla bakımı kolay uygulamalar yazarsınız.

🔗OData entegrasyonu

SAP backend servislerine bağlanıp CRUD ekranları kurarsınız.

🎨Fiori deneyimi

sap.m kontrolleri ve responsive tasarımla tutarlı arayüzler üretirsiniz.

Anahtar Konular

SAPUI5 eğitimiUX400Fiori geliştirmeOpenUI5SAP Fiori elementsOData v2SAPUI5 MVCSAP Business Application StudioOPA5 testUI5 veri bağlama

“İyi bir kurumsal arayüz, kullanıcının SAP'yi hissetmeden iş yapmasıdır.”

Ön Koşullar

Eğitimden verim almak için faydalı olacak bilgi ve ortam gereksinimleri

1

JavaScript

ES6, nesneler ve asenkron programlama bilgisi.

2

HTML ve CSS

Temel HTML/CSS ve DOM kavramları.

3

SAP temeli

SAP sistemi ve OData servis kavramına genel aşinalık.

4

Geliştirme ortamı

Node.js, UI5 Tooling ve editör (BAS veya VS Code).

Eğitim İçeriği

Programın gün gün akışı aşağıdadır. Bir güne tıklayarak o günün modüllerini ve içeriklerini görebilirsiniz.

Günün hedefiKatılımcı SAPUI5 uygulamasını bootstrap eder, XML View ile MVC kurar ve model ile veri bağlama yapar.

Modül 1

Proje Yapısı

UI5 Tooling ve ui5.yaml
Bootstrap ve sap-ui-core.js
manifest.json: app, models, routing
Component.js ve Component yaşam döngüsü
OpenUI5 ve SAPUI5 farkı
Yazım standartları ve lint

Modül 2

MVC ve View

XML View yazımı ve namespace'ler
Controller yaşam döngüsü: onInit, onBeforeRendering
Fragment ile yeniden kullanım
Kontrol kitaplığı sap.m, sap.ui.layout
Olay yönetimi (press, change)
Debugging: UI5 Inspector

Modül 3

Veri Bağlama

JSONModel ve ResourceModel
Property, aggregation ve element binding
Expression binding ve formatter
Tek yönlü ve iki yönlü bağlama
i18n ile çok dilli arayüz
Filter ve Sorter nesneleri

Modül 4

Tablo ve Liste Kontrolleri

sap.m.List ve Table kullanımı
ColumnListItem ve items aggregation
Growing ve arama alanı (SearchField)
Seçim ve sürükle-bırak
sap.ui.table.Table kıyaslaması
Dialog, Popover ve MessageBox

Günün hedefiKatılımcı OData servislerine bağlanır, çok sayfalı navigasyon kurar ve Fiori ilkelerine uygun uygulama sunar.

Modül 1

OData Entegrasyonu

OData v2 ve v4 model farkları
Metadata, entity set ve navigation property
read, create, update, remove işlemleri
Batch istekleri ve $expand, $filter, $select
CSRF token ve hata yönetimi
Mock server ile yerel geliştirme

Modül 2

Routing ve Navigation

routes, targets ve pattern tanımı
Parametreli rota ve detay sayfası
Back navigation ve hash yönetimi
Flexible Column Layout
Lazy yükleme ve preload
Hata hedefi (404) tasarımı

Modül 3

Fiori Elements

List Report ve Object Page şablonları
CDS annotation ve UI.LineItem
Smart Controls ve Smart Filter Bar
Adaptation ve extension noktaları
Fiori launchpad entegrasyonu
Fiori tasarım kılavuzu uyumu

Modül 4

Özelleştirme ve Erişilebilirlik

Özel kontrol (Control.extend)
Tema Tasarımcısı ve özel tema
Responsive Grid ve Device modeli
Erişilebilirlik (ARIA) ve klavye
Performans: bundle ve preload
Dağıtım: ABAP repository ve Cloud Foundry

Günün hedefiKatılımcı UI5 uygulamasını QUnit ve OPA5 ile test eder, güvenli ve performanslı biçimde yayına alır.

Modül 1

Birim Testleri

QUnit yapısı ve test runner
Formatter ve model testleri
Sinon ile mock ve stub
Kod kapsama (code coverage)
Test otomasyonu karma
Testlerin CI'a bağlanması

Modül 2

OPA5 Entegrasyon Testleri

Sayfa nesneleri (Page Objects)
Arrangement, Action, Assertion
Mock server ile OPA
Journey tasarımı
Tutarlılık ve beklemeler
Test raporlama

Modül 3

Güvenlik ve Kalite

XSS ve içerik güvenliği politikası
Güvenli veri bağlama ve encodeXML
Yetkilendirme ve rol kontrolü
ESLint ve UI5 linter
Üçüncü parti kütüphane yönetimi
Sürüm yükseltme ve deprecated API

Modül 4

Yayın ve Bakım

ui5 build ve self-contained paketleme
Fiori launchpad kartı ve tile yapılandırma
BTP Work Zone / ABAP deployment
Hata izleme ve loglama
Sürüm uyumluluk matrisi
Kapanış projesi: uçtan uca uygulama

Eğitim Kazanımları

Program sonunda katılımcılar:

✅

MVC mimarisi

XML View ve Controller ile SAPUI5 uygulama iskeleti kurabilirsiniz.

✅

Veri bağlama

JSON ve OData modelleriyle veri bağlayabilirsiniz.

✅

OData CRUD

OData servisleriyle okuma-yazma ekranları geliştirebilirsiniz.

✅

Routing

Master-detail ve çok sayfalı navigasyon kurabilirsiniz.

✅

Fiori elements

Annotation tabanlı hızlı uygulama şablonları üretebilirsiniz.

✅

Özel bileşen

Fragment ve özel kontrollerle yeniden kullanılabilir arayüz yazabilirsiniz.

✅

Test yazma

QUnit ve OPA5 ile otomatik testler hazırlayabilirsiniz.

✅

Yayına alma

Uygulamayı build edip Fiori launchpad'e entegre edebilirsiniz.

Kimler İçin Uygundur?

SAP ve web geliştiricileri
ABAP'tan UI katmanına geçmek isteyenler
Fiori uygulama geliştiricileri için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?

SAP ve web geliştiricileri, ABAP'tan arayüz geliştirmeye geçenler ve Fiori uygulama geliştirmek isteyenler için uygundur.

UX400 nedir?

SAP'nin SAPUI5 ile arayüz geliştirme müfredat kodudur; eğitim bu konu başlıklarıyla örtüşen özgün içerikle verilir ve SAP resmi kursu değildir.

OData v4 de işleniyor mu?

Ağırlık v2'dedir, v4 model farkları ve geçiş noktaları anlatılır.

Test konusu var mı?

Evet, QUnit birim testleri ve OPA5 entegrasyon testleri işlenir.

Sertifika alınır mı?

Katılımcılara Digital Vizyon Akademi Katılım ve Başarı Sertifikası verilir.

Sertifikalandırma

Bu eğitim Digital Vizyon Akademi Başarı Sertifikası ile tamamlanır.

Eğitim başında “Ön Test”, bitiminde “Son Test” uygulanarak gelişim ölçümlenir. Değerlendirme formunu dolduran katılımcılar sertifikalarını alır. Sertifikanızın geçerliliğini Sertifika Sorgulama sayfasından doğrulayabilirsiniz.

Örnek Sertifika

UX400 - DEVELOPING UIS WITH SAPUI EĞİTİMİ

Eğitim Hakkında

Neden Bu Eğitim?

Anahtar Konular

Ön Koşullar

Eğitim İçeriği

Proje Yapısı

MVC ve View

Veri Bağlama

Tablo ve Liste Kontrolleri

OData Entegrasyonu

Routing ve Navigation

Fiori Elements

Özelleştirme ve Erişilebilirlik

Birim Testleri

OPA5 Entegrasyon Testleri

Güvenlik ve Kalite

Yayın ve Bakım

Eğitim Kazanımları

Kimler İçin Uygundur?

Sıkça Sorulan Sorular

Sertifikalandırma

Eğitim Bilgileri

Bu Eğitimle Birlikte Tercih Edilenler

Go Programlama Öğrenimi Eğitimi

GPU Programlama Girişine Eğitimi

GPU Programlama ile OpenACC Eğitimi

Hybrid Deployments Eğitimi

IBM App Connect Enterprise Application Development I (WM686G) Eğitimi