웹 브라우저에서 엑셀? 구현하기 - SpreadJS

브라우저에서 엑셀과 같은 기능 구현에 대한 니즈가 있어 찾던 중 SpreadJS에 대해 알게 되어 공부해보았습니다.  처음에는 엑셀 기능을 JS로 구현할 수 있다는 말에 과연이라는 생각이 들었는데 막상 써보니까 나쁘지 않더라구요

 

공식 홈페이지를 보니 그냥 엑셀 웹버전이고 필터, 차트, 수식 설정도 있구요

 

공식 문서에 기본 예제에 그냥 복붙하니 금방 구현 가능했어요 ㅋㅋ

 

단순하게 html 에 호스팅할 div 태그 설정해주고 WorkBook 인스턴스 생성하면 워크북이 만들어집니다

setValue 는 데이터 할당해주는 메서드인 거 같습니당

<div id="ss" style="width:100%; height:500px;"></div>
<script>
  var spread = new GC.Spread.Sheets.Workbook(document.getElementById('ss'));
  var sheet = spread.getActiveSheet();
  sheet.setValue(0, 0, '테스트테스트!');
</script>

https://demo.mescius.co.kr/spreadjs/learn-spreadjs/features/workbook/initialization/purejs

Spread 초기화 | 기능별 학습 | SpreadJS 데모

 

이거 말고 기능이 여러가지 있긴 한데 앞으로 차근차근해볼려구요.

차트 넣는 거나 엑셀 내보내기/ 불러오기, 조건부 서식 같은 요구사항도 있어서 ㅜ ㅋㅋ

종종 공부삼아 써보고 글 기록 남겨보겠습니다!