Excel dosyalarını (xlsx, xls, CSV) React'te JSON formatına dönüştürün.

Feb 12 2023
Hepimizin JSON'a dönüştürülmesi gereken Excel dosyaları var. Ama sorun şu ki bunu nasıl yapacağız? Pek çok yol var ve bazıları diğerlerinden daha iyi.
Unsplash'ta Lautaro Andreani'nin fotoğrafı

Hepimizin JSON'a dönüştürülmesi gereken Excel dosyaları var. Ama sorun şu ki bunu nasıl yapacağız? Pek çok yol var ve bazıları diğerlerinden daha iyi. Bu blogda, size Node.js kullanarak excel dosyalarınızı kolayca JSON formatına nasıl dönüştüreceğinizi göstereceğim.

Tepki nedir?

React, daha önce Facebook olarak bilinen Meta tarafından geliştirilen, UI bileşenlerine dayalı kullanıcı arabirimleri oluşturmak için ücretsiz ve açık kaynaklı bir JavaScript kitaplığıdır.

JSON nedir?

JSON, JavaScript Nesne Gösterimi anlamına gelir. JSON, JavaScript nesne sözdizimine dayalı yapılandırılmış verileri temsil etmek için standart bir metin tabanlı biçimdir. Genellikle web uygulamalarında veri iletmek için kullanılır.

Başlayalım!

Excel dosyalarını JSON biçimine dönüştürmek için, elektronik tablolarla çalışmak ve içeriklerini değiştirmek için çok çeşitli özellikler sağlayan 'xlsx' kitaplığını kullanacağız. Terminalinizde aşağıdaki komutu çalıştırarak bu kütüphaneyi kurabilirsiniz:

npm install xlsx

Excel dosyasını okumak için xlsx'ten FileReader yöntemini kullanmanız gerekir. sheet_to_jsonExcel dosyasından veri aldıktan sonra, onu JSON formatına dönüştürmek için xlsx kütüphanesindeki yöntemi kullanabilirsiniz .

import React, { useState } from 'react';

const Test = () => {
const submitHandler=(e)=>{

    if (e.target.files) {
        const reader = new FileReader();
        reader.onload = (e) => {
            const data = e.target.result;
            const workbook = read(data, { type: "array" });
            const fileName= workbook.SheetNames[0];
            const sheet = workbook.Sheets[fileName];
            const json = utils.sheet_to_json(sheet);
            console.log("json",json);
        };
        reader.readAsArrayBuffer(e.target.files[0]);
    }
   }
<div>
 <input type="file" onChange={submitHandler}/>
</div>
}
export default Test

JSON'a dönüştürmek için aşağıdaki excel dosyasını kullandık.

Bu excel dosyasını karşıya yükledikten sonra JSON verilerini alacağız. Burada JSON verilerini tabloda gösterdik.

Makaleyi okuduğunuz için teşekkür ederim ve umarım sizin için yararlı olmuştur.

Yararlı Bağlantılar :

Not: "Telif hakkı ihlali amaçlanmamıştır, Mutlu Kodlama."

https://www.linkedin.com/in/yash-baviskar-82250a113