Nadeem Shareef
Shareef

Shareef

Convert Excel to JSON in ReactJS in just 2 steps

Nadeem Shareef's photo
Nadeem Shareef
ยทNov 23, 2021ยท

1 min read

Subscribe to my newsletter and never miss my upcoming articles

Play this article

Hello Developers ๐Ÿ™Œ

Today we will see how to convert Excel to JSON

We will use xlsx package.

No more talking let's jump into the coding part.

Install xlsx package

npm i xlsx

Create a basic structure for file upload


<form>
    <label htmlFor="upload">Upload File</label>
    <input
        type="file"
        name="upload"
        id="upload"
        onChange={readUploadFile}
    />
</form>

Convert Excel file to JSON

const readUploadFile = (e) => {
    e.preventDefault();
    if (e.target.files) {
        const reader = new FileReader();
        reader.onload = (e) => {
            const data = e.target.result;
            const workbook = xlsx.read(data, { type: "array" });
            const sheetName = workbook.SheetNames[0];
            const worksheet = workbook.Sheets[sheetName];
            const json = xlsx.utils.sheet_to_json(worksheet);
            console.log(json);
        };
        reader.readAsArrayBuffer(e.target.files[0]);
    }
}

Kaboom!๐Ÿ”ฅ in just two simple steps, you can convert Excel to JSON

HappyCoding

Closing here ๐Ÿ‘‹๐Ÿ‘‹๐Ÿ‘‹

This is Shareef. My recent project yourounotes My Portfolio Twitter ShareefBhai99 Linkedin My other Blogs

ย 
Share this