본문 바로가기
Javascript

[JS] 자바스크립트로 엑셀 파일 만들기!

by 타로 스토리 2023. 5. 26.
반응형

 

xlsx 라이브러리 활용하여 엑셀파일 만들기

자바스크립트를 사용하여 엑셀을 만들 수 있습니다. 이를 위해서는 엑셀 파일 형식인 XLSX 파일을 생성하는 라이브러리인 "xlsx"를 사용하면 됩니다.

xlsx 라이브러리는 xlsx 파일을 읽고 쓰고 변환하고 분석할 수 있으며, 엑셀의 다양한 기능과 형식을 지원합니다. 
xlsx 라이브러리는 브라우저와 Node.js에서 모두 사용 가능합니다. xlsx 라이브러리를 사용하려면 npm i xlsx 명령어로 설치하거나 dist 폴더에서 스크립트 파일을 다운로드할 수 있습니다.


[ "xlsx" 라이브러리 엑셀파일 생성 예시 코드 ]

// xlsx 라이브러리 불러오기 
const XLSX = require('xlsx'); 

// 엑셀 파일 생성 
const wb = XLSX.utils.book_new(); 

// 시트 생성 
const ws = XLSX.utils.json_to_sheet([ 
	{ name: "John Doe", age: 30 }, 
{ name: "Jane Smith", age: 25 }, 
{ name: "Bob Johnson", age: 40 } 
]); 

// 시트 이름 설정 
XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); 

// 파일 저장 
XLSX.writeFile(wb, "example.xlsx");


위 코드에서는 "xlsx" 라이브러리를 불러와서 엑셀 파일 객체(wb)를 생성하고, 데이터를 담을 시트 객체(ws)를 생성합니다. 시트 객체에는 객체 배열로 데이터를 전달하며, 각 객체의 속성은 엑셀의 열(column)에 해당합니다.

이후 utils.book_append_sheet() 메서드를 사용하여 시트를 엑셀 파일에 추가하고, writeFile() 메서드를 사용하여 엑셀 파일을 저장합니다.

utils.json_to_sheet() 메서드를 사용하여 자바스크립트 객체 배열을 시트로 변환하고, 이를 엑셀 파일로 저장하는 예시 코드 입니다.

 

// xlsx 라이브러리 불러오기 
const XLSX = require('xlsx'); 

// 데이터 객체 배열 생성 
const data = [ 
  { name: "John Doe", age: 30, email: "johndoe@example.com" }, 
  { name: "Jane Smith", age: 25, email: "janesmith@example.com" }, 
  { name: "Bob Johnson", age: 40, email: "bobjohnson@example.com" } 
]; 

// 시트 생성 
const ws = XLSX.utils.json_to_sheet(data); 

// 엑셀 파일 생성 
const wb = XLSX.utils.book_new(); 
XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); 

// 파일 저장 XLSX.writeFile(wb, "example.xlsx");


위 코드에서는 객체 배열 data를 생성하고, utils.json_to_sheet() 메서드를 사용하여 시트 객체(ws)로 변환합니다. json_to_sheet() 메서드는 자동으로 객체 배열의 속성 이름을 열(column) 이름으로 사용합니다.

시트 객체를 엑셀 파일 객체(wb)에 추가한 후 writeFile() 메서드를 사용하여 엑셀 파일을 저장합니다. 저장된 엑셀 파일을 열어보면 data 배열의 내용이 시트에 채워져 있는 것을 확인할 수 있습니다.

만약 객체 배열의 속성 이름을 변경하거나 일부 속성만 시트에 포함하고 싶다면 utils.json_to_sheet() 메서드의 옵션을 사용하여 컬럼 이름을 수정하거나 속성을 선택할 수 있습니다.

 

utils.aoa_to_sheet() 메서드를 사용하여 2차원 배열을 시트로 변환하고, 이를 엑셀 파일로 저장하는 예시 코드 입니다.

 
 
// xlsx 라이브러리 불러오기 
const XLSX = require('xlsx'); 

// 2차원 배열 생성 
const data = [ 
  ["Name", "Age", "Email"], 
  ["John Doe", 30, "johndoe@example.com"], 
  ["Jane Smith", 25, "janesmith@example.com"], 
  ["Bob Johnson", 40, "bobjohnson@example.com"] 
]; 

// 시트 생성 
const ws = XLSX.utils.aoa_to_sheet(data); 

// 엑셀 파일 생성 
const wb = XLSX.utils.book_new(); 
XLSX.utils.book_append_sheet(wb, ws, "Sheet1");

// 파일 저장 
XLSX.writeFile(wb, "example.xlsx");

 

위 코드에서는 2차원 배열 data를 생성하고, utils.aoa_to_sheet() 메서드를 사용하여 시트 객체(ws)로 변환합니다. 첫 번째 배열은 열(column) 이름으로 사용되며, 이후 배열은 각 행(row)의 데이터를 나타냅니다.

시트 객체를 엑셀 파일 객체(wb)에 추가한 후 writeFile() 메서드를 사용하여 엑셀 파일을 저장합니다. 저장된 엑셀 파일을 열어보면 data 배열의 내용이 시트에 채워져 있는 것을 확인할 수 있습니다.

만약 시트에 열(column) 이름이 필요하지 않다면, 첫 번째 배열을 제거하면 됩니다. 또한 2차원 배열의 일부분만 시트에 포함하고 싶다면, slice() 메서드 등을 사용하여 데이터를 추출한 후 utils.aoa_to_sheet() 메서드에 전달하면 됩니다.
utils.json_to_sheet() 메서드와 utils.aoa_to_sheet() 메서드는 모두 xlsx 라이브러리에서 제공하는 메서드로, 자바스크립트 객체 배열과 2차원 배열을 각각 시트로 변환할 수 있습니다. 그러나 두 메서드는 다음과 같은 차이가 있습니다.

 

  • utils.json_to_sheet() 메서드: 객체 배열을 시트로 변환할 때 사용합니다. 객체 배열의 각 객체는 시트의 각 행(row)을 나타내며, 객체의 속성은 시트의 각 열(column)을 나타냅니다.
    예를 들어 { name: "John Doe", age: 30, email: "johndoe@example.com" }와 같은 객체는 시트의 한 행을 나타내며, name, age, email과 같은 속성은 시트의 열 이름으로 사용됩니다.

  • utils.aoa_to_sheet() 메서드: 2차원 배열을 시트로 변환할 때 사용합니다. 배열의 각 배열은 시트의 각 행(row)을 나타내며, 배열의 각 항목은 시트의 각 열(column)을 나타냅니다. 첫 번째 배열은 시트의 열 이름으로 사용됩니다.

 

따라서, 데이터를 어떤 형태로 가지고 있느냐에 따라 utils.json_to_sheet() 메서드와 utils.aoa_to_sheet() 메서드를 선택하여 사용할 수 있습니다. 
만약 데이터가 객체 배열로 구성되어 있고, 각 객체의 속성이 열 이름으로 사용될 수 있는 경우 utils.json_to_sheet() 메서드를 사용하면 편리합니다.
그러나 데이터가 2차원 배열로 구성되어 있거나, 열 이름을 별도로 지정하고 싶은 경우에는 utils.aoa_to_sheet() 메서드를 사용할 수 있습니다.
프론트 엔드 형식으로 사용할 땐 다음과 같이 사용합니다.

 

[ React 방식으로 엑셀파일 생성 하는 예제 ]

import React from "react";
import XLSX from "xlsx";

class ExcelDownloadButton extends React.Component {
  constructor(props) {
    super(props);
    this.handleDownload = this.handleDownload.bind(this);
  }

  handleDownload() {
    // 2차원 배열 생성
    const data = [
      ["Name", "Age", "Email"],
      ["John Doe", 30, "johndoe@example.com"],
      ["Jane Smith", 25, "janesmith@example.com"],
      ["Bob Johnson", 40, "bobjohnson@example.com"]
    ];

    // 시트 생성
    const ws = XLSX.utils.aoa_to_sheet(data);

    // 엑셀 파일 생성
    const wb = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(wb, ws, "Sheet1");

    // 파일 저장
    const fileName = "example.xlsx";
    XLSX.writeFile(wb, fileName);

    // 다운로드 링크 생성
    const downloadLink = document.createElement("a");
    downloadLink.href = fileName;
    downloadLink.download = fileName;
    document.body.appendChild(downloadLink);
    downloadLink.click();
    document.body.removeChild(downloadLink);
  }

  render() {
    return <button onClick={this.handleDownload}>Download Excel</button>;
  }
}

export default ExcelDownloadButton;
반응형

댓글