3. Populating table data from an External API in Material Table || Material UI

Populating table data from an external api using react hooks in material table
Hey Guys,
in this video we will see how to make a api call and populate those data to table in material table.

Fake api :

GitHub URL of program :

#MaterialUI #Api #call

[HI-wqvh]

Great tutorial. You have just clarified something I was a bit unclear with. Thanks for sharing.

[easterntornado]

I think if you run map function on Object.keys(resp) then you need not even hard code the columns array (you may also have another state variable with setter function like const [columns, setColumns] and use setColumns inside the fetch block; so in that way you can construct the whole of columns and data array from the API call-response directly.
Anyways, it is a good presentation. Thanks !!

[vidushat.jayaweera]

Great Tutorial🔥. Can you explain how to populate data to one column using one api and populate data to other columns using another api

[bhupendrasinhthakre]

Wonderful tutorial. Quick question: how can you get the first 3 digits of phone number to get area code

[rakeshkulkarni]

Great Videos, How to give this table horizontal scroll, so I can have many fields and should be able to scroll horizontally

[rohitbhoite]

Hi any example of collapsible table using api..?

[saptarshichanda]

hello friend !
thank you for working hard and helping us ! i am completely new to react as well as material ui.
my task is to populate a table using about 50 thousand records in my mysql database .
any idea how do i do it??
and do i have to create like a api to fetch all the datas from mysql database????
if so how do i do it???

[weida]

Thanks your stuff, I have a issue display 3300 record, after 1600 records, table show empty record, any idea. recent version, next page did not work
do you have any idea ? Thanks

[Group-qtcl]

Hi, i tried to add the textoverflow: ellipsis, overflow:hidden using rowStyle:{
overflow:'hidden',
textOverflow:'ellipsis'}
but unable to hide the large data, the table is getting extended, can u suggest me on that

[ricardojaeschke]

This MaterialTable is only available with the newest version of Mui, isn't it?

[abhaysoni]

will this work with paginated api, the table pagination does not work on totalcount

[Nytrox]

how can i sort and select data in material table?

[mirko]

Why you fetched 10 rows when your table shows 5?

[dejansekulic]

I getting error invalid prop 'data' suplied to MaterialTable node 12.16.3 npm 6.14.4 cli 12.0.0

[dayanandnaykude]

I'm loading arround 12k records in material table from database it takes large amount of time to load data in table.how to optimize this please provide me any help.

[ratulraha]

I have a laravel api....when I fetch data through api, it perfectly shows in the console.log but now showing in react table

[ravilamontagne]

Why didn't you show the example for getting the nested values, eg. in the address object?

[vvv_]

The main reason I came here was to see how he populates address field which is nested and conveniently he skipped it. Why they only showing easy stuff?