แนะนำ Javascript Libraries

Sirichai Teerapattarasakul

Sirichai Teerapattarasakul / May 10, 2022

1 min read

รวม JavaScript Library เพื่อช่วยให้การเขียนโค้ด JavaScript ง่ายขึ้น และทำให้ ทำ User Interfaces (UI) ของเว็บไซต์ดูน่าสนใจ รวมถึงผู้ใช้งานทำงานง่ายขึ้น ตามรายการดังนี้

Form

  • Select2 เปลี่ยน select boxes ให้มี search ได้

User Interface (UI)

  • Owl Carousel 2, Slick สำหรับแสดงแบนเนอร์หรือรูปในแบบสไลเดอร์ (carousel slider)
  • Sweetalert2 สำหรับแสดงหน้าต่างลอยขึ้นมาบนหน้าเพจ (Popup box)
  • Lightbox by Lokesh Dhakar, Fancybox แสดงรูปภาพเป็นแบบ Lightbox คลิกแล้วขยายรูปลอยขึ้นมา
  • Panzoom ขยาย zoom รูปและสามารถลากดูได้
  • Choices.js ทำ select box ให้สามารถค้นหาได้ และกรอกข้อมูลแยกเป็นกลุ่มเมื่อกด enter ใน text input (ให้นึกถึงตอนกรอก tags หรือ email ได้หลายๆ ชื่อใน text input เดียวกัน)
  • GridJs แสดงตารางแบบขั้นสูงปรับแต่งได้ เช่น เรียกข้อมูล ย่อขยายตาราง เป็นต้น
  • Litepicker ตัวเลือกวันที่ (Date Picker)
  • Swiperjs ทำ Slide เลื่อนซ้ายขวารองรับการ touch ปัดไปมาด้วยมือถือได้

Charts

Animation

  • Granim.js สร้างพื้นหลัง interactive gradient animation
  • CountUpแสดงตัวเลขนับจำนวนในรูปแบบ Animation

Utility

  • Uppy อัพโหลดไฟล์ (File uploader)