แบบ relational (Queries API) const users = await db.query.users.findMany(); แบบ SQL-like const result = await db.select().from(users); Views: 718
8 เหตุผล ทำไมควรเรียน NestJS
NestJS เป็นเฟรมเวิร์กสำหรับพัฒนา Web App ทางฝั่งเซิร์ฟเวอร์ (Node.js framework) นิยมพัฒนาเป็น RESTful API (Backend) และเขียนด้วย TypeScript ครับ แล้วทำไมเราต้องเรียน NestJS ด้วย มีเหตุผลดังนี้ครับ 1. การออกแบบเชิงโมดูล (Modular Architecture) NestJS ใช้การออกแบบเชิงโมดูล ทำให้โค้ดมีโครงสร้างที่ชัดเจน สามารถแบ่งเป็นโมดูลย่อย ๆ ง่ายต่อการพัฒนา แก้ไข หรือเพิ่มฟีเจอร์ใหม่ แน่นอนเหมาะมากสำหรับทำงานเป็นทีมครับ 2. รองรับ TypeScript เต็มรูปแบบ NestJS นั้นเขียนด้วย TypeScript แน่นอนช่วยลดข้อผิดพลาดในการเขียนโค้ด และการตรวจจับข้อผิดพลาดต่างๆทำได้ง่ายขึ้น 3. เหมาะสำหรับการสร้าง Web App ขนาดใหญ่ NestJS ถูกออกแบบมาเพื่อรองรับ Web App ขนาดใหญ่ที่ต้องการโครงสร้างที่แข็งแกร่งและยืดหยุ่น…
มีอะไรใหม่ใน Express.js v5.0
10 ปีที่รอคอย! Express.js V5.0 มาแล้ว! เมื่อวันที่ 15 ตุลาคม 2024 ที่ผ่านมา Express.js ได้ทำการออกเวอร์ชัน 5.0 อย่างเป็นทางการ มาพร้อมกับการอัปเดต และการเพิ่มประสิทธิภาพต่างๆ ที่ดีขึ้น แม้ว่าตัว API จะไม่ได้แตกต่างจาก V4 มากนัก แต่ก็มีหลายอย่างที่เปลี่ยนอยู่เหมือนกัน ถ้าใครอยากใช้หรือ upgrade เรามาดูกันว่ามีอะไรน่าสนใจบ้างครับ จริงๆ ยังมีอีกเยอะถ้าใครสนใจอ่านต่อดูได้ที่นี่นะครับ https://expressjs.com/2024/10/15/v5-release.html โค้ชเอก -ไม่อนุญาตให้คัดลอกเนื้อหาไปลงยัง Platform อื่นๆ โดยไม่ได้รับอนุญาต Views: 927
มีอะไรใหม่ใน Vue.js 3
1. แม้ features จะเพิ่มขึ้น แต่ประสิทธิภาพดีกว่า เวอร์ชัน 2 และมีขนาดเล็กลง .2. Codebase เขียนด้วย TypeScript ทำให้รองรับ TypeScript ได้ดีขึ้น .3. เปลี่ยนวิธีการเขียนมาเป็นรูปแบบที่เรียกว่า Composition API แทน Options API แบบเดิม คือ ถ้าเป็นเวอร์ชันปัจจุบันเราจะเขียนโค้ดเข้าไปที่ option properties ต่างๆ เช่น data, methods, computed เป็นต้น แน่นอนปัญหาคือ เราจะต้องเรียนรู้ว่าตัวไหนใช้ทำอะไร (ไม่ใช่โค้ด js เพียวๆ ที่สามารถใช้งานได้เลย) และตัว compiler เองก็ต้องมีการ transform properties ต่างๆเหล่านี้ให้สามารถทำงานได้อีกทีหนึ่ง ในเวอร์ชัน 3 จะเปลี่ยน properties ต่างๆ…
ไลบรารีเกี่ยวกับการจัดการวันที่ของ JavaScript
มาดูตารางเปรียบเทียบไลบรารีเกี่ยวกับการจัดการวันที่ของ JavaScript กันครับ… .ทุกวันนี้ Web App ที่เราสร้างต้องคำนึงถึงความเร็วกันอยู่แล้วครับ การเลือกใช้งานไลบรารีจึงเป็นสิ่งสำคัญมาก เพราะมีผลโดยตรงกับประสิทธิภาพโดยรวมของเว็บเรา .ปกติเวลาที่ผมแนะนำก็จะแนะนำเป็น date-fns ครับ และให้เลิกใช้ Moment.js เพราะมีขนาดใหญ่ และไม่มี tree-shaking ด้วย .วันนี้มาแนะนำอีกหนึ่งตัว คือ dayjs ครับ ตัวนี้มีขนาดเล็กมากๆ แค่ 2k เอง ถึงแม้ไม่มี tree-shaking ก็ถือว่าเล็กมากแล้วครับ กับการใช้งานทั่วไป .มีใครใช้ตัวไหนอยู่บ้างครับ ฝากแนะนำเพื่อนๆ หน่อยนะครับ .ไปดูการเปรียบเทียบเองได้ที่นี่นะครับ => http://bit.ly/2w8Xn8F โค้ชเอก Views: 33879
แนะนำ 15 ไลบรารี ของ React ที่น่าใช้ในปี 2020
1. สร้าง QRCode แบบง่าย ๆ ลองตัวนี้▸ https://github.com/zpao/qrcode.react .2. สร้าง rich text editor ง่าย ๆ ด้วย React Quill▸ https://zenoamaro.github.io/react-quill .3. ครอบตัดรูปภาพด้วย React Image Crop▸ https://github.com/DominicTobias/react-image-crop .4. drag and drop รูปภาพ เพื่อเตรียมอัปโหลดด้วย react-dropzone▸ https://react-dropzone.js.org/ .5. สร้างปฏิทินกิจกรรม หรือ events calendar ด้วย react-big-calendar▸ https://github.com/jquense/react-big-calendar .6. จัดการข้อมูลรูปแบบตารางสวยๆ ด้วย react-bootstrap-table2 (สำหรับคนใช้ Bootstrap)▸ https://react-bootstrap-table.github.io/react-bootstrap-tab… .7. Datepicker ไว้สำหรับ input ข้อมูลแบบปฏิทิน▸ https://github.com/Hacker0x01/react-datepicker .8. ทำ notification สวยๆ…
แนะนำ React Hook Form
สำหรับคนที่เขียน React หรือ React Native อยู่ ลองใช้ไลบรารีฟอร์มตัวนี้ได้ครับ “React Hook Form” .ปกติคนที่เขียน React หรือ React Native น่าจะเคยใช้ Formik และ Redux Form กันมาบ้าง วันนี้มาแนะนำอีก 1 ทางเลือกครับ และน่าจะเป็นทางเลือกใหม่ที่ดีด้วย มาดูกันว่า react-hook-form มีข้อดีอะไรบ้าง .1. re-render ที่่น้อยลง (ทำให้ประสิทธิภาพดีขึ้น) กว่า Formik และ Redux Form .2. ใช้เวลาเรียนรู้ไม่มาก เขียนโค้ดสั้นลงกว่า Formik และ Redux Form .3. ใช้ React Hooks .4. ขนาดเล็กมากแค่…
มีอะไรใหม่ใน Ionic Framework เวอร์ชัน 5
ไม่กี่วันก่อนทีม Ionic ได้ออกเวอร์ชัน 5 เป็นที่เรียบร้อยแล้วครับ มาดูกันว่ามีอะไรใหม่บ้าง .1. มาพร้อมกับ Angular 9 (Ivy)! .2. แนะนำให้อัปเดตเป็นเวอร์ชัน 4.11.10 ก่อนอัปเดตเป็นเวอร์ชัน 5 ครับ จะได้ดูคำเตือนต่างๆ ว่ามีอะไรจะเลิกใช้แล้วบ้าง .3. สำหรับคนที่เขียน Angular ใช้คำสั่ง npm install @ionic/angular@latest เพื่ออัปเดตได้เลย 4. มาพร้อมกับไอคอนใหม่กว่า 1,200 ไอคอน!! (Ionicons 5) มีให้เลือกทั้งแบบ outline, fill และ sharp .5. อัปเดต UI components ต่างๆ ให้รองรับ iOS 13 เช่น Segment, Header, Large…
4 ข้อควรรู้เกี่ยวกับ React Hooks
Hooks เป็นฟีเจอร์ใหม่ที่มาพร้อมกับ React เวอร์ชัน 16.8 เพื่อให้เราสามารถใช้งาน state และเรียกใช้ features ต่างๆ ของ React ได้ โดยที่ไม่ต้องเขียนแบบ class component ยกตัวอย่าง เช่น เราสามารถใช้ useEffect แทน componentDidMount ได้ เป็นต้น .ส่วนคนที่เขียน React Native ก็เขียนได้เลยนะ แต่ต้องเป็นเวอร์ชัน 0.59 ขึ้นไปครับ .1. แนะนำให้เขียน React Hooks สำหรับโปรเจคใหม่เลย (ในหลักสูตรใหม่ที่ผมจะเปิดสอนจะพาเขียน Hooks เป็นหลักทั้งหมดครับ แต่จะพูดถึง class component ด้วยเช่นกัน) ถ้าโปรเจคเดิมใช้แบบ class component อยู่ก็ไม่ต้องตามแก้เป็น Hooks นะครับ ใช้ของเดิมได้เลย…
มีอะไรใหม่ใน Angular เวอร์ชัน 9
ถือเป็นการอัปเดตใหญ่ของ framework ตัวนี้เลยครับ โดยเฉพาะเรื่องของประสิทธิภาพ และเครื่องมือต่างๆ มาดูกันว่ามีอะไรใหม่บ้าง .1. มาพร้อมกับ Ivy compiler และ Ivy runtime ตัวใหม่และกำหนดเป็น default มาให้เลย แน่นอนทำให้ app ของเรา build ได้เร็วขึ้น มีขนาดเล็กลง และรันได้เร็วขึ้นกว่าเดิม (สำหรับ app เล็กๆ ขนาดลดลงราว 30% ส่วน app ขนาดใหญ่ ขนาดลดลงราว 25-40% เลยทีเดียว) .2. สำหรับคนที่เขียน unit tests ด้วย TestBed ในเวอร์ชันนี้ปรับปรุงการเขียน test ให้เร็วขึ้นกว่าเดิมราว 40% โดยที่ TestBed จะไม่ recomplie components ใหม่ทั้งหมดเหมือนเวอร์ชันเดิมครับ…