| รายการ | รายละเอียด |
|---|---|
| รหัสรายวิชา | DEV_TOOLS001 |
| ชื่อรายวิชา | เครื่องมือในการพัฒนาเว็บแอปพลิเคชัน |
| ชื่อภาษาอังกฤษ | Web Application Development Tools |
| ลักษณะรายวิชา | รายวิชา/โมดูลเตรียมความพร้อมสำหรับการพัฒนาเว็บแอปพลิเคชัน |
| กลุ่มผู้เรียน | ผู้เริ่มต้นพัฒนา Web Application หรือผู้เตรียมเข้าสู่รายวิชา Full Stack |
รายวิชานี้แนะนำเครื่องมือและซอฟต์แวร์ที่ใช้ในการพัฒนาเว็บแอปพลิเคชัน ตั้งแต่การออกแบบระบบ การเขียนโปรแกรม การจัดการเวอร์ชัน การทดสอบ การจัดการฐานข้อมูล การสร้าง REST API การ Deploy ระบบ และการประยุกต์ใช้ AI เพื่อช่วยพัฒนาซอฟต์แวร์อย่างเหมาะสม
ผู้เรียนจะเห็นภาพรวมของกระบวนการพัฒนา Web Application ตั้งแต่แนวคิด SDLC, Agile, DevOps, CI/CD ไปจนถึงการเลือกใช้เครื่องมือสำหรับ Front-end, Back-end, Database, API, Container, Web Server, Cloud, Testing, Documentation และ Collaboration
เมื่อเรียนจบรายวิชา ผู้เรียนสามารถ
| ลำดับ | หัวข้อ | เนื้อหา/สไลด์ |
|---|---|---|
| 1 | เครื่องมือในการพัฒนาเว็บแอปพลิเคชัน | บทเรียน / สไลด์ |
| ช่วงกิจกรรม | รายละเอียด |
|---|---|
| นำเข้าสู่บทเรียน | อภิปรายปัญหาเมื่อต้องเริ่มพัฒนา Web Application จริง เช่น ไม่รู้จะติดตั้งอะไร ใช้เครื่องมือใด และทำงานร่วมกันอย่างไร |
| บรรยายและสาธิต | อธิบายกระบวนการพัฒนา เครื่องมือแต่ละประเภท และตัวอย่างการใช้งาน |
| Workshop | ติดตั้ง VS Code, Git, Node.js, PostgreSQL, Docker, Angular CLI และ Postman |
| Lab | สร้าง GitHub Repository, Clone Project, Run Angular Application และทดลอง Build Docker Container |
| AI Prompt Challenge | ให้ AI ช่วยแนะนำชุดเครื่องมือ สร้างขั้นตอนติดตั้ง วิเคราะห์ Docker และสรุปคำสั่ง Git |
| Mini Project | จัดเตรียม Development Environment สำหรับทีมพัฒนา Web Application พร้อมอธิบายบทบาทของเครื่องมือ |
| เครื่องมือ | วัตถุประสงค์ |
|---|---|
| Visual Studio Code | เขียนโปรแกรมและจัดการไฟล์โครงการ |
| Git | Version Control และติดตามประวัติการแก้ไข |
| GitHub | Source Code Repository และการทำงานร่วมกัน |
| Node.js | JavaScript Runtime สำหรับเครื่องมือ Front-end/Back-end |
| npm | Package Manager สำหรับติดตั้งไลบรารี |
| Angular CLI | สร้างและจัดการ Angular Application |
| PostgreSQL | ฐานข้อมูลเชิงสัมพันธ์ |
| pgAdmin | จัดการฐานข้อมูล PostgreSQL |
| Docker | สร้างและรันระบบแบบ Container |
| Caddy | Web Server และ Reverse Proxy |
| Postman | ทดสอบ REST API |
| Chrome DevTools | Debugging และตรวจสอบหน้าเว็บ |
| ChatGPT / GitHub Copilot | AI Assistant สำหรับช่วยเรียนรู้และช่วยพัฒนา |
| Figma | ออกแบบ UI และ Prototype |
ผู้เรียนจัดทำชุด Development Environment สำหรับทีมพัฒนา Web Application โดยมีอย่างน้อย