NodeJS ลองทำ Hot Reload แบบง่าย ๆ

เมื่อมาพัฒนาระบบด้วย NodeJS หรือ JavaScript ฝั่ง Backend แล้ว สิ่งที่ติดมาจากการเขียน JavaScript ในฝั่ง Frontend นั่นก็คือ Hot Reload (เมื่อ code เปลี่ยนแปลงแล้ว ไม่ต้อง restart server ใหม่) แต่พอไปค้นหาวิธีการดูพบว่า ทำไมมันวุ่นวายจัง ทั้ง webpack ทั้งการ config ที่เยอะไปหมด ดังนั้นเลยลองนั่งหาวิธีการที่ง่ายกว่ามีไหม ซึ่งก็เจอหลายวิธี หนึ่งในนั้นที่ชอบหน่อยคือ การใช้ watcher มาลองใช้กันดู

ขั้นตอนแรก code ที่เราเขียนนั้นต้องดูดีหน่อย

นั่นคือ แยก router ออกมาจากส่วนไฟล์หลักก่อน เนื่องจากการเปลี่ยนแปลงบ่อย ๆ จะเกิดในไฟล์การทำงานไม่ใช้ไฟล์หลัก ดังนั้นโครงสร้างของระบบเป็นดังนี้

• server.js
• src/index.js

ขั้นตอนที่สอง เมื่อมีการเปลี่ยนไฟล์ใน folder src แล้วจะทำการ Reload ให้ใหม่

จากสิ่งที่ต้องการนั้น เราจำเป็นต้องใช้งาน watcher แน่นอนว่าใน NPM ก็มี package ให้ใช้ชื่อว่า Chokida แต่ว่า ถ้าเกิดการเปลี่ยนแปลงแล้ว เราจะทำอะไรต่อไปดีละ ? ก็ไปค้นหาต่ออีก ยากจริง ๆ ไปเจอว่า การทำงานของ NodeJS นั้น จะทำการสร้าง caching ไว้ ดังนั้นก็ไปทำการลบ cache ของ Object ต่าง ๆ มันซะเลย [gist id="bf9a1798d20c7b66873de45f9a293a7b" file="1.js"] ลอง print ค่าของ object ที่ caching ใน folder src ออกมาดู พบว่ามีการทำ caching ไว้เพียบเลย ดังนั้นลบไปซะ

ขั้นตอนที่ 3 ยังใช้ไม่ได้นะ

เพราะว่า เราต้อง require ไฟล์ใน folder src ทุกครั้งด้วย เนื่องจากในไฟล์หลักผมไม่สนใจ ดังนั้นมันจะได้รูปแบบการเขียน code ที่ไม่ดี !! ระวังด้วยนะ อย่าเอาขึ้น production ดังตัวอย่าง [gist id="bf9a1798d20c7b66873de45f9a293a7b" file="2.js"] แค่นี้ก็ได้ Hot Reload แบบง่าย ๆ ละ ลองดูครับ ขอให้สนุกกับการ coding Reference Websites https://hackernoon.com/hot-reload-all-the-things-ec0fed8ab0 https://codeburst.io/dont-use-nodemon-there-are-better-ways-fc016b50b45e