ActiveReportsJS는 개발자들이 갖고 있는 리포트 개발의 어려움과 니즈를 이해하고 있는 편의성이 매우 높은 리포팅 솔루션입니다. 특히 데이터를 활용함에 있어, 마법사를 통한 데이터 세팅만으로도 자동으로 데이터 셋을 구성해주는 편의성, 도구상자에서 다양한 컨트롤을 드래그 앤 드롭 해서 디자인을 하는 기능들은 다른 리포트 제품에서 쉽게 찾아보기 힘든 편의 기능이라고 생각합니다.
- 엔터크론 아이앤씨 김은규 부장님 -
글로벌 교역량이 증가하고 이에 대한 물류 시장이 점점 커짐에 따라서, 안전하고 효율적인 물류 관리의 중요성이 날로 증가하고 있습니다. 특히 이러한 과정에서 중요한 역할을 하는 것이 바로 *포워딩입니다.
(*포워딩은 화물의 수집, 저장, 운송, 관리 등을 포함하는 물류 전반의 서비스를 제공하는 프로세스입니다.)
포워딩을 통해 기업들은 복잡하고 까다로운 국제 무역에서 다양한 운송 수단과 경로를 조율하고, 각 나라별 관련 법규와 규제를 준수하면서 안전하고 쉽게 교역을 진행할 수 있습니다.
최근 국제 교역이 활발해짐에 따라 물류 포워딩 업계는 디지털 전환(Digital Transformation)이라는 큰 변화를 맞이하고 있습니다. 기존처럼 단순한 운송 서비스를 넘어, 문서 자동화, 실시간 화물 추적, 데이터 분석을 통해 물류 프로세스의 비용과 시간을 단축하고 효율성을 극대화하여 포워딩 서비스의 품질을 한 단계 높이고자 노력하고 있습니다.
하지만 해외 교역을 위한 운송서와 같은 다양한 통관 서류 및 다양한 증빙 서류들을 자동화하는 데에 많은 어려움을 겪고 있으며, 여전히 많은 부분에서 매뉴얼로 작성하는 경우가 많습니다.
이에
전문 물류IT 솔루션 업체인 엔터크론아이앤씨에서는
“코바스 - COVAS(Corporate value aced system)”를 개발하여 포워딩에 필요한 토탈 서비스를 통합 제공하고 있습니다. 여기에는 전자 문서 자동화, 회계시스템, 정부 기관 연계를 통한 수출입 신고, 자체 클라우드 제공, PRA를 활용한 데이터 정제 처리 등 다양한 기능을 포함하고 있습니다.
이번 포스팅에서는 코바스(COVAS)에서 전자 문서 자동화 서비스를 제공하는 이유와 메시어스의 ActiveReportsJS(JavaScript 리포팅 컨트롤)을 활용하여 해당 서비스를 어떻게 효율적으로 개발하였는지 살펴보도록 하겠습니다.
포워딩은 수요 평가부터 계획, 운송, 통관 및 관리, 사후 처리 및 모니터링 등 여러 단계가 필요합니다. 그리고 이 과정에서 필수적으로 다양한 양식의 서류가 필요하게 됩니다. 송장 (Invoice), 선하증권(Bill of lading), 포장 목록 (Packing List), 원산지 증명서 (Certificate of Origin), 수입신고서 (Customs Declaration), 그 외 관세 및 부가세 납부 관련 서류 등이 그것입니다.
물류 조회나 고객 관리 등 많은 부분에서 전산화를 이루고 있지만, 여전히 많은 기업에서는 위와 같은 서류들을 작성하기 위해, MS 워드나 엑셀로 서류를 만들거나, 심지어 수기로 작성되고 관리되는 경우가 많습니다.
이 때문에 교역량이 많아지고 시간이 흘러갈수록 직원들은 서류 작업에 많은 시간을 사용하고, 이전 작업들에 대한 히스토리 관리가 어려워 비슷한 작업에 대해서 매번 새롭게 작성하거나, 통관에 문제가 생겼을 때 데이터 검색이 어려워 해결에 애를 먹는 경우가 많이 발생한다고 합니다.
또한 물류업의 특성 상 대다수의 고객사들이 해외 법인을 함께 운영하고 있으며, 법인들 사이에 이러한 교역을 위한
문서들의 표준화가 되어 있지 않아, 서류 누락 및 커뮤니케이션 실수들로 인하여 수출이 지연되어 큰 어려움을 겪고 있습니다.
이에 엔터크론아이앤씨에서는 메시어스 ActiveReportsJS의 리포트 디자이너와 순수 JavaScript 리포팅 뷰어 컨트롤을 이용하여, ActiveX나 별도의 설치 프로그램 없이
클라우드(Cloud) 기반으로 웹 페이지에서 실시간으로 포워딩 업무나 고객이 필요로 하는 다양한 서류 및 증명서들을 렌더링하고 공유할 수 있는 기능을 개발하였습니다.
ActiveReportsJS에서 제공하는 리포트 디자이너 프로그램을 통해 노코드(No-Code) 기반으로 드래그 앤 드랍 만으로 통관, 관세 관련 다양한 운송 및 수출을 위한 제출 양식을 쉽게 구성할 수 있게 되었으며, 이렇게 만들어진 양식들은 JSON 파일 형식으로 자동 변환되어, 클라우드 및 데이터베이스에서 쉽게 저장하고 관리할 수 있습니다.
이를 통해 외부로부터 안전하게 서류와 데이터를 보관하고 해외 법인들과 표준화된 양식 공유 및 사용이 가능하게 개발할 수 있었습니다.
이를 통해 사용자는 포워딩 관련 양식들을 서류 작성과 관리에 더 이상의 시간과 비용을 낭비하지 않고 효율적인 업무 처리와 문서 관리가 가능해졌습니다.
아래는 엔터크론아이앤씨의 “코바스(COVAS)”에서 ActiveReportsJS(프론트엔드 리포팅 컨트롤)가 어떻게 사용되고 있는지 보여 줍니다.
복잡한 템플릿 생성도 쉽게
앤터크론아이엔씨에서는 ActiveReportsJS를 이용하여 국제 물류 운송 시에 필요한 선하증권(Bill of Lading)의 자동 발급 시스템을 구현하였습니다.
ActiveReportsJS는 차트, 표, 이미지, 바코드, 텍스트 상자 등 다양한 리포트 양식을 디자인하기 위한 모든 컨트롤을 제공합니다. 노코드 기반의 리포트 디자이너를 통해 운송서와 같은 복잡한 통관 물류 관련 문서 템플릿(양식)들을 코딩 없이 드래그 앤 드롭으로 생성할 수 있습니다.
이를 통해서 개발자들은 웹 리포팅을 만드는데 양식 디자인으로 사용하는 시간을 줄이고 중요한 로직 개발에 집중할 수 있습니다.
사용자는 아래와 같이 코바스(COVAS) 시스템에서 선하증권(Bill of Lading)의 정보를 입력합니다. 이제 해당 선하증권 정보는 고객사 계정 아래에 저장이 되어 데이터베이스에서 관리가 됩니다.
* 위의 화면은 실제로 고객사의 시스템 상에서 선하증권을 입력하는 화면입니다.
아래는 위에서 시스템을 통해 사용자가 입력한 데이터를 출력물 형식으로 만들어 주기 위해 ActiveReportsJS에서 코딩 없이 디자이너로 생성한 리포트 템플릿입니다.
디자이너에서 데이터가 들어갈 섹션에 Rest API로부터 받아온 JSON 데이터의 항목 이름(Name)을 드래그-앤-드롭으로 맵핑해주면, JSON 파싱과 같은 코딩 없이도 자동으로 양식에 맞춰 데이터를 뿌려주어 출력물을 간편하게 생성할 수 있습니다.
* 실제 ActiveReportsJS 리포트 디자이너에서 만든 Air Waybill 템플릿입니다.
아래는 위의 리포트를 실제 실행한 화면으로, 별도의 뷰어 프로그램 설치 없이도 실시간으로 웹 브라우저에서 렌더링하거나 PDF 형식으로 저장 또는 인쇄하는 것이 가능합니다.
* 실제 ActiveReportsJS 뷰어를 통해 보여지는 Air Waybill의 모습입니다.
다양한 계산 수식 지원
ActiveReportsJS에는 기초 연산에 관한 함수 뿐만 아니라 수십 가지의 수학, 논리, 데이터, 변환, 비교, 집계에 대한 함수들을 기본 제공하고 있어 JSON 데이터를 쉽게 가공하고 출력할 수 있습니다.
이를 통해, 앤터크론아이앤씨에서는 국세청 홈텍스에서 제공되는 서식과 동일한 전자 세금 계산서를 구현하여
실제 세금계산서 발급 업무도 쉽게 하나의 시스템 상에서 할 수 있도록 ActiveReportsJS를 통해서 구현했습니다.
* 실제 ActiveReportsJS 리포트 디자이너에서 만든 세금 계산서 템플릿입니다.
여러가지 데이터 소스를 함께 사용
ActiveReportsJS에서는 복잡한 다수의 JSON 데이터 소스를 동시에 바인딩하여 적용할 수 있습니다. ActiveReportsJS 리포트 디자이너 프로그램에서는 Rest API와 같이 URL을 통해서 JSON 데이터 연결을 쉽게 할 수 있도록 지원합니다.
또한, 받아온 JSON 문자열을 Data Set(데이터셋)으로 변환해주는 기능을 제공하여, 복잡한 JSON 데이터도 쉽게 활용하여 리포트를 빠르게 생성할 수 있도록 지원합니다.
* ActiveReportsJS 디자이너에서 외부의 JSON DataSource를 연결한 모습입니다.
엔터크론아이앤씨는 ActiveReportsJS를 이용하여 “인사기록카드”를 구현하기 위해 개인정보가 담긴 6개의 다양한 JSON 데이터 소스를 활용했습니다.
만약에 데이터가 여러 개로 쪼개져 있더라도 이를 하나의 JSON 문자열로 재구성할 필요 없이, 여러 개의 데이터 소스를 하나의 리포트에서 생성에 활용할 수 있어 리포트 개발이 더욱 용이합니다.
또한 한 개의 섹션에서 표시할 인사정보 데이터가 길어지면 자동으로 ActiveReportsJS 표(Table)의 멀티라인 기능을 통해 해당 영역이 늘어나면서 데이터가 표시되도록 구현하였으며, 혹시 페이지를 넘어가더라도 연속 페이지 리포트 양식을 사용하여 내용이 다음페이지로 자연스럽게 연결되도록 구성되었습니다.
* 실제 ActiveReportsJS 리포트 디자이너에서 만든 인사기록카드 템플릿입니다.
* 실제 ActiveReportsJS 뷰어를 통해 보여지는 인사기록카드의 모습입니다.
ActiveReportsJS는 프론트엔드 어플리케이션에서 데이터를 시각화하기 위한 리포팅 솔루션입니다. ActiveReportsJS의 리포트 디자이너 프로그램을 통해, JSON 데이터만으로 원하는 템플릿의 리포트를 쉽고 빠르게 생성해 보세요.