DEV Community

Cover image for Read CSV Files in React Apps without Installing Any Package

Read CSV Files in React Apps without Installing Any Package

Nurudeen Amedu on June 13, 2021

This article covers how you can read any CSV file in your React app without the need for an npm package installation. If you would prefer a video ...
Collapse
 
agusgarcia3007 profile image
Agustin Garcia

hey! could you solve the extra blank item in rows bug? I'm having the same problem

0: {name: 'joey', age: '21', rank: 'senior'}
1: {name: 'amanda', age: '28', rank: 'mid'}
2: {name: 'peter', age: '24', rank: 'junior'}
3: {name: '', age: undefined, rank: undefined

Collapse
 
theallegrarr profile image
Nurudeen Amedu

It could be due to a blank row in your csv, but it can be solved by checking the final data for undefined values and removing the row

Collapse
 
hannahgooding profile image
Hannah Gooding

I found this really helpful - thank you!

Collapse
 
theallegrarr profile image
Nurudeen Amedu

You’re welcome

Collapse
 
omogbai profile image
Omogbai Atakpu

This was very helpful, thank you Nurudeen!

Collapse
 
adeldegan profile image
Al Del Degan

This was super useful, you saved me a lot of coding. Thanks!

Collapse
 
alarbelaez profile image
alarbelaez

I had problems with the breaks and the cvsArray, can you help me

Collapse
 
alarbelaez profile image
alarbelaez

TypeError: csvArray is undefined

Collapse
 
theallegrarr profile image
Nurudeen Amedu

Check for csvArray before using it, you can put everything inside an if block

if(csvArray){
// continue
}

Collapse
 
theallegrarr profile image
Nurudeen Amedu

What’s the error you’re getting?

Collapse
 
agusgarcia3007 profile image
Agustin Garcia

This is exactly what I was looking for! thank you so much :)))

Collapse
 
nkrgangavaram profile image
nkrgangavaram

Heyy it was a great solution...can we get the same thing without using input type as file. Can you please help me with other ways..