ก่อนที่จะเริ่มทำทั้ง 2 ข้อที่กล่าว แนะนำให้ติดตั้งโปรแกรมที่จำเป็นในการ Deploy ML Model ในตอนนี้ก่อน ซึ่งมีด้วยกัน 2 โปรแกรม คือ Git และ Heroku ซึ่งสามารถ Download และติดตั้งได้จาก Link ด้านล่าง
เมื่อติดตั้งทั้ง 2 โปรแกรมเรียบร้อยแล้ว สามารถตรวจสอบได้ว่าติดตั้งได้สำเร็จหรือไม่ด้วยคำสั่งด้านล่าง ใน Command line ที่ใช้อยู่
git --version
heroku --version
ถ้า Command line สามารถ Return ค่าออกมาเป็นเลข Version ได้ แสดงว่าติดตั้งได้สำเร็จ
Web Application
สิ่งที่ขอเริ่มทำเป็นอย่างแรกคือ การสร้างหน้ากากให้กับ Web Application ก่อน ออกตัวก่อนว่าไม่ได้เชียวชาญการเขียน HTML หรือ CSS แต่ยังได้ความสวยงาม หรือ User friendly อยู่ ดังนั้นจึงเลือกออกแบบหน้าเว็บให้เป็น Text-box รอรับข้อมูล Input เพื่อส่งผ่านให้ Model คำนวณต่อไป
ดังนั้นจึงขออธิบาย Code HTML เฉพาะส่วนที่ต้องทำงานกับ Flask app เพียงเท่านั้น เท่ากับว่าพูดกันเฉพาะในส่วนที่เป็น <body>...</body>
สร้าง HTML File ขึ้นมา ตั้งชื่อว่า index.html
ต้องเก็บไว้ใน Folder ชื่อว่า templates
เพราะค่า Default ของ Flask ต้องการ HTML จาก Folder นี้เท่านั้น
เขียนรูปแบบของ Form โดยที่ action="{{url_for(‘getPredict’)}}”
เป็นการบอกให้หน้าเพจนี้ ทำ Action กับฟังก์ชั่นไหนจากหน้า Python script ซึ่งเขียนแบบนี้หมายความว่าให้เรียกใช้ฟังก์ชั่นชื่อว่า getPredict
ด้วย method="POST"
ส่วนที่เหลือเป็นออกแบบ HTML ให้มี Box ว่าง ๆ ทั้งหมด 3 อัน เพื่อรอรับค่าใส่เข้าไปเป็น Input ใน ML Model และตั้งชื่อเป็น x1, x2, x3
ตามลำดับ โดย name
ต้องตรงกับชื่อตัวแปรที่ตั้งเอาไว้ใน Python script เช่นกัน
สุดท้ายสร้างปุ่มขึ้นมาเพื่อ Trigger ที่บอกให้ ML Model เริ่มทำงาน หรือคือการ Prediction นั่นเอง โดยให้แสดงผลลัพธ์ออกมาที่บริเวณด้านล่างของหน้าเพจเดียวกัน สามารถเขียนให้แสดงผลออกมาได้ด้วย {{prediction_text}}
ซึ่งเป็นค่าที่ Return ออกมาจาก Python script ที่เขียนด้วย Flask
Flask
เมื่อได้ HTML สำหรับเป็น Interface แล้ว ต่อมาเป็นการเขียน Python script ด้วย Flask ตั้งชื่อว่า app.py
โดยส่วนมากแล้วโครงสร้างเหมือนกัน Function ที่เขียนไว้ที่ตอนก่อนหน้านี้ มีสิ่งที่ต้องอธิบายเพิ่มเติมคือ การทำงานร่วมกับ HTML เท่านั้น
ที่เพิ่มเติมมาคือ render_template
ซึ่งเอาไว้จัดการกับหน้า HTML การทำงานจึงถูกแบ่งออกเป็น 2 Functions คือ
- การ Render หน้า HTML: กำหนด Route ไปที่หน้าแรก
(‘/’)
จากนั้นเขียนmain()
เพื่อให้ Return HTML ด้วยrender_template(‘index.html’)
- การแสดงผลลัพธ์จากการ Model
getPredict
ที่มีชื่อเหมือน Action ใน HTML: กำหนด Route ไปที่หน้า(‘/predict’, method = [‘POST’])
ใช้request.form[]
เพื่อเรียกค่าจากหน้า HTML มาเก็บไว้ในตัวแปร เมื่อครบทุก Input ที่ต้องการแล้ว นำทำเป็น Numpy array และใช้ Model predict ค่าออกมา สุดท้ายให้ Return ค่าไปที่หน้าindex.html
เหมือนเดิม เพราะมีการสร้างตัวแปร{{prediction_text}}
รอรับค่าไว้แล้ว ดังนั้นในrender_template
จึงใส่ค่าprediction_text
ให้รับค่าpredicted
เมื่อลองรัน Script ด้านบนจะได้ Process เหมือนเดิมคือให้เข้าไปที่ Local host ตาม URL ที่โปรแกรมให้มา จะได้หน้า Web Application เหมือนด้านล่าง แสดงว่าพร้อมใช้งานแล้ว
Procfile
ขั้นตอนต่อไปทั้งหมดเป็นการเตรียมการ Deployment เริ่มจากให้สร้างไฟล์ Procfile
ไม่ต้องมีนามสกุลใด ๆ โดยไฟลนี้เป็นตัวกำหนด Command ต่าง ๆ เพื่อให้ Web Application รันได้ โดยให้ใส่รายละเอียดในไฟล์ตามด้านล่าง
web: gunicorn app: app
web
หมายถึง Web server ที่ใช้ในการรัน Web Application บน Heroku ซึ่งใช้งานgunicorn
กันเป็นส่วนมากapp
หมายถึง Script ที่ต้องการให้ทำงาน ในที่นี้คือapp.py
ตามชื่อไฟล์ที่ได้ตั้งไว้จาก Script ด้านบน
Requirements
ต่อมาเป็นการสร้างไฟล์ requirements.txt
เพื่อเป็นตัวบอก Requirement libraries ทั้งหมดเพื่อให้ Model สามารถทำงานได้
pip freeze > requirements.txt
ซึ่งถ้าไม่ได้จัดการ Environment ให้ดี อาจทำให้ Libraries ปะปนกัน ดังนั้นขอแนะนำให้สร้าง Environment สำหรับการ Deploy แยกต่างหาก ซึ่ง Libraries ทั้งหมดที่เพื่อให้โมเดลทำงานได้มีตาม List ด้านล่าง
Flask==1.1.2
gunicorn==20.0.4
numpy==1.19.5
scikit-learn==0.23.2
ถึงขั้นตอนนี้ Project structure ประกอบไปด้วย Folder และไฟล์ตามผังด้านล่าง
templates
---index.html
app.py
model.pk
Procfile
requirements.txt
Git
ต่อมาจัดการเกี่ยวกับ Git เพื่อเอาไว้ Push ทุกอย่างในโปรเจค ให้เข้าไปที่ www.github.com สำหรับใครที่ยังไม่ได้เป็นสมาชิก ต้องทำการสมัครสมาชิกก่อน เมื่อมี Account Git พร้อมใช้งานแล้ว ให้เข้าไปที่หน้า Git ของตัวเอง แล้วไปที่ Repository กด New เพื่อสร้าง Repository ใหม่
ตั้งชื่อ Repository ตามที่ต้องการ อาจมีการใส่ Descirption เพิ่มเติมนิดหน่อย จากนั้นกด Create repository
เมื่อได้หน้า Return ออกมาเป็นเหมือนรูปด้านบน แสดงว่า Git repository พร้อมใช้งานแล้ว กลับไปที่ Editor ที่ใช้งานอยู่ และรันคำสั่งตามด้านล่าง เพื่อเริ่ม Push files ต่าง ๆ เข้าสู่ Repository
Heroku
ต่อมาเป็นการสร้าง Application บน Heroku เพื่อให้ติดต่อเข้ากับ Git repository ให้ทำการสมัครสมาชิกก่อนเช่นกัน จากนั้นไปที่หน้า Account แล้วกด Create New App
ตั้งชื่อตามที่ต้องการ ในที่นี้ตั้งเป็น testingdeploymlmodel
แล้วกด Create app
Model deployment
ตอนนี้ทุกอย่างพร้อมแล้วสำหรับการ Deployment ML Model cd
ไปที่ Directoy ที่เก็บไฟล์ทั้งหมดไป เปิด Terminal ขึ้นมาแล้วพิมพ์คำสั่ง
git init
จะได้ Return ออกมาเป็น
[master (root-commit) 9274d2b] Initial commit
5 files changed, 128 insertions(+)
create mode 100644 Procfile
create mode 100644 app.py
create mode 100644 model.pk
create mode 100644 requirements.txt
create mode 100644 templates/index.html
เพื่อทำการ Initial Git จากนั้นพิมพ์ git config user.name
เพื่อใส่ Username และ git config user.email
เพื่อให้ Email ตามลำดับ จากทำการ Remote เข้าไปที่ Git repository ที่สร้างไว้
git remote add origin https://github.com/naenumtou/testDeployHeroku.git
ก่อนทำการ Commit code ต้องไม่ลืมคำสั่ง git add .
ก่อน จากนั้นสามารถ Commit code ต่อได้ทันที
git commit -m "Initial commit"
เมื่อรันได้ Log ตามด้านล่าง แสดงว่าการ Push project เสร็จสมบูรณ์
Enumerating objects: 8, done.
Counting objects: 100% (8/8), done.
Delta compression using up to 4 threads
Compressing objects: 100% (6/6), done.
Writing objects: 100% (8/8), 2.16 KiB | 221.00 KiB/s, done.
Total 8 (delta 0), reused 0 (delta 0), pack-reused 0
To https://github.com/naenumtou/testDeployHeroku.git
* [new branch] master -> master
Branch 'master' set up to track remote branch 'master' from 'origin'.
กลับไปที่หน้า Git repository จะเจอ Project ที่โครงสร้างเหมือนกับที่สร้างไว้ที่ Local
ต่อมาเป็นการใช้งาน Heroku เริ่มจากพิมพ์ heroku login
จะมีหน้าต่างขึ้นมาเพื่อให้ Sign-in เข้าไปที่เว็บ Heroku จากนั้นให้ปิดแล้วกลับมาที่ Terminal
เชื่อมต่อ Heroku เข้ากับ Git โดยใส่ชื่อ Application ตามที่ตั้งไว้ที่ Heroku ซึ่งในที่นี้คือ testingdeploymlmodel
heroku git:remote -a testingdeploymlmodel
เมื่อเชื่อมต่อเรียบร้อยจะได้ Log ตามด้านล่าง
set git remote heroku to https://git.heroku.com/testingdeploymlmodel.git
ขั้นตอนสุดท้ายคือการ Push Git ไป Build ที่ Heroku สามารถใช้คำสั่ง
git push heroku master
ระยะเวลาของขั้นตอนนี้ขึ้นอยู่กับความซับซ้อนของ Model เมื่อได้ Log ตามด้านล่าง ถือว่าการ Deploy ML Model เสร็จสมบูรณ์
Enumerating objects: 11, done.
Counting objects: 100% (11/11), done.
Delta compression using up to 4 threads
Compressing objects: 100% (9/9), done.
Writing objects: 100% (11/11), 2.42 KiB | 225.00 KiB/s, done.
Total 11 (delta 1), reused 0 (delta 0), pack-reused 0
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Building on the Heroku-20 stack
remote: -----> Python app detected
remote: -----> Installing python-3.6.12
...
remote: -----> Discovering process types
remote: Procfile declares types -> web
remote:
remote: -----> Compressing...
remote: Done: 101.1M
remote: -----> Launching...
remote: Released v3
remote: https://testingdeploymlmodel.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/testingdeploymlmodel.git
* [new branch] master -> master
Conclusion
จบแล้วสำหรับ Step-by-Step ในการ Deploy ML Model พร้อมสร้าง Web Application ด้วย Git และ Heroku โดยที่สามารถไปทดสอบ Model ที่ Deploy ไปได้ที่ yourdeployname.herokuapp.com
ซึ่งในที่นี้ก็คือ https://testingdeploymlmodel.herokuapp.com/ เมื่อลองใส่ Input values และกด Get prediction จะได้ผลลัพธ์ออกมาตามรูปด้านล่าง
ได้เห็น Process หลังจากที่ Developed model เสร็จแล้ว นำมา Implement ใช้งานทำให้เห็นภาพรวมของทั้งหมดมากขึ้น ถือว่าได้ลองอะไรใหม่ ๆ เป็นอะไรที่สนุกดี