프로그래밍/spreadjs

SpreadJS AI 도우미 - 수식 해설과 생성을 동시에!

benscript 2025. 8. 11. 10:25
반응형

요즘 AI가 대세라고 하더니 일반 자바스크립트 UI 제품에서도 이제 AI 기능이 탑재되고 있네요 

몇 년전만 해도 생각도 못한 부분인데 너무 놀라울 따름입니다. 

 

현재 사용중인 SpreadJS(웹에서 돌아가는 Excel 같은 스프레드시트 라이브러리)에서도 AI 기능을 제공하는데요 

다만 아직 공식적으로 지원은 안하고 맛보기로 어떤 기능을 제공한다~ 이정도 인 거 같더라구요

 

그럼 간단히 해당 기능에 대해서 소개드리겠습니다.

 

AI 기능의 이름은 AI Assistant이고 이 AI 비서가 하는 일은 크게 두 가지입니다.

  1. 수식 자동 생성 – 자연어로 설명하면 AI가 알아서 수식 만들어줌
  2. 수식 해설 – 복잡한 수식을 쉽게 풀어서 설명해줌

이제 더 이상 함수 이름 까먹고 문서 찾을 필요 없이, 그냥 하고 싶은 걸 입력하면 됩니다

 

1. 자연어 → 수식 자동 생성

 

예를 들어 시트에 판매 데이터가 있다고 해봅시다.
“B열에서 50보다 큰 값들의 합계를 구해줘” 라고 AI 패널에 입력하면…
=SUMIF(B:B,">50")
이렇게 깔끔한 수식을 뽑아줍니다.

기존에는 함수명 기억하고, 범위 지정하고, 조건식 쓰느라 몇 번씩 왔다갔다 했는데 이제는 한 줄 설명으로 끝납니다.

사용 방법도 간단합니다.

  1. 수식 편집 패널(Formula Editor Panel)에서 AI 아이콘 클릭
  2. 자연어로 원하는 계산 설명 입력
  3. AI가 제안한 수식을 보고 Apply 클릭 → 바로 시트에 적용

 

2. 복잡한 수식? AI가 해설해줌

=SUM(IF(A1:A100>50,A1:A100))
이런 수식, 한 번에 의미가 딱 안 들어오죠?

AI Assistant의 수식 해설 기능을 쓰면 이렇게 바꿔서 말해줍니다.

“A1부터 A100까지 값 중 50보다 큰 값들만 골라서 합산하는 수식”

 

게다가 어떤 함수가 무슨 역할을 하는지도 하나씩 알려줍니다.
덕분에 수식을 디버깅하거나, 다른 사람 수식을 이해할 때 훨씬 편해집니다.

 

  1. 수식 해석이 필요한 셀 클릭  
  2. 수식 해석 실행을 위한 수식 설명 아이콘(물음표 아이콘) 클릭 
  3. 결과 표시됨

개발자 관점: 연동도 쉽다

AI Assistant를 활성화하기 위해서는 SpreadJS에 스크립트를 추가해주면 됩니다.

 

헤더 추가 방식

<script src="gc.spread.sheets.ai.x.x.x.min.js"></script>

 

모듈 추가 방식

import '@mescius/spread-sheets-ai-addon';

 

SpreadJS와 다양한 AI 모델과 연결할 수 있도록 유연한 접근 방식을 제공하며 보안이 걱정된다면 API 키를 프론트에 직접 쓰지 말고, 백엔드 프록시를 두는 방식을 추천합니다.

정리

SpreadJS AI Assistant는 함수 검색 + 수식 작성 + 수식 공부를 한 번에 해결해주는 기능입니다.

  • 함수 문법 잘 몰라도 AI가 만들어줌
  • 복잡한 수식도 이해하기 쉽게 설명
  • 개발자는 손쉽게 AI 모델 연동 가능

스프레드시트 작업이 많은 웹앱이라면, 이제 사용자가 “아… 수식 어떻게 쓰더라” 고민할 시간을 줄여줄 수 있습니다.
개발자는 API 연결만 해주면 되니, 도입 장벽도 낮은 장점이 있네ㅇ

반응형