เขียน React เรียก API แสดงตารางข้อมูล Pagination | หมีไลฟ์โค้ด EP.30 โดย อ.พี่หมี
Live Code พื้นฐานการเขียน React แสดงตารางข้อมูล (Datatable) แบบ Pagination ซึ่งคือการแบ่งโหลดและแสดงข้อมูลเป็นหน้า ๆ ไป และมีปุ่มที่ให้กดเลือกเลขหน้าที่ต้องการได้ โดยใช้ lib react-data-table-component ส่วนข้อมูลที่ใช้แสดงจะมาจาก API ของ www.mecallapi.com ครับ คลิปนี้เน้นเฉพาะที่ Front-End นะครับ ไม่ยากครับ โค้ดนิดเดียวนะ ? สนับสนุนช่อง: https://www.youtube.com/channel/UCtf4VyUq8v0lr-fl1K_3lUg/join พื้นที่โฆษณา link สำหรับซื้อของใน shopee: https://shope.ee/30HCTjoOEV 00:00:00 เริ่มต้น 00:00:35 ติดตั้ง Software 00:00:52 สร้างโปรเจค React 00:01:51 ติดตั้ง lib react-data-table-component 00:02:47 สร้างตัวอย่างตารางข้อมูล (data table) 00:04:40 สร้างตารางข้อมูลจากการเรียก API www.mecallapi.com 00:11:49 ใส่ pagination ในตารางข้อมูล อ.ผศ.ดร.กานต์ ยงศิริวิทย์ วิทยาลัยนวัตกรรมดิจิทัลเทคโนโลยี มหาวิทยาลัยรังสิต (https://it.rsu.ac.th/th/) Follow Me Youtube: @melivecode Facebook Page : https://facebook.com/melivecodepage Medium: https://karnyong.medium.com/ Free API : https://www.melivecode.com/ Facebook : https://www.facebook.com/karnyong Instagram: https://www.instagram.com/melivecode Email : karn.y@rsu.ac.th Music by Lesfm from Pixabay #melivecode #react #datatable #pagination
Live Code พื้นฐานการเขียน React แสดงตารางข้อมูล (Datatable) แบบ Pagination ซึ่งคือการแบ่งโหลดและแสดงข้อมูลเป็นหน้า ๆ ไป และมีปุ่มที่ให้กดเลือกเลขหน้าที่ต้องการได้ โดยใช้ lib react-data-table-component ส่วนข้อมูลที่ใช้แสดงจะมาจาก API ของ www.mecallapi.com ครับ คลิปนี้เน้นเฉพาะที่ Front-End นะครับ ไม่ยากครับ โค้ดนิดเดียวนะ ? สนับสนุนช่อง: https://www.youtube.com/channel/UCtf4VyUq8v0lr-fl1K_3lUg/join พื้นที่โฆษณา link สำหรับซื้อของใน shopee: https://shope.ee/30HCTjoOEV 00:00:00 เริ่มต้น 00:00:35 ติดตั้ง Software 00:00:52 สร้างโปรเจค React 00:01:51 ติดตั้ง lib react-data-table-component 00:02:47 สร้างตัวอย่างตารางข้อมูล (data table) 00:04:40 สร้างตารางข้อมูลจากการเรียก API www.mecallapi.com 00:11:49 ใส่ pagination ในตารางข้อมูล อ.ผศ.ดร.กานต์ ยงศิริวิทย์ วิทยาลัยนวัตกรรมดิจิทัลเทคโนโลยี มหาวิทยาลัยรังสิต (https://it.rsu.ac.th/th/) Follow Me Youtube: @melivecode Facebook Page : https://facebook.com/melivecodepage Medium: https://karnyong.medium.com/ Free API : https://www.melivecode.com/ Facebook : https://www.facebook.com/karnyong Instagram: https://www.instagram.com/melivecode Email : karn.y@rsu.ac.th Music by Lesfm from Pixabay #melivecode #react #datatable #pagination