Why ActiveReportsJS
왜 Vite App에서 ActiveReportsJS를 선택해야 할까요?
3. 보고서 뷰어 컴포넌트를 초기화하고, ActiveReportsJS 디자이너로 만든 보고서를 불러옵니다.
src/App.jsx 파일을 열어 호스트 요소를 추가하고, 위에서 만든 report.rdlx-json 파일을 가져옵니다.
* 보고서 이름은 이전에 생성한 파일에 따라 유동적으로 설정해 주세요.
import React from 'react';
import './App.css';
import { Viewer } from '@mescius/activereportsjs-react';
import { Core } from '@mescius/activereportsjs';
function
App() {
return (
<div id="viewer-host">
<Viewer report={{ Uri: 'report.rdlx-json' }} />
</div>
);
}
export default App;
전체 코드는 아래 샘플을 확인해 주세요.
4. Vite 앱을 실행하여 결과를 확인합니다.
npm run dev 또는 yarn dev 명령을 사용하여 실행합니다.
npm run dev
For Vite 개발자
ActiveReportsJS 첫 사용자를 위한 추천 튜토리얼
-
ActiveReportsJS Designer를 사용해 보고서 만들기
노코드 리포트 디자이너 프로그램을 사용해 보고서 양식을 만들고, 데이터를 바인딩하는 방법에 대해 설명합니다.
-
Vite 웹 응용 프로그램에 리포트 디자이너를 추가하는 방법
Vite 앱에 리포트 디자이너를 추가하는 방법에 대해 설명합니다. 리포트 디자이너를 활용해 최종 사용자가 직접 리포트 양식을 만들고 수정할 수 있습니다.
-
리포트 미리보기 없이 PDF 파일로 내보내는 방법
ActiveReportsJS 뷰어 화면 없이 리포트를 PDF로 내보내서 저장하는 방법에 대해 설명합니다.
ActiveReportsJS Starter Template
커스터마이징이 가능한 샘플 & 템플릿을 통해서
빠르게 개발을 시작해보세요.
ActiveReportsJS를 활용한 다양한 템플릿과 샘플입니다. 실제 데모를 확인하실 수 있으며, 다운로드하여 직접 커스터마이징하여 사용하실 수 있습니다.
Vite 리포팅 컨트롤 ActiveReportsJS 주요 기능
List of Services
-
강력한 데이터 바인딩List Item 1
향상된 데이터 바인딩 기능을 통해 리포트를 쉽고 빠르게 REST API, OData, GraphQL에 바인딩할 수 있습니다.
-
유연한 리포트 레이아웃List Item 2
두 가지 유형의 레이아웃과 다양한 컨트롤 중에서 선택하여 더욱 완벽한 리포트를 생성할 수 있습니다.
-
데이터 시각화List Item 3
다양한 JSON 데이터 소스를 사용하여 여러분의 웹 어플리케이션에 고성능 JavaScript 리포트를 생성해 보세요. 표, 리스트, 차트를 통해 더 많은 인사이트를 얻을 수 있습니다.
-
맞춤형 보고서List Item 4
사용자가 보고서를 더욱 빠르고 섬세하게 생성할 수 있도록 보고서 디자이너 컴포넌트를 활용하십시오.
-
완벽한 뷰어
뷰어 컴포넌트를 사용하여 최종 사용자에게 최고의 보기, 내보내기 및 인쇄 기능을 제공해 보세요.
-
프론트엔드 프레임워크 지원
ActiveReportsJS는 모든 주요 프레임워크를 지원하여, Angular, React, Svelte, Vue, Nuxt, Next.js, Vite 애플리케이션에 쉽게 통합할 수 있습니다.
