มาลองทำ Upload file แต่ละเคสกัน

☕️ สนับสนุนช่องเราด้วยการสมัครสมาชิกช่องทางนี้ได้เลย
   / @mikelopster  

ลองไมค์ สัปดาห์นี้เราจะมาลองทำ upload file กัน เนื่องจากเป็นหัวข้อที่เรายังไม่ได้พูดใน web development 101 เพื่อทำให้หัวข้อการทำเว็บของเราสมบูรณ์กัน

โดยการ upload นั้น เราจะมีการพูดถึงทั้งหมด 4 เรื่องคือ
1. upload แบบปกติ (ทั่วๆไปเลย)
2. ทำ progress upload
3. validate file หรือขนาดที่ต้องการ
4. cancel upload (และการลบไฟล์หลังจาก cancel upload)

หากใครที่ยังไม่เคยลองทำ 4 เคสนี้ (เคสใดเคสนึง) มาลุยกันได้ในลองไมค์ (และเป็นกำลังใจให้กับ bug น้อยๆในคลิปผมด้วยนะ 😆)

หัวข้อ
00:00 แนะนำ Session / จะทำอะไรกันบ้าง
01:43 เคสทั้ง 4 ที่เราจะทำใน upload
02:27 setup project / library ที่ใช้
03:50 เริ่ม code ทำเคส 1. upload
11:32 เพิ่มระบุ path และ file name เป็น datetime เข้ามา
14:30 เพิ่ม upload ฝั่ง Frontend (ทำผ่านหน้าเว็บแทน)
18:20 state การ upload
23:53 เคส 2. เพิ่ม progress bar ฝั่ง Frontend
28:24 เคส 3.1 validate size ด้วย Frontend
30:24 เคส 3.2 validate size ด้วย Backend
31:29 เคส 3.3 validate file type ด้วย Frontend
33:18 เคส 3.4 validate mime type ด้วย Backend ด้วย fileFilter
39:54 เคส 4. cancel upload
43:00 ลบไฟล์ที่เกิดจากการ cancel upload ในฝั่ง Backend
46:23 แก้ไขจากเคส 3.4 เรื่อง error message จากฝั่ง Backend
49:49 เราทำอะไรกันไปบ้าง และ เราจะพูดถึงเรื่องไหนต่อในอนาคต

อ่านเพิ่มเติมได้ที่
https://mikelopster.dev/posts/upload-...

ใครมีข้อสงสัยเพิ่มเติม มาพูดคุยแลกเปลี่ยนความรู้กันได้ที่
Facebook page:   / mikelopster.dev   กันได้เลย

Enjoy ครับ 😘

พิกัดของด้านหลัง : https://shope.ee/8A54c8cfkf