App Workshop 1 : เตรียมฐานข้อมูล (Database)



สำหรับเว็บแอปพลิเคชัน มีฐานข้อมูลหลากหลายประเภทที่สามารถเลือกใช้ได้ ขึ้นอยู่กับความต้องการและลักษณะของแอปพลิเคชันนั้นๆ โดยทั่วไป ฐานข้อมูลที่นิยมใช้งาน ได้แก่ MySQL, PostgreSQL, MongoDB, และ MariaDB

1. ติดตั้งฐานข้อมูล XAMPP (MySQL)

(หากที่เครื่องคอมพิวเตอร์ ทำการติดตั้งไว้แล้ว ให้ไปทำขั้นตอนต่อไป)

1.1 เปิดใช้งาน XAMPP ที่ XAMPP Control Panel ใน Control Panel ให้คลิกปุ่ม "Start" สำหรับ Apache และ MySQL เพื่อเปิดใช้งาน จากนั้นตรวจสอบว่า Apache และ MySQL ทำงานหรือไม่ ดูที่สถานะใน Control Panel (ควรเป็นสีเขียว)
(Capture หน้าจอ)


1.2 ทดสอบการใช้งาน XAMPP เปิดเว็บเบราว์เซอร์ พิมพ์ http://localhost หรือ http://127.0.0.1. หากหน้าเว็บ XAMPP แสดงขึ้นมา แสดงว่าการติดตั้งและเปิดใช้งาน XAMPP สำเร็จ
(Capture หน้าจอ)


1.3 จัดการฐานข้อมูล MySQL ให้เข้า phpMyAdmin พิมพ์ http://localhost/phpmyadmin ในเว็บเบราว์เซอร์
(Capture หน้าจอ)


1.4 สร้างฐานข้อมูลชื่อของคุณภาษาอังกฤษ ตัวอย่างนี้ใช้ waraporn
(Capture หน้าจอ)


1.5 สร้างตารางชื่อ user กำหนด id เป็น Primary Key และ AUTO_INCREMENT: A_I (กำหนด column ให้ตรงกับเอกสารความต้องการ v.3.0 ที่ได้ออกแบบ class ไว้ก่อนนี้)
(Capture หน้าจอ)



1.6 เพิ่มข้อมูลผู้ใช้ในตาราง โดยข้อมูลของคุณ อยู่รายการที่ 1 ส่วนข้อมูลอีก 3 รายการให้กรอกข้อมูลของเพื่อนในห้อง จากนั้น Export ตารางชื่อ user ส่งในไดรฟ์งานของคุณ


2 ทดลองใช้คำสั่ง SQL จัดการข้อมูล (CRUD)

2.1 ที่ตาราง user คลิกที่แถบเมนู SQL เพื่อทดลองเพิ่มข้อมูลด้วยคำสั่ง INSERT จากนั้นด้านล่างคลิกที่ INSERT code SQL จะปรากฎบนหน้าต่างด้านบน
(Capture หน้าจอ)


2.2 ให้คุณเพิ่มข้อมูลเพื่อนในห้อง จำนวน 1 ราย ตามจำนวน column ที่ระบุในเอกสารความต้องการ ข้อ 1.5 (ตัวอย่างนี้เพิ่มข้อมูลผู้ใช้ Dukdik ลงไป)
(Capture หน้าจอ)


2.3 กดปุ่ม go ด้านล่าง ข้อมูลผู้ใช้ในข้อ 2.2 จะถูกเพิ่มไปยังตาราง user
(Capture หน้าจอ)



2.4 เราสามารถคลิกที่ Edit inline ในตารางนั้นๆ เพื่อเรียกใช้คำสั่ง SQL ได้เช่นกัน ให้คลิกที่ Edit inline ของตาราง user ดังรูป หน้าต่าง SQL จะปรากฎ
(Capture หน้าจอ)



2.5 ให้ลองเรียกใช้คำสั่ง WHERE โดยพิมพ์ WHERE ต่อท้ายชื่อตาราง และระบุ id (id คือ ลำดับรายการที่ 4 ข้อมูลล่าสุดที่เพิ่มเข้าไป) ตัวอย่างนี้ใช้ id=013 ผลลัพธ์ดังรูป
(Capture หน้าจอ)



2.6 ทดลองปรับปรุงข้อมูลด้วยคำสั่ง UPDATE ทำการเปลี่ยนรหัสผู้ใช้ ผลลัพธ์ดังรูป
(Capture หน้าจอ)




2.7 ทดลองลบข้อมูลด้วยคำสั่ง DELETE ทำการลบผู้ใช้รายการที่ 4 ที่เพิ่มไปในข้อที่ 2.2 โดยพิมพ์ WHERE ต่อท้ายชื่อตาราง และระบุ id ตัวอย่างนี้ใช้ id=013 ผลลัพธ์ดังรูป
(Capture หน้าจอ)



2.8 ก่อนทำการลบข้อมูล ระบบจะแจ้งข้อความเตือนการลบทุกครั้ง ให้กด OK
(Capture หน้าจอ)