웹 Excel을 구현하기 위한
디자이너 소스코드

여러분의 사이트에 지금 바로 웹 스프레드시트 기능을 추가해 보세요

- JavaScript로 구현된 Excel의 다양한 기능
- 가볍고 빠른 속도
- Microsoft Excel의 최신 UI

  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread
  • Spreadsheet created with Spread

디자이너 소스코드를 사용하면, 웹 Excel 개발이 쉬워집니다.

디자이너 소소코드는 웹 베이스의 프론트-엔드 어플리케이션입니다. "WYSIWYG" 디자인 기반으로 JavaScript로 구현된 Excel과 같은 기능을 제공하여, 개발자로 하여금 빠르고 쉽게 웹 Excel을 구현할 수 있도록 합니다. 디자이너 소스코드에는 웹 Excel을 구현할 때 필요한 리본 메뉴와 Excel의 다양한 기능들이 모두 구현되어 있습니다. 개발자는 이 소스를 가져다가 그대로 사용하거나, 또는 일부 기능을 빼고 더하는 것만으로도 쉽게 완벽한 웹 Excel을 구현할 수 있습니다.

※ 디자이너 소스코드를 사용하기 위해서는 “SpreadJS 개발자 라이선스”가 함께 필요합니다.

Microsoft Excel을 그대로 웹으로 가져와보세요.

리본 메뉴 : Excel의 표준 아이콘을 활용하여, 사용자가 쉽게 기능을 사용할 수 있는 리본 메뉴가 포함되어 있습니다. 또한 함수를 입력할 수 있는 수식 입력줄이 있습니다.
Excel 시트 : 셀 기반의 Excel 기능이 구현되어 있습니다. 시트단위로 나눠서 관리할 수 있으며, 자동 채우기나 셀 드래그 & 드롭, 셀 잠그기, 노트 같은 다양한 Excel의 기능이 포함되어 있습니다.
컨텍스트 메뉴 : 마우스 오른쪽키를 클릭하여 컨텍스트 메뉴를 사용할 수 있으며, 각 영역에 맞는 다른 컨텍스트 메뉴가 보여집니다. 컬럼헤더에서 컨텍스트 메뉴를 실행하면, 컬럼 숨기기나 헤더 세팅과 같은 컬럼헤더를 위한 컨텍스트 메뉴가 발생합니다.
다이얼로그 박스 : Excel과 마찬가지로 기능 설정을 다이얼로그 박스를 사용하여 쉽게 할 수 있습니다.
상태바 : 현재 Excel의 상태나 배율을 알 수 있는 상태 바 기능이 포함되어 있습니다.

웹 Excel의 장점


누구나 이미 익숙한 방식

모두에게 익숙한 Microsoft Excel의 동작 원리 그대로 사용이 가능 합니다. 쉽게 배우고, 직관적으로 사용할 수 있습니다.


오프라인 문서를 온라인 문서로 전환

스프레드 가져오기 기능을 이용하면, 이미 가지고 계신 수많은 Excel 문서를 손쉽게 온라인으로 전환할 수 있습니다. 사용자는 이렇게 업로드 된 문서를 언제 어디서나 웹을 통해 사용할 수 있습니다.


데이터 관리

JSON형태로 쉽게 전환되는 데이터는 DB에 저장하여 다양한 분석을 가능하게 합니다.


보고서로 활용

Microsoft Excel의 다양한 수식을 지원하는 웹 Excel을 통해 재무/회계 관련 보고서를 만들 수 있습니다. 온라인으로 작성된 보고서를 웹을 통해 실시간으로 공유할 수 있습니다. JavaScript로 구현된 웹 Excel은 PC, 태블릿, 모바일 등 다양한 디바이스의 최신 모던 웹 브라우저에서 호환되어 언제 어디서든 활용할 수 있습니다.


주요 특징

완전한 Excel 기능

300+ 함수 라이브러리, 그리드, 조건부 서식, Excel 가져오기 내보내기 등 다양한 Excel 기능이 완벽하게 구현되어 있어, 별도의 개발 없이도 바로 사용할 수 있는 웹 Excel 소스 코드 입니다.

세련된 UI

최신의 Microsoft Excel 스타일로 개발되었습니다. 사용자의 디자인에 대한 요구를 충분히 만족시키기 때문에 개발자는 기능 외에 다른 요소를 고민하지 않아도 됩니다.

빠른 속도

최신의 JavaScript 웹 기술을 통해 빠르고 가벼운 웹 Excel을 구현하였습니다. Excel의 수식 및 셀 서식 등이 포함된 대량의 데이터를 빠른 속도로 불러옵니다.

데모

디자이너 소스코드의 데모페이지는 없지만 SpreadJS 제품에 포함되어 있는 Spread.Sheets Designer와 기능이 동일합니다.
PC에서 다음의 링크를 통해 Spread.Sheets Designer를 설치해 기능을 확인하여 보실 수 있습니다.


Spread.Sheets Designer
Free Download

자주하는 질문

  1. 어떤 브라우저에서도 잘 동작 하나요?

    디자이너 소스코드는 JavaScript 기술을 사용하여 ActiveX나 플러그인 설치 없이도 거의 모든 주요 브라우저에서 잘 동작 합니다. 단 IE는 10 이상의 브라우저를 사용해 주셔야 합니다. (IE 10+, Chrome, Firefox, Safari, Opera)

  2. 다국어를 지원하나요?

    1) 한국어와 영어 중국어 지원을 위해 각각의 리소스 파일이 존재 합니다. (./common/resources.xx.js)
    2) 각 언어를 지원하는 메인 인덱스 페이지 또한 아래와 같이 존재 합니다.
       - 한국어 ./index/index_ko.html
       - 영어 ./index/index_en.html"
       - 중국어 ./index/index.html"

  3. 어떠한 기술들이 사용 되었나요?

    1) Knockout: 현지 언어 지원을 목적으로 데이터 바인딩(data-bind)기능을 이용하고 있습니다.
    2) JQuery: HTML 요소를 제어하기 위한 목적으로 사용합니다.
    3) JQuery UI: 메뉴나 다이얼로그 박스와 같은 UI를 제공하기 위해 사용합니다.
    4) Spread.Sheets v10: Excel과 같은 기능을 지원하는 Web 프론트-엔드 컴포넌트입니다.
    5) Spread.Sheets v10 Client Side Excel IO: 순수 프론트-엔드 엑셀 내보내기/가져오기 기능을 제공해 드립니다.
    6) OpenSource(MIT license):
      (A) File Saver: 로컬머신에 파일을 저장하기 위해 사용합니다.
      (B) Z-Tree: 트리 구조를 보여주고 동작을 지원하기 위해 사용합니다.
    8) 그레이프시티 제작 위젯:
       (A) Ribbon: Excel과 같은 UI와 기능들을 제공합니다. (./src/ribbon directory)
       (B) Spread.Sheets 연관 패키지(./src/spreadWrapper directory)
       (C) Color Picker: 색상 선택 기능을 제공합니다. (./src/widgets/colorpicker directory)
       (D) Border Picker: 테두리 설정 기능을 지원합니다. (./src/widgets/borderpicker directory)
       (E) Status Bar: 상태바 기능을 제공합니다. (./src/statusBar directory)