--- title: Create next-gen HTML tables with Grid.js. 😎 | daily.dev description: In this tutorial, you'll learn how to create a powerful table with the help of a fairly new library in the JavaScript ecosystem - Grid.js. canonical: https://daily.dev/blog/create-next-gen-html-tables-with-grid-js/ og:type: article og:url: https://daily.dev/blog/create-next-gen-html-tables-with-grid-js/ og:title: Create next-gen HTML tables with Grid.js. 😎 | daily.dev og:description: In this tutorial, you'll learn how to create a powerful table with the help of a fairly new library in the JavaScript ecosystem - Grid.js. og:image: https://media.daily.dev/image/upload/s--TdKL78OF--/f_auto,q_auto/v1/recruiter-landing/5f48f7875b18f13131040040_gt6tx3jmctqa7xw24tmh_a912cdd84f?_a=BAMAMiB80 og:site_name: daily.dev og:locale: en_US article:published_time: 2020-08-28 article:modified_time: 2026-05-15T14:26:24.922Z article:author: Vaibhav Khulbe twitter:card: summary_large_image twitter:site: @dailydotdev twitter:creator: @dailydotdev twitter:title: Create next-gen HTML tables with Grid.js. 😎 | daily.dev twitter:description: In this tutorial, you'll learn how to create a powerful table with the help of a fairly new library in the JavaScript ecosystem - Grid.js. twitter:image: https://media.daily.dev/image/upload/s--TdKL78OF--/f_auto,q_auto/v1/recruiter-landing/5f48f7875b18f13131040040_gt6tx3jmctqa7xw24tmh_a912cdd84f?_a=BAMAMiB80 --- In this tutorial, you'll learn how to create a powerful table with the help of a fairly new library in the JavaScript ecosystem - [**Grid.js**](https://gridjs.io/). The best part? It's seriously easy to integrate, powerful enough to fetch data asynchronously, and can be styled to whatever the way you want! Next-gen stuff, right? .gif) Ready for some next-gen stuff? ## Why choose Grid.js? 🤨 What makes it better than others is the fact that it is: 1. **Ridiculously easy to start with!** I mean, I made the following demo in a matter of a few minutes. It already comes with some really useful tools which can be easily plugged-in to an existing app. So, you don't need to worry about actually _learn_ another new library. 2. **Use it with or without any framework:** It has only one external dependency already baked in. Hence, you don't have to worry about managing dependencies if you don't use a package manager like NPM. Use it with Angular, React, Vue, or with just vanilla JS! 3. **React Native support (UPCOMING):** It is designed to be independent of the web browser context, and the library developer has stated that support for RN is coming! 4. **Fast!** Grid.js has an internal pipeline that takes care of caching and processing data. This helps in loading, searching, sorting, or displaying the data really quickly. 5. **Powerful CSS integration:** You can style your tables whichever way you want. It doesn't matter if you're using plain old CSS in a separate stylesheet or _inside JS_ 😏. ## What will we make using Grid.js? 😀 This:  As you see, we'll cover the following features: - Adding the "Loading..." state. - Displaying the data. - Sorting each or multiple rows. - Searching the contents. - Adding pagination. - Using custom CSS styles. - Adding internalization. ## Let's make this powerful table in a matter of minutes! ⚡ #### Step 1: Grab the CDN For this demo, we'll be installing Grid.js using the quick _grab-the-cdn-and-go!_ method. Also, this is a vanilla JS project where we'll be using this library. Add the following in your _index.html_ file: \`\` This includes Grid.js styles. For the JS, import the library with: \`