> For the complete documentation index, see [llms.txt](https://pond-3.gitbook.io/pond-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://pond-3.gitbook.io/pond-docs/8-fronend.md).

# บทที่ 8 -Fronend

> **Frontend** เป็นส่วนที่ผู้ใช้งานโต้ตอบโดยตรงกับระบบ ทำหน้าที่แสดงผลข้อมูลจาก Backend ผ่าน User Interface (UI) และสื่อสารกับ Backend ผ่าน API บทนี้จะอธิบายแนวคิดพื้นฐานของ Frontend การเชื่อมต่อกับ Backend และการเตรียมระบบ Frontend ให้พร้อมสำหรับการใช้งานร่วมกับ Docker และ CI/CD

#### **วัตถุประสงค์ของบทนี้**

* เข้าใจโครงสร้างการทำงานของ Frontend 
* สามารถเชื่อมต่อ Frontend กับ Backend ผ่าน API
* เตรียม Frontend ให้พร้อมสำหรับการใช้งานร่วมกับ Docker และ CI/CD
* Deploy ระบบ Frontend ไปใช้งานจริง

***

#### **การนำ Frontend ไปใช้งาน**

* เชื่อมต่อกับ Backend API
* แสดงผลข้อมูลแบบ Real-time
* ทำงานร่วมกับ Docker และ Docker Compose
* Deploy ผ่าน GitLab CI/CD ไปยัง Production

***