ผลต่างระหว่างรุ่นของ "01204223/flask-backend-db"
Jittat (คุย | มีส่วนร่วม) |
Jittat (คุย | มีส่วนร่วม) |
||
| (ไม่แสดง 1 รุ่นระหว่างกลางโดยผู้ใช้คนเดียวกัน) | |||
| แถว 60: | แถว 60: | ||
เพื่อเปิดเซิร์ฟเวอร์ของ frontend react | เพื่อเปิดเซิร์ฟเวอร์ของ frontend react | ||
| − | == | + | == ระบบฐานข้อมูล == |
| − | + | เพื่อความง่าย ในตอนแรกเราจะใช้ระบบฐานข้อมูล [https://sqlite.org/ sqlite] ซึ่งเป็น database system ที่เก็บข้อมูลในไฟล์ และมากับ Python แล้ว เมื่อเราทำเสร็จ เราจะย้ายไปทดลองกับ MySQL หรือ dbms ตัวอื่นที่นิสิตได้เคยติดตั้งตอนเรียนวิชา database | |
| + | |||
| + | == การติดตั้งไลบรารี SQLAlchemy และ SQLAlchemy-Flask == | ||
| + | |||
| + | เราจะใช้ [https://www.sqlalchemy.org/ SQLAlchemy] และ [https://flask-sqlalchemy.readthedocs.io/en/stable/ Flask-SQLAlchemy] โดยจะต้องติดตั้งไลบรารีเพิ่มเติม ให้เข้าไปในส่วน backend และ activate virtual environment ก่อน จากนั้นสั่ง | ||
| + | |||
| + | pip install Flask-SQLAlchemy | ||
| + | |||
| + | เมื่อติดตั้งเรียบร้อยแล้ว เราจะอัพเดทไฟล์ requirements.txt เพื่อให้รวมไลบรารีเหล่านี้ด้วย ถ้าเราลองสั่ง | ||
| + | |||
| + | pip freeze | ||
| + | |||
| + | เราจะได้รายการของไลบรารีทั้งหมดที่เราติดตั้งผ่าน pip เราจะเก็บข้อมูลดังกล่าวลงใน requirements.txt โดยสั่ง (เป็นการทำ redirection) | ||
| + | |||
| + | pip freeze > requirements.txt | ||
| + | |||
| + | การเก็บรายการไลบรารีแบบนี้จะมีประโยชน์เมื่อเราต้องการรันระบบของเราที่เครื่องอื่นนอกเหนือจากเครื่องที่เราใช้พัฒนาเอง (และจำเป็นตอนสร้าง container image ตอนที่เราเรียน DevOp ต่อไปด้วย) | ||
== โมเดลแรก == | == โมเดลแรก == | ||
รุ่นแก้ไขปัจจุบันเมื่อ 23:12, 17 มกราคม 2569
- หน้านี้เป็นส่วนหนึ่งของ 01204223
เราจะแก้ส่วน backend ให้ทำงานกับ database แทนที่เราจะเขียน SQL ตรง ๆ เราจะให้ไลบรารีที่เรียกว่า ORM (Object Relational Mapper) ที่ทำให้เราเขียน-อ่านกับข้อมูลในฐานข้อมูลผ่านทาง object
เนื้อหา
Code เริ่มต้นของ project
เพื่อความสะดวกเราจะเริ่มต้นจากโค้ดตัวอย่างที่รวบรวมมาแล้ว โดย clone จาก https://github.com/jittat/01204223-flask-react-todo-68
เราจะแยกไดเร็กทอรีภายในเป็น backend และ frontend ให้ไปติดตั้งไลบรารีของทั้งสองส่วนดังนี้
Backend
เข้าไปใน backend (ถ้าเป็น windows อย่าลืมใช้ cmd อย่าใช้ powershell)
cd backend
เราจะสร้าง virtual environment และติดตั้งไลบรารี ขั้นแรกสร้าง virtual environment ก่อน
python -m venv venv
แล้ว activate ถ้าเป็น linux/mac เรียก
./venv/bin/activate
ถ้าเป็น windows เรียก
venv\Scripts\activate.bat
เมื่อ activate venv แล้ว ให้เรียก pip เพื่อติดตั้งไลบรารี เราได้รวบรวมรายกายไลบรารีไว้ในไฟล์ requirements.txt แล้ว ดังนั้นเราจะสั่ง
pip install -r requirements.txt
เพื่อติดตั้งได้เลย ถ้าติดตั้งเรียบร้อยทดลองเรียก flask backend ได้
ขั้นแรก ถ้าเป็น linux/mac ให้เรียก
export FLASK_APP=main.py
ถ้าเป็น windows เรียก
set FLASK_APP=main.py
แล้วเรียก
flask run --debug
Frontend
เปิดอีก terminal หนึ่ง แล้วเรียก
cd frontend
เรียก npm เพื่อติดตั้งไลบรารี
npm install
แล้วเรียก
npm run dev
เพื่อเปิดเซิร์ฟเวอร์ของ frontend react
ระบบฐานข้อมูล
เพื่อความง่าย ในตอนแรกเราจะใช้ระบบฐานข้อมูล sqlite ซึ่งเป็น database system ที่เก็บข้อมูลในไฟล์ และมากับ Python แล้ว เมื่อเราทำเสร็จ เราจะย้ายไปทดลองกับ MySQL หรือ dbms ตัวอื่นที่นิสิตได้เคยติดตั้งตอนเรียนวิชา database
การติดตั้งไลบรารี SQLAlchemy และ SQLAlchemy-Flask
เราจะใช้ SQLAlchemy และ Flask-SQLAlchemy โดยจะต้องติดตั้งไลบรารีเพิ่มเติม ให้เข้าไปในส่วน backend และ activate virtual environment ก่อน จากนั้นสั่ง
pip install Flask-SQLAlchemy
เมื่อติดตั้งเรียบร้อยแล้ว เราจะอัพเดทไฟล์ requirements.txt เพื่อให้รวมไลบรารีเหล่านี้ด้วย ถ้าเราลองสั่ง
pip freeze
เราจะได้รายการของไลบรารีทั้งหมดที่เราติดตั้งผ่าน pip เราจะเก็บข้อมูลดังกล่าวลงใน requirements.txt โดยสั่ง (เป็นการทำ redirection)
pip freeze > requirements.txt
การเก็บรายการไลบรารีแบบนี้จะมีประโยชน์เมื่อเราต้องการรันระบบของเราที่เครื่องอื่นนอกเหนือจากเครื่องที่เราใช้พัฒนาเอง (และจำเป็นตอนสร้าง container image ตอนที่เราเรียน DevOp ต่อไปด้วย)