ProTable

A data-table alternative written with modern javascript.

Docs

Open Full Documentation.

Basic Usage

Installation

npm i protable

Create From Array

HTML container:

<div id="table-from-array"></div>

Js:

import { fromArray } from 'protable'
 
fromArray('#table-from-array', [
  {
    name: 'Nurul Huda',
    relationship: 'Married',
    blog: 'https://jagongoding.com'
  },
  {
    name: 'Abdullah Wahid',
    city: 'Bangkalan'
  },
  {
    city: 'Lamongan',
    name: 'Lendis Fabri',
    blog: 'https://kopiding.in'
  },
  {
    name: 'Elmo Bachtiar',
    relationship: 'Single'
  }
])

Table Output:

Name	Relationship	Blog	City
Nurul Huda	Married	https://jagongoding.com	-
Abdullah Wahid	-	-	Bangkalan
Lendis Fabri	-	https://kopiding.in	Lamongan
Elmo Bachtiar	Single	-	-

Create Complex Table From Array

import { fromArray } from 'protable'
 
fromArray('#table-from-array-2', [
  {
    name: 'Nurul Huda',
    birth: {
      day: 1,
      month: 'January',
      year: 1996
    },
    city: 'Surabaya'
  },
  {
    name: 'Wahid Abdullah',
    birth: {
      day: 2,
      month: 'February',
      year: 1996
    },
    city: 'Bangkalan'
  },
  {
    name: 'Lendis Fabri',
    birth: {
      day: 3,
      month: 'Maret',
      year: 1996
    },
    city: 'Lamongan'
  }
])

Table Output:

Name	Birth			City
	Day	Month	Year
Nurul Huda	1	January	1996	Surabaya
Wahid Abdullah	2	February	1996	Bangkalan
Lendis Fabri	3	Maret	1996	Lamongan

License

The Pro Table library is open-source software licensed under the MIT license.