How to Use Lightning Datatable in LWC

 In this post, we will walkthrough the simple lightning: datatable component in Lightning web component. 

LWC Lightning Datatable

To represent data in table format and have basic feature of tables in any language, Salesforce out of the box provides a lightning: datatable. It supports many feature OOTB, but some special scenarios,  where we need to implement client specific feature in that table, like showing company logo in table. we can handle these king of scenarios extending the lightning data table. 

Lets create a simple data table using lwc lightning: datatable.

sampleDatatable.hml

<template>
    <lightning-datatable
                key-field="id"
                data={tableData}
                columns={tableColumns}>
    </lightning-datatable>
</template>

sampleDatatable.js

import { LightningElement } from 'lwc';
const COLUMNS = [
    { label: 'Name', fieldName: 'name' , type: 'string'},
    { label: 'Website', fieldName: 'website', type: 'url' },
    { label: 'Phone', fieldName: 'phone', type: 'phone' },
    { label: 'Revenue', fieldName: 'amount', type: 'currency' },
    { label: 'Date', fieldName: 'todayAt', type: 'date' },
];
export default class SampleDatatable extends LightningElement {

    tableColumns = COLUMNS;
    tableData = [
        {id:101, name: 'salesforce', website:'www.salesforce.com', phone:'1756011149', amount: '209.13', todayAt:'Jan 1,2023'},
        {id:102, name: 'Asian Paints Ltd', website:'https://www.asianpaints.com/', phone:'18002095678', amount: '34875', todayAt:'Mar 1,2023'},
        {id:103, name: 'IndusInd Bank Ltd', website:'https://www.indusind.com/', phone:'1860 267 7777', amount: '1426.50', todayAt:'May 1,2023'},
        {id:104, name: 'Infosys Ltd', website:'https://www.infosys.com/', phone:'18002066678', amount: '1424.55', todayAt:'Jan 1,2023'},
        {id:105, name: 'Axis Bank Ltd', website:'https://www.axisbank.com/', phone:'1800206646', amount: '14824.55', todayAt:'Jun 1,2023'}
    ];
}

sampleDatatable.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>58.0</apiVersion>
    <isExposed>false</isExposed>
</LightningComponentBundle>

Also found above code in Tech Shorts Git repo

Source:
https://developer.salesforce.com/docs/component-library/bundle/lightning-datatable/documentation