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-Toastify
▸ https://github.com/fkhadra/react-toastify
.
9. สร้าง Chart สวยๆ ด้วย Recharts
▸ https://github.com/recharts/recharts
.
10. พรีวิว pdf ด้วย React PDF viewer
▸ https://github.com/phuoc-ng/react-pdf-viewer
.
11. custom ส่วน head ของ html ง่ายๆ ด้วย React Helmet
▸ https://github.com/nfl/react-helmet
.
12. ตัวนี้สำหรับทำ drag and drop รายการต่างๆ
▸ https://github.com/atlassian/react-beautiful-dnd
.
13. ทำ input mask ด้วย React IMask Plugin
▸ https://github.com/…/imask…/tree/master/packages/react-imask
.
14. สำหรับคนที่ใช้ Redux สามารถจัดเก็บข้อมูลแบบ persist ได้ง่ายๆ เช่น localStorage เป็นต้น ด้วย Redux Persist (ไม่ต้องเขียน set, get เอง)
▸ https://github.com/rt2zz/redux-persist
.
15. สร้างตัวอย่างรอโหลดสวยๆ ด้วย react-loading-skeleton
▸ https://github.com/dvtng/react-loading-skeleton
source : https://codingthailand.com/blog/%e0%b9%81%e0%b8%99%e0%b8%b0%e0%b8%99%e0%b8%b3-15-%e0%b9%84%e0%b8%a5%e0%b8%9a%e0%b8%a3%e0%b8%b2%e0%b8%a3%e0%b8%b5-%e0%b8%82%e0%b8%ad%e0%b8%87-react-%e0%b8%97%e0%b8%b5%e0%b9%88%e0%b8%99%e0%b9%88/
No comments:
Post a Comment