สัปดาห์ที่ 7: Angular พื้นฐานและโครงสร้างโปรเจกต์

สัปดาห์นี้เรียนรู้ภาพรวมของ Angular ตั้งแต่การใช้ Angular CLI, โครงสร้างโปรเจกต์, Component, Data Binding, Directives และ Lifecycle Hooks เพื่อเตรียมพร้อมสำหรับการสร้าง Web Application แบบเป็นระบบ

ผลลัพธ์การเรียนรู้

  1. ใช้ Angular CLI เพื่อสร้าง รัน สร้างไฟล์ และ build โปรเจกต์ได้
  2. อธิบายบทบาทของ Module, Component, Service, Pipe และ Directive ได้
  3. สร้าง Component และใช้งาน Data Binding ได้อย่างถูกต้อง
  4. ใช้ Directives เพื่อควบคุมการแสดงผลและรายการข้อมูลได้
  5. เลือกใช้ Lifecycle Hooks ให้เหมาะกับจังหวะการทำงานของ Component ได้

บทเรียนย่อย

ลำดับ หัวข้อ ไฟล์บทเรียน สไลด์
1 Angular CLI: ng new, ng generate, ng serve, ng build webprogram-07-angular-basic-01-angular-cli.md webprogram-07-angular-basic-01-angular-cli-slides.mdx
2 โครงสร้างโปรเจกต์: Module, Component, Service, Pipe webprogram-07-angular-basic-02-project-structure.md webprogram-07-angular-basic-02-project-structure-slides.mdx
3 Component: @Component decorator, template, styles, selector webprogram-07-angular-basic-03-component.md webprogram-07-angular-basic-03-component-slides.mdx
4 Data Binding: Interpolation, Property, Event, Two-way webprogram-07-angular-basic-04-data-binding.md webprogram-07-angular-basic-04-data-binding-slides.mdx
5 Directives พื้นฐาน: *ngIf, *ngFor, ngClass, ngStyle webprogram-07-angular-basic-05-directives.md webprogram-07-angular-basic-05-directives-slides.mdx
6 Angular Lifecycle Hooks: ngOnInit, ngOnChanges, ngOnDestroy webprogram-07-angular-basic-06-lifecycle-hooks.md webprogram-07-angular-basic-06-lifecycle-hooks-slides.mdx

ลำดับการเรียน

  1. อ่านบทเรียนย่อยตามลำดับ
  2. ทดลองคำสั่งและโค้ดตัวอย่างในเครื่อง
  3. ทำกิจกรรมท้ายบทของแต่ละหัวข้อ
  4. ทำแบบทดสอบหลังเรียนเพื่อประเมินความเข้าใจ

แบบทดสอบหลังเรียนภาพรวม

  1. Angular CLI ใช้ช่วยงานใดในการพัฒนา Angular
  2. Component ต่างจาก Service อย่างไร
  3. Interpolation และ Property Binding ใช้ต่างกันอย่างไร
  4. *ngFor ควรใช้ trackBy เมื่อใด
  5. เหตุใด ngOnDestroy จึงสำคัญเมื่อมี Observable หรือ Timer

กลับรายวิชา