สัปดาห์ที่ 14: Testing, DevOps และการ Deploy

สัปดาห์นี้เรียนรู้กระบวนการส่งมอบเว็บแอปให้มีคุณภาพ ตั้งแต่ Unit Testing, E2E Testing, Git Workflow, CI/CD, Docker และการ Deploy Angular บน Firebase Hosting, Netlify หรือ VPS

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

  1. เขียน Unit Test ด้วย Jasmine/Karma และ Angular TestBed ได้
  2. อธิบาย E2E Testing ด้วย Cypress หรือ Playwright ได้
  3. ใช้ Git Branching, Pull Request และ Conventional Commits ได้
  4. สร้าง GitHub Actions Workflow สำหรับ test/build ได้
  5. อธิบาย Docker Image, Container, Dockerfile และ docker-compose ได้
  6. เลือกแนวทาง Deploy Angular ให้เหมาะกับ Firebase, Netlify หรือ VPS ได้

บทเรียนย่อย

ลำดับ หัวข้อ ไฟล์บทเรียน สไลด์
1 Unit Testing ด้วย Jasmine และ Karma webprogram-14-testing-deploy-01-unit-testing-jasmine-karma.md webprogram-14-testing-deploy-01-unit-testing-jasmine-karma-slides.mdx
2 E2E Testing เบื้องต้นด้วย Cypress หรือ Playwright webprogram-14-testing-deploy-02-e2e-testing-cypress-playwright.md webprogram-14-testing-deploy-02-e2e-testing-cypress-playwright-slides.mdx
3 Version Control ด้วย Git: branching, merge, pull request webprogram-14-testing-deploy-03-git-version-control.md webprogram-14-testing-deploy-03-git-version-control-slides.mdx
4 CI/CD เบื้องต้น: GitHub Actions webprogram-14-testing-deploy-04-cicd-github-actions.md webprogram-14-testing-deploy-04-cicd-github-actions-slides.mdx
5 Docker เบื้องต้น: Container, Image, docker-compose webprogram-14-testing-deploy-05-docker-basics.md webprogram-14-testing-deploy-05-docker-basics-slides.mdx
6 การ Deploy Angular บน Firebase Hosting, Netlify หรือ VPS webprogram-14-testing-deploy-06-deploy-angular-hosting.md webprogram-14-testing-deploy-06-deploy-angular-hosting-slides.mdx

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

  1. เริ่มจาก Unit Test เพื่อทดสอบ logic และ component
  2. ต่อด้วย E2E Test เพื่อทดสอบ workflow เหมือนผู้ใช้จริง
  3. จัดการ source code ด้วย Git และ Pull Request
  4. รัน test/build อัตโนมัติด้วย CI/CD
  5. เข้าใจ container ด้วย Docker
  6. เลือก platform สำหรับ deploy Angular

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

  1. Unit Test และ E2E Test ต่างกันอย่างไร
  2. data-testid ช่วยให้ test เสถียรขึ้นอย่างไร
  3. Pull Request ช่วยลด bug ก่อน merge ได้อย่างไร
  4. GitHub Secrets ใช้เก็บข้อมูลประเภทใด
  5. Image และ Container ต่างกันอย่างไร
  6. ทำไม Angular SPA บน Nginx ต้องใช้ try_files $uri /index.html

กลับรายวิชา