AngularUI Backend Utilities Eğitimi

Eğitim Hakkında

AngularUI ekosisteminde sunucu verisi, durum geçişleri ve hata yönetimi

Bu eğitim, AngularJS tabanlı uygulamalarda AngularUI araçlarıyla arka uç iletişimini düzenlemeyi anlatır. UI-Router state tanımları ve resolve ile veri ön yükleme, $http ve $resource kullanımı, interceptor ile kimlik doğrulama ve hata yakalama, promise zincirleri, önbellekleme, sayfalama ve REST API tüketimi, birim testlerde $httpBackend ile sahteleme uygulamalı işlenir.

Süre ve Format

2 Gün. Her gün dört modül; 1. günde Durum Yönetimi ve Veri Ön Yükleme ve 2. günde HTTP İletişimi, Güvenlik ve Test ele alınır, her modül uygulamalı çalışmayla pekiştirilir.

Seviye

Orta Seviye — AngularJS uygulamalarında UI-Router resolve, $http, $resource ve sunucu entegrasyon yardımcıları

Öğrenme Metodu

Örnek bir REST API'ye bağlı AngularJS uygulaması üzerinde resolve, interceptor ve test senaryoları adım adım kodlanır.

Neden Bu Eğitim?

🎯Düzenli Veri Akışı

Resolve ile verinin ekran açılmadan hazır olmasını sağlayıp titreyen boş sayfaları ortadan kaldırırsınız.

⚙️Merkezi Hata Yönetimi

Interceptor ile 401, 500 ve zaman aşımı durumlarını tek noktada yakalarsınız.

🚀Test Edilebilirlik

$httpBackend ile sunucu olmadan veri katmanı testleri yazarsınız.

Anahtar Konular

AngularUIUI-RouterAngularJS $http$resourceinterceptorresolve$httpBackendAngularJS RESTpromise yönetimiAngularJS eğitimi

“Arayüz ne kadar parlak olursa olsun, veri katmanı sağlam değilse kullanıcı bunu ilk hatada hisseder.”

Ön Koşullar

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

1

JavaScript Bilgisi

ES5 düzeyinde closure ve promise kavramlarını bilmek gerekir.

2

AngularJS Temelleri

Controller, service ve directive kavramlarına aşinalık beklenir.

3

HTTP ve REST

HTTP metotları ve durum kodları hakkında temel bilgi faydalıdır.

4

Geliştirme Ortamı

Node.js, npm ve bir kod editörü kurulu olmalıdır.

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ı UI-Router ile durumları tanımlar ve verileri resolve ile ekrandan önce yükler.

Modül 1

UI-Router State Mimarisi

$stateProvider.state ile url, templateUrl ve controller tanımı
İç içe (nested) state ve ui-view hiyerarşisi
Soyut (abstract) state ile ortak düzen paylaşımı
$stateParams, url parametreleri ve sorgu parametreleri
$state.go, ui-sref ve ui-sref-active kullanımı
$urlRouterProvider.otherwise ve when ile yönlendirme kuralları

Modül 2

Resolve ile Veri Yükleme

resolve nesnesi ve promise döndüren bağımlılıklar
Resolve sonucunun controller'a enjeksiyonu
Üst state'ten alt state'e resolve mirası
Resolve hatasında $stateChangeError ve geri düşüş ekranı
Yükleme göstergesi için $stateChangeStart ve $stateChangeSuccess olayları
Resolve'da gereksiz sunucu çağrılarının önbellekle azaltılması

Modül 3

Promise ve $q Kullanımı

$q.defer, resolve, reject ve zincirleme then
$q.all ile paralel isteklerin birleştirilmesi
$q.when ile senkron değerin sarmalanması
Hata yayılımı ve catch/finally yerleşimi
Promise anti-pattern: iç içe geri çağırma yerine zincirleme
Zaman aşımı ve iptal için timeout promise'i

Modül 4

Servis Katmanı Tasarımı

Factory ve service farkı ile veri erişim servisi yazımı
Controller'dan $http çağrısını ayırma ve tek sorumluluk
Servis içinde veri önbelleği ve $cacheFactory
Sabit değerler için constant ve value, ortam ayarı için config
Ortak API temel adresi yönetimi
Modül bağımlılıkları ve yükleme sırası

Günün hedefiKatılımcı REST iletişimini kurar, interceptor ile hata ve kimlik doğrulamayı yönetir ve test yazar.

Modül 1

$http ve $resource

$http ile GET, POST, PUT, DELETE çağrıları ve config nesnesi
Varsayılan başlıklar ve $httpProvider.defaults
$resource ile RESTful nesne eylemleri (query, get, save, remove)
Özel $resource eylemleri ve URL parametre eşleme
transformRequest ve transformResponse ile veri dönüşümü
JSONP ve CORS ön uç sorunları

Modül 2

Interceptor ve Kimlik Doğrulama

request, response ve responseError interceptor'ları
Bearer token'ın Authorization başlığına otomatik eklenmesi
401 yanıtında oturum yenileme ve istek yeniden oynatma
Giriş sayfası yönlendirmesi ve state erişim kontrolü
Token saklama seçenekleri ve XSS/CSRF riskleri
Yükleme çubuğu için bekleyen istek sayacı

Modül 3

Sayfalama, Filtreleme ve Hata Yönetimi

Sunucu taraflı sayfalama ve sıralama parametreleri
Arama kutusunda debounce ile istek azaltma
Hata iletilerinin kullanıcıya gösterilmesi ve günlüğe yazılması
Yeniden deneme (retry) stratejisi ve üstel geri çekilme
Çevrimdışı durum algılama ve kullanıcı bilgilendirmesi
$exceptionHandler ile global hata yakalama

Modül 4

Birim Test ve Entegrasyon

Jasmine ve Karma ile test ortamı kurulumu
ngMock ve $httpBackend.expectGET/whenGET kullanımı
$httpBackend.flush ve $rootScope.$digest ihtiyacı
Resolve ve servislerin sahte veriyle test edilmesi
Interceptor'ların izole testi
Kapsam (coverage) raporu ve CI'da çalıştırma

Eğitim Kazanımları

Program sonunda katılımcılar:

✅

State Tasarımı

İç içe state'lerle ölçeklenebilir yönlendirme yapısı kurabilirsiniz.

🧩

Resolve Kullanımı

Verileri ekran açılmadan önce hazırlayıp hata durumlarını yönetebilirsiniz.

🛠️

Promise Yönetimi

$q ile paralel ve ardışık asenkron işlemleri düzenleyebilirsiniz.

📊

Servis Katmanı

Veri erişimini controller'dan ayıran temiz servisler yazabilirsiniz.

🔍

REST Tüketimi

$http ve $resource ile CRUD işlemlerini uygulayabilirsiniz.

🧪

Interceptor Yazımı

Token ekleme ve 401 işleme akışını merkezi olarak kurabilirsiniz.

📐

Hata Dayanıklılığı

Retry ve global hata yakalama ile kararlı bir istemci geliştirebilirsiniz.

🚀

Birim Test

$httpBackend ile veri katmanını sunucusuz test edebilirsiniz.

Kimler İçin Uygundur?

AngularJS 1.x kod tabanlarını sürdüren ön yüz geliştiricileri
eski uygulamaları modernleştirmeden önce veri katmanını düzenlemek isteyen ekipler için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?

AngularJS 1.x kod tabanlarını sürdüren ön yüz geliştiricileri ve eski uygulamaları modernleştirmeden önce veri katmanını düzenlemek isteyen ekipler için uygundur.

AngularJS hâlâ kullanılıyor mu?

Birçok kurumsal sistem AngularJS 1.x ile çalışmaktadır; eğitim bu uygulamaları sürdüren ve modernleştirmeye hazırlayan ekiplere yöneliktir.

Angular (2+) ile ilgisi var mı?

Hayır, içerik AngularJS 1.x ve AngularUI ailesine yöneliktir; yeni Angular için ayrı eğitimler vardır.

UI-Router mı ngRoute mu?

Eğitimde iç içe state ve resolve avantajları nedeniyle UI-Router kullanılır, ngRoute ile farkları açıklanır.

Sertifika veriliyor mu?

Programı tamamlayanlara 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

ANGULARUI BACKEND UTILITIES EĞİTİMİ