บทนำ
ถ้าทุกท่าน สามารถเขียน Python โดยใช้ Flaskได้ เราจะสามารถสร้างสรรค์ไอเดียต่าง ๆ ที่มีในหัวเราให้เป็นจริงได้ หรือแม้กระทั่งโอกาสในการทำงานด้าน Web Development ในอนาคต หรือแม้กระทั่งต่อยอด IoT หรือไม่ก็ Machine Learning เข้าในโปรเจคท์ของเราในอนาคตได้ ซึ่งทุกอย่างที่กล่าวมา Flask สามารถประยุกต์เข้าด้วยได้ทั้งสิ้น
ซึ่ง Flask เป็นหนึ่งในเฟรมเวิร์คด้านเว็บของภาษาไพธอนที่ได้รับความนิยมอย่างสูงถ้าเป็นโปรเจคท์เล็ก ๆ ไปจนถึงระดับกลางไม่ซับซ้อนมาก Flask ตอบโจทย์ท่านแน่นอนครับ
Table of Contents
1. Flask Introduction
- flask คืออะไร ทำไมถึงได้รับความนิยม
- HTTP Request / Response Cycles
- Template คืออะไร โครงสร้างเป็นอย่างไร
- Static คืออะไร โครงสร้างเป็นอย่างไร
- Flask hello world app
2. เริ่มต้นสร้าง Flask App แรก
- เริ่มต้นสร้าง Flask โปรเจคท์จาก 0
- ติดตั้ง Flask และอิมพอร์ตไลบรารี่ที่เกี่ยวข้องต่าง ๆ มาใช้งาน
- สร้างฟังก์ชันเพื่อใช้งาน
- กำหนด Route (URLs) ให้กับ function
- Response ข้อความไปแสดงผลในหน้าเว็บ
- Render Template (ส่งหน้า HTML) ไปแสดงผลหน้าเว็บ
- Runserver และ Debug Modes
3. HTML & CSS
- HTML (Hyper Text Markup Language) คืออะไร และทำไมถึงมีความสำคัญมากในการทำเว็บ
- ทำความรู้จักกับ Tags ต่าง ๆ ของ HTML
- เริ่มต้นเขียน HTML กับพื้นฐานต่าง ๆ ที่จำเป็นที่สุด เพื่อให้สามารถต่อยอดศึกษาเองได้
- CSS (Cadcading Style Sheet) คืออะไร และทำไมถึงต้องใช้คู่กันกับ HTML
- ทำความรู้จักกับส่วนประกอบต่าง ๆ ของ CSS ไม่ว่าจะเป็น Selector, Class, Value
- เริ่มต้นเขียนและใช้งาน CSS ต่าง ๆ ที่จำเป็นที่สุด เพื่อให้สามารถต่อยอดไปศึกษาได้
- เมื่อเข้าใจพื้นฐานทั้ง HTML และ CSS ดีแล้ว จากนั้นจะเป็นการนำมาประยุกต์ใช้งานกับ Flask App
4. JavaScript
- ทำความรู้จักกับ JavaScript ซึ่งเป็นภาษาครอบจักรวาลอีกภาษาหนึ่ง โครงสร้างภาษาเป็นอย่างไร
- เริ่มต้นเขียน JavaScript และทำความเข้าใจกับ Syntax ต่าง ๆ
- นำ JavaScript มาประยุกต์ใช้กับ Flask App
5. Flask เชื่อมต่อฐานข้อมูล (Database)
- ฐานข้อมูล (Database) คืออะไร ทำไมถึงมีความสำคัญในการสร้างเว็บหรือแอพต่าง ๆ เรียกแทบจะได้ว่า เป็นอีกหนึ่งสิ่งที่ขาดไม่ได้สำหรับการสร้างแอพเกือบทุกแอพบนโลกนี้
- ทำความรู้จักกับ SQLite ซึ่งเป็นฐานข้อมูลที่เล็ก เบา ติดตั้งสะดวก ใช้งานง่าย เป็นหนึ่งในฐานข้อมูลที่ได้รับความนิยมสูงสุดในการเริ่มต้นศึกษาฐานข้อมูล
- ทำการสร้างฟีลด์ (คอลัมน์ต่าง ๆ) ออกแบบฐานข้อมูล เพื่อใช้เก็บข้อมูลที่ต้องการ
- Database Migration
- ทดสอบสร้างข้อมูลตัวอย่างเข้าไปเก็บในฐานข้อมูล
- DB Browser ตัวจัดการฐานข้อมูลสำหรับ SQLite
6. ดึงข้อมูลจาก Database มาแสดงผล
- เมื่อสร้างฐานข้อมูลเสร็จแล้ว ก็จะเป็นการดึงข้อมูลมาแสดงผลในหน้าเว็บ
- การดึงข้อมูลมาแสดงผลในรูปแบบต่าง ๆ
7. Bootstrap
- ทำความรู้จักกับ Bootstrapว่าทำไมถึงเป็น Frontend (CSS) Library ที่ได้รับความนิยมสูงสุดในโลก
- การติดตั้ง Bootstap เพื่อใช้งาน มีวิธีการติดตั้งแบบไหนบ้าง
- รู้จักกับ Bootstrap CDN ทำไมถึงต้องใช้ และในกรณีไหนที่ไม่ใช้
- รู้จักกับ classes และ components ต่าง ๆ ของ Bootstrap
8. Custom Bootstrap Navigation Bar
- ทำการตั้งค่า เพื่อปรับสไตล์ สีต่าง ๆ ของ Bootstrap เพื่อให้ไม่ต้องซ้ำกับของที่มีอยู่ ให้เป็นตีมสีหรือสไตล์ของตัวเองได้ตามต้องการ
9. ดึงข้อมูล Covid-19 มาแสดงในตารางผ่าน API
- ดึงข้อมูลโควิด 19 มาแสดงผล โดยผ่าน API ของกรมควบคุมโรค กระทรวงสาธารณสุข ที่เก็บข้อมูลแบบ JSON ฟอร์แมตไว้ โดยทำได้โดยการใช้ Python Script ในการรันสคริปต์เพื่อดึงข้อมูล JSON มาเก็บโดยใช้ไลบรารี requests และ json ของไพธอน จากนั้นทำการแปลงเป็น Python Dictionary (Python Data Type) และดึงไปแสดงผลหน้าเว็บในภายหลังได้
- ดึงข้อมูลเสร็จนำมาเก็บไว้ในรูปแบบของ CSV ไฟล์
- import ข้อมูลที่จาก Python โมดูลที่สร้างแยกที่ชื่อว่า covid19.py เข้ามาใน app.py (Main File)
- ส่งข้อมูลออกไปแสดงผลที่หน้า HTML
- รับข้อมูลที่ส่งจากฝั่ง Backend (Flask) และจัดฟอร์แมตแสดงผลในตารางได้อย่างถูกต้อง
10. ดึงข้อมูล Covid-19 มาแสดงแบบ Dashboard ผ่าน API
- เมื่อแสดงผลในตารางเรียบร้อยและรู้คอนเซ็ปต์ในการดึงข้อมูลมาแสดงผลแล้ว จากนั้นจะเป็นการดึงมาแสดงผลในรูปแบบ Dashboard แบบง่าย ๆ แต่สวยงามและดูง่าย สามารถทำเป็น Data Visualization ได้ โดยใช้เพียงแค่ HTML เพียว ๆ
- เรียนรู้การวาง Components ต่าง ๆ รวมถึงการใช้ jinja2 template ซึ่งเป็น template language ของ Flask ที่ช่วยให้สามารถเขียน Python ลอจิกในฝั่ง HTML ได้
11. ทำ App สุ่มเมนูอาหาร
- ทำเวิร์คช็อปแอพสุ่มเมนูอาหาร โดยเกิดจากไอเดียที่ว่า ในวันนี้ไม่รู้จะกินอะไร เลยเป็นที่มาของการทำแอพสุ่มเมนู
12. CRUD App - Create
- เรียนรู้การทำ CRUD App ซึ่งเป็นแนวคิดพื้นฐานของแทบจะทุกแอพบนโลกนี้ ทำความเข้าใจว่า CRUD (Create, Read, Update, Delete) คืออะไร และสำคัญอย่างไร Use Case จริงเป็นอย่างไรบ้าง (ยกตัวอย่างการใช้งานของ Facebook)
- ทำการ Create (สร้าง) ข้อมูล
13. CRUD App - Read
- ทำการ Read (อ่าน) ข้อมูล/ดึงข้อมูล
14. CRUD App - Update
- ทำการ Update (แก้ไข) ข้อมูลเดิมที่ได้สร้างไว้ก่อนหน้า
15. CRUD App - Delete
- ทำการ Delete (ลบ) ข้อมูล
16. Flask Authentication Systems - Hash Password & Sign up (บทความ)
- ทำความเข้าใจกับระบบ Authentication Systems ซึ่งรวมไปถึง Log in, Log out
- สอนทำระบบ Registration/Sign up (ลงทะเบียน)
- ทำความรู้จักกับ Hash Password และความสำคัญของการทำ Hash เพื่อให้ระบบและ Password ของเรามีความปลอดภัยมากยิ่งขึ้น
- ใช้งาน Flask Wergzug ซึ่งเป็น Package สำหรับระบบความปลอดภัยของ Flask ซึ่งจะมี Hash Function สำหรับ Hash รหัสผ่านที่เราได้สร้างจากการลงทะเบียน แทนที่จะเก็บในรูปแบบของ Plain Text
- ทำความเข้าใจและใช้งาน LoginManager, login_required, user_loader
17. Flask Authentication Systems - Log in (บทความ)
- ทำความเข้าใจเกี่ยวกับระบบ Log in ทำไมถึงต้องมีการสร้างล็อกอิน (การยืนยันตัวตนเข้าใช้งาน)
- ทำความเข้าใจกับ Hash function ที่จะช่วยตรวจสอบ Hash password ที่เราได้สร้างจากการ Sign up ก่อนหน้า เพื่อให้สามารถระบุตัวตนของผู้ใช้งานได้
- ทำความเข้าใจและใช้งาน UserMixin ซึ่งเป็นคลาสที่สะดวกและรวดเร็วในการสืบทอดเมธอดต่าง ๆ เกี่ยวกับระบบ User Authentication Systems มาใช้งานในคลาส User ที่ได้สร้างไว้ก่อนหน้า
- ทำความรู้จักและใช้งาน flask_wtf ซึ่งเป็นไลบรารี่ยอดนิยมของ Flask ที่ใช้สำหรับจัดการฟอร์มได้สะดวกและรวดเร็ว
- ทำความเข้าใจและใช้งาน check_password_hash, SECRET_KEY
18. Flask Authentication Systems - Log out (บทความ)
- ทำความเข้าใจเกี่ยวกับการ Log out ทำไมถึงต้องมีการทำล็อกเอาท์
- ทำความเข้าใจและใช้งานฟังก์ชันที่ใช้สำหรับทำการ Log out
- ทำความรู้จักและใช้งาน Message Flashing ว่าคืออะไร ทำไมถึงมีความสำคัญ เช่น เป็นการแจ้งเตือนผู้ใช้ ซึ่งส่งผลดีต่อประสบการณ์ผู้ใช้งานของผู้ใช้ หรือ UX (User Experience) อีกด้วย
19. Deploy Flask App to PythonAnywhere (เอกสาร PDF)
- เสร็จสิ้นการทำเว็บและได้ความรู้แบบจัดเต็มมาเรียบร้อย แต่ตอนนี้เว็บยังดูได้เพียงแค่ใน Localhost หรือเครื่องคอมพิวเตอร์ของเรา ดังนั้นจึงเป็นขั้นตอนสุดท้ายคือการนำเว็บอัพขึ้นเซิร์ฟเวอร์ โดยตัวแพลตฟอร์มที่จะใช้บริการในคอร์ส Python Web Development with Flask นี้ก็คือ PythonAnywhere ซึ่งฟรี และใช้งานง่ายมาก ๆ
Congratulations, you’re complete this course. Keep doing good job.
****
คอร์สนี้เหมาะสำหรับใคร ?
- ท่านที่เริ่มศึกษาและเขียนภาษาไพธอน หรือเคยเขียนไพธอนมาบ้างแล้ว
- ท่านที่ได้ศึกษาภาษาไพธอนมาบ้างแล้ว แต่ก็ยังไม่รู้ว่าจะนำไปประยุกต์ใช้งานด้านไหนดี ซึ่งสายเว็บเป็นอีกด้านหนึ่งที่น่าสนใจและยังคงจะได้รับความนิยมไปอีกยาวนาน
- ท่านที่สนใจเริ่มต้นศึกษาด้าน Web Development ของภาษาไพธอน และนำไปต่อยอดพัฒนาเว็บไซต์และเว็บแอปพลิเคชันต่อไป ซึ่งไม่เพียงแต่ด้านเว็บเท่านั้น เมื่อมีพื้นฐานที่ดีแล้ว สามารถต่อยอดและนำด้านเว็บไปประยุกต์ได้อีกหลายสายงาน
ตัวอย่างหน้าเว็บไซต์
(แจ้งรายละเอียดการชำระเงินและลงทะเบียน)
- ยอดเงินที่ต้องชำระ: 2,500 บาทถ้วน
- ปล.สมาชิกคอร์สรวม Python Programming and Web Development Full Courses 2021 ซึ่งจ่ายครั้งเดียว เรียนได้ทุกคอร์สตลอดปี 2021 อัปเดตเรียนได้ฟรี
ขั้นตอนการสมัครเรียนคอร์สนี้
- เพิ่มเพื่อนใน Line Official เพื่อสอบถามข้อมูลเพิ่มเติมลงที่เบียน ลิ้งค์ เพื่อเพิ่มเพื่อนและสมัครสุดง่าย
- ชำระตังค์และข้อมูลเพื่อเป็นหลักฐานการสมัครเช่น ชื่อผู้สมัคร, อีเมล์, เบอร์โทรศัพท์ เป็นต้น เป็นอันเสร็จสิ้นการสมัคร
ขอให้มีความสุขและสนุกในการเรียนครับ