13 posts tagged with "react"

Intro​

สวัสดีครับ บทความนี้น่าจะเป็นบทความแรกที่เล่าเกี่ยวกับงานที่ทำอยู่ที่ทำงาน ซึ่งเป็นช่วงที่ได้รับ Assigned ให้ทำระบบ EMR

EMR ถ้าจะให้อธิบายง่าย ๆ สั้น ๆ คือระบบที่เป็นเหมือนแฟ้มประวัติการรักษาคนไข้ ซึ่งภายในก็จะประกอบได้วยหลายส่วน (Sections) เช่น ผล Labs, Xray, Med Orders, Vital Signs Chart และอื่น ๆ ขอไม่ลงรายละเอียดลึก

โดยวันนี้จะมาพูดถึงแค่ Vital Signs Chart ซึ่งก็เป็นส่วนหนึ่งของ EMR และอันที่จริงก็จะไม่ลงรายละเอียดว่าคืออะไร เพราะจุดประสงค์ของบทความนี้ต้องการจะเล่าถึงวิธีทำ เพื่อให้ได้ตามที่ผู้ใช้งานต้องการ 😄

Intro​

สวัสดีครับ บทความนี้จะพูดถึง Vite ที่สร้างโดย Evan You ซึ่งเป็นผู้พัฒนา Framework Vue.js ที่บอกว่า "is next-generation frontend tooling" ที่มอบว่าเร็วในโหมด dev server

Intro​

สวัสดีครับวันนี้จะมาเล่าวิธีจัดการกับ Styling (CSS) และข้อดี - ข้อเสีย ใน React App โดยปัญหาของคนเขียน React ในช่วงเริ่มต้น ไม่ว่าคุณจะหัด หรือฝึกมาจาก Tutorial ที่ไหนก็ตาม (ผู้เขียนก็เคยเป็น) จะพบว่ามันมีหลายวิธีมาก

แต่ก่อนอื่นต้องเข้าใจก่อนว่า ที่เขาพาทำส่วนใหญ่เป็นแบบง่าย (simple) เพื่อให้ผู้เรียน หรือผู้ที่ทำตามเห็นภาพและเข้าใจได้เร็ว แต่ด้วยความที่วิธีการจัดการกับ Styling ของ React นั้นมีหลายวิธีพอสมควร และวิธีไหนดีที่สุดบทความนี้จะอธิบายให้ฟัง 😊

Intro​

สวัสดีครับ บทความนี้จะพูดถึง Tailwind CSS สำหรับคนที่เคยใช้งานมาแล้ว เนื่องจากเทคโนโลยีที่ได้ใช้งานบ่อยใช้เยอะช่วงนี้ พอใช้เรียนรู้และใช้งานแบบ Basic มาได้สักพัก ก็ไปค้นหาข้อมูลที่คนอื่น ๆ เขาเขียนและนำนำไว้เพื่อดูเทคนิค (Tips) และแนวปฏิบัติที่ดีที่สุด (Best Practices) ทำให้เจอข้อมูลที่น่าสนใจหลายอย่าง

บทความนี้จึงเป็นการรวบรวมและประเด็นที่น่าสนใจที่ค้นพบ และโน้ต ๆ ไว้อ่าน 🚀

Intro​

• StrictMode problems
• useEffect and deps problems
• Primitive and Non-Primitive
• Cleanup function

Intro​

สวัสดีครับ บทความนี้จะแชร์เทคนิคเพิ่มประสิทธิภาพในการโหลดหน้าเว็บ Apps และขนาดของ Bundle size ด้วย Dynamically Importing Components ของ React.lazy

ใน JavaScript frameworks เช่น React โดยปกติจะใช้ Statically import สำหรับการเรียก Components ซึ่งเมื่อเปิด Apps ก็จะเป็นการเรียกใช้ทันที แต่บางทีก็ไม่ได้มีความจำเป็นที่จะต้องการทันทีขนาดนั้น

Dynamically Importing จึงเป็นเทคนิคที่เข้ามาช่วยแก้ปัญหานี้เพื่อใช้ Import Components เมื่อจำเป็นต้องเรียกใช้เท่านั้น

ปัญหาของ Statically import คือการเรียกใช้ Components ทันทีโดยไม่ได้คำนึงว่าจะใช้งานหรือไม่ แต่ลองคิดดูว่า บาง Component จะ Render หลังจาก User interacts เท่านั้น หรือก็จากเงื่อนไขบางอย่าง ตัวอย่างดังนี้

Intro​

สวัสดีครับ จากบทความครั้งก่อนได้พูดถึง เทคนิค Debouncing โดยบทความนี้จะพูดถึงเทคนิค Throttling ที่มีความคล้ายคลึงกัน ซึ่งเป็นเทคนิคที่มีประโยชน์ช่วยเพิ่มประสิทธิภาพ Performance ได้ทั้ง Frontend App และ Backend App ที่ช่วยแก้ปัญหาการเกิด callback จำนวนมากจาก Event listeners มีรายละเอียดดังนี้

Intro​

สวัสดีครับ บทความนี้จะพามารู้จักกับ Debouncing โดย Debouncing เป็นเทคนิคที่มีประโยชน์ในการเพิ่มประสิทธิภาพ Performance ของ Client-side applications โดยเป็นหนึ่งเทคนิคในหลายสิ่งที่สำคัญในการพัฒนา Web App และ Software ซึ่งตามปกติโปรแกรมเมอร์จำเป็นต้องเขียนโค้ดโปรแกรมโดยคำนึง Performance เพื่อที่จะเพิ่มประสบการณ์ผู้ใช้งานที่ดี (UX) กับ Software

Intro​

บทความสรุป React cheatsheet นี้จะเป็นการอธิบายเกี่ยวกับ React พื้นฐานเนื้อหาอย่างย่อเพื่อทำความเข้าใจ React อย่างรวดเร็ว และให้คุณเห็นภาพรวมของแนวคิด React ทั้งหมดที่คุณต้องรู้ในปี 2022 มาเริ่มกันเลย!

Intro​

สวัสดีครับ บทความนี้จะเป็นการบบันทึกการใช้งาน useRef createRef และ forwardRef ของ React โดย useRef และ createRef มีความคล้ายคลึงกันมากและแตกต่างกันอย่างไรมาดูกัน 🚀