Dersin Adı Dersin Seviyesi Dersin Kodu Dersin Tipi Dersin Dönemi Yerel Kredi AKTS Kredisi Ders Bilgileri
FRONT-END DEVELOPMENT Birinci Düzey YZ 302 6 5.00 5.00 Yazdır
   
Dersin Tanımı
Ön Koşul Dersleri -
Eğitimin Dili English
Koordinatör DR. ÖĞR. ÜYESİ BİLGE KAĞAN DEDETÜRK
Dersi Veren Öğretim Eleman(lar)ı DR. ÖĞR. ÜYESİ BİLGE KAĞAN DEDETÜRK
Yardımcı Öğretim Eleman(lar)ı -
Dersin Veriliş Şekli Formal education
Dersin Amacı This course teaches students how to build modern web applications using the Angular framework. Students will learn TypeScript fundamentals, component-based architecture, routing, forms, HTTP communication, state management, testing, and performance optimization. By the end, students should be able to develop, test, and deploy production-ready single-page applications.
Dersin Tanımı FRONT-END DEVELOPMENT

Dersin İçeriği
1 Introduction to Angular. Setting up the Angular CLI workspace, creating a new project, understanding the project structure, bootstrapping, and Angular tooling (DevTools, VSCode).
2 TypeScript fundamentals. Variable declarations, arrow functions, optional chaining, nullish coalescing, types, interfaces, generics, and classes.
3 Structuring user interfaces with components. Component creation, template syntax, data binding, class and style binding, input/output bindings, and event emitters.
4 Component lifecycle and advanced component features. Lifecycle hooks, change detection strategies, encapsulating CSS, accessing child components, and local reference variables.
5 Pipes and directives. Built-in and custom pipes, passing parameters to pipes, building custom directives, property binding, and dynamic data display.
6 Services and dependency injection. Creating services, constructor injection, the inject keyword, component-level and root-level providers, and overriding providers.
7 Reactive patterns. Callbacks, promises, observables, RxJS operators, subscribing/unsubscribing, and the async pipe. Signals, computed signals, and RxJS interoperability.
8 Midterm exam.
9 HTTP communication. Angular HTTP client, setting up a backend API, CRUD operations, authentication, authorization, and intercepting HTTP requests.
10 Routing. Configuring routes, route parameters, child routes, query parameters, lazy loading, route guards, and prefetching route data.
11 Forms. Template-driven forms, reactive forms, form builders, nested form groups, dynamic forms, built-in and custom validators, and form state management.
12 Error handling and Angular Material. Runtime error handling, global error handlers, HTTP error catching. Material Design components: form controls, navigation, layout, dialogs, and notifications.
13 Unit testing. Testing components, services, pipes, directives, forms, and routing. Stubs, spies, component harnesses, and asynchronous test strategies.
14 Building and deploying applications. Build configurations, environment management, bundle optimization. SSR, SSG, Core Web Vitals, image optimization, and deferrable views.
15 Final exam.
16
17
18
19
20

Dersin Öğrenme Çıktıları
1 Ability to set up an Angular project using the Angular CLI and understand the project structure.
2 Ability to use TypeScript features including types, interfaces, generics, and classes for Angular development.
3 Ability to build reusable components with input/output bindings, lifecycle hooks, and change detection strategies.
4 Ability to create custom pipes and directives to manipulate data and DOM behavior.
5 Ability to manage application state using services, dependency injection, observables, and signals.
6 Ability to communicate with backend APIs using the Angular HTTP client for CRUD operations, authentication, and authorization.
7 Ability to implement client-side routing with route parameters, guards, lazy loading, and data prefetching.
8 Ability to build and validate template-driven and reactive forms.
9 Ability to write unit tests for components, services, pipes, directives, and routing.
10 Ability to build, optimize, and deploy Angular applications for production environments.

*Dersin Program Yeterliliklerine Katkı Seviyesi
1 Temel Tasarım ve Biçimsel Kompozisyon
2 Tasarım Düşüncesi Becerisi
3 Kuramsal Bilgi Becerisi
4 Görsel İletişim ve Grafik Anlatım
5 Eleştirel Düşünme
6 Araştırma ve Yorumlama Becerileri
7 Kültürel Çeşitlilik ve Küresel Örnekler
8 Geniş Kapsamlı Tasarım
9 İletişim ve Disiplinlerarası Çalışma
10 Toplum ve Çevre Sorumluluğu
11 Yasal Sorumluluklar ve Mesleki Etik
12 Taşıyıcı Sistemler
13 Yapı Malzemeleri ve Uygulamaları
14 Proje ve Yapım Yönetimi
15 Çevre Kontrolü ve Servis Sistemleri
16 Sürdürülebilir Tasarım
17 Tarihi Çevre Koruma Bilinci
18 Tarihi Yapı ve Çevre Belgeleme
19 Mimari Çeşitlilik ve Yerel Mimarlıklar
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
Yıldızların sayısı 1’den (en az) 5’e (en fazla) kadar katkı seviyesini ifade eder

Planlanan Öğretim Faaliyetleri, Öğretme Metodları ve AKTS İş Yükü
  Sayısı Süresi (saat) Sayı*Süre (saat)
Yüz yüze eğitim 14 3 42
Sınıf dışı ders çalışma süresi (ön çalışma, pekiştirme) 14 2 28
Ödevler 0 0 0
Sunum / Seminer hazırlama 0 0 0
Kısa sınavlar 0 0 0
Ara sınavlara hazırlık 1 10 10
Ara sınavlar 1 2 2
Proje (Yarıyıl ödevi) 1 20 20
Laboratuvar 0 0 0
Arazi çalışması 0 0 0
Yarıyıl sonu sınavına hazırlık 1 15 15
Yarıyıl sonu sınavı 1 2 2
Araştırma 0 0 0
Toplam iş yükü     119
AKTS     5.00

Değerlendirme yöntemleri ve kriterler
Yarıyıl içi değerlendirme Sayısı Katkı Yüzdesi
Ara sınav 0 0
Kısa sınav 0 0
Ödev 0 0
Yarıyıl içi toplam   0
Yarıyıl içi değerlendirmelerin başarıya katkı oranı   0
Yarıyıl sonu sınavının başarıya katkı oranı   0
Genel toplam   0

Önerilen Veya Zorunlu Okuma Materyalleri
Ders kitabı
Yardımcı Kaynaklar

Ders İle İlgili Dosyalar