매뉴얼 관리

문서개요

이 문서는 AsciiDoc 으로 작성하는 매뉴얼 관리에 대해 설명합니다.
매뉴얼 관련된 리소스들은 GitLab을 통해서 유지 관리되고 관리 주체는 다음과 같다.
* SWD팀: 관련 리소스와 매뉴얼탬플릿 그리고 시각화를 위한 Style, CSS 등을 유지 관리한다.
* R&D팀: 각 제품별, 버전별로 매뉴얼을 작성하고 유지 관리한다.

1. Repository 구조

📒 repository (swlab-docs-제품명) (1)
  📄 antora-playbook.yml (2)
  📄 antora.yml (3)
  📄 site.yml (12)
  📂 modules (4)
    📂 ROOT (5)
      📂 images (7)
        📄 image-source-file.png (8)
      📂 pages (9)
        📄 page-source-file.adoc (10)
      📄 nav.adoc (11)
    📂 concepts (6)
      📂 images (7)
        📄 image-source-file.png (8)
      📂 pages (9)
        📄 page-source-file.adoc (10)
      📄 nav.adoc (11)
1 제품별로 구성
2 필수 구성 파일
: 사이트, 콘텐츠 원본 및 UI URL을 구성
3 필수 구성 파일
: 이름, 버전, 메타데이터, 속성 및 탐색 목록을 구성
4 필수 모듈 디렉토리
5 ROOT 모듈 디렉토리
: ROOT 모듈의 페이지는 컴포넌트 버전의 최상위 페이지가 되므로 다른 모듈에서 참조하는 공통 리소스를 저장한다.

기본 셋팅되어 있는 리소스는 수정/제거하지 않도록 주의한다.
6 명명된 모듈 디렉토리
: 필요한 만큼 생성 가능하고 생성할 때는 "모듈 디렉토리 명명 규칙"에 준하여 생성한다.
7 이미지 디렉터리
: 이미지 파일이 없다면 생성하지 않는다. 필요 시 지정된 이름 'images’로 생성한다.
8 이미지 소스 파일
: PNG, JPG, SVG 및 GIF(정적 및 애니메이션) 이미지 파일 형식을 지원한다.
9 pages 디렉토리
: 하나 이상의 AsciiDoc 소스 파일이 포함되어야 한다.
10 페이지의 원본 파일
: AsciiDoc 구문으로 마크업되고 유효한 .adoc 파일 확장명으로 저장된 페이지 파일
11 내비게이션 파일
: 사이트 탐색 파일로써 모듈당 하나의 탐색 파일을 가진다. "내비게이션 파일"을 참고하여 작성한다.
12 정적 HTML 파일 생성 파일
: 사이트를 오프라인 HTML 파일로 고객에게 제공할 때 사용한다.

1.1. 필수 구성 파일

1.1.1. antora-playbook.yml

antora-playbook.yml 파일은 Antora 프로젝트에서 사이트를 생성하기 위해 사용되는 주요 설정 파일로써 사이트의 전반적인 설정을 정의한다.

SWD팀에서 관리하므로 content:sources:branches: 값을 제외하고 수정하지 않는다.

 
site: (1)
  title: SWLab Docs Site
  url: https://swlab.bwg.co.kr/docs
content: (2)
  sources:
    - url: https://gitlab.bwg.co.kr/swd/swlab-docs.git
      branches: [master, v1.0] (6)
asciidoc: (3)
  attributes:
    experimental: ''
ui: (4)
  bundle:
    url: https://gitlab.bwg.co.kr/swd/swlab-ui/-/jobs/artifacts/master/raw/build/ui-bundle.zip?job=bundle-stable
    snapshot: true
output: (5)
  destinations:
  - provider: fs
    path: /data/home/bxdocs/web/docs
antora-playbook.yml 키 설명
키 설명

1) site

  • 수정금지! 사이트 제목, URL을 설정한다.

2) content

  • Antora가 빌드할 문서의 소스를 정의한다. 각 소스는 Git 리포지토리 URL, 브랜치 등을 포함한다.

  • 문서 버전이 추가되었을 때 ⑥ branches에 추가한다. 자세한 내용은 "버전 관리"에서 확인할 수 있다.

3) asciidoc

  • 수정금지! 사이트 전체에 적용되는 AsciiDoc 문서에서 사용할 전역 속성을 설정한다.

4) ui

  • 수정금지! 사이트에서 사용할 UI 번들을 정의한다.

5) output

  • 수정금지! 빌드된 사이트의 파일이 저장될 디렉토리를 정의한다.

1.1.2. antora.yml

antora.yml 파일은 Antora 프로젝트에서 각 컴포넌트의 메타데이터와 설정을 정의하는 파일이다.
각 컴포넌트의 루트 디렉토리에 위치하며, 컴포넌트의 버전을 식별, 설명 및 구성하는 필수 및 선택적 정보를 제공한다.

name: swlab-docs (1)
title: SWLab Docs (2)
version: '2.0' (3)
start_page: ready-to-write:text-editor.adoc (4)
asciidoc: (5)
  attributes:
    source-language: asciidoc@
nav: (6)
- modules/ready-to-write/nav.adoc
- modules/guide-like-bgbook/nav.adoc
antora.yml 키 설명
키 설명

1) name

  • 수정금지! 컴포넌트 버전을 식별하는 데 사용되는 컴포넌트 이름으로 리소스 ID의 컴포넌트 좌표 및 컴포넌트 버전의 게시된 리소스에 대한 컴포넌트 URL 세그먼트에서 사용된다.

2) title

  • 수정금지! 왼쪽 메뉴 페이지에 표시되는 목적으로 사용되는 컴포넌트 이름으로 공백, 대문자 및 다양한 문자를 사용할 수 있다.

3) version

  • 컴포넌트 버전을 식별하는 데 사용되는 버전으로 리소스 ID의 버전 좌표 및 컴포넌트 버전의 게시된 리소스 URL에 대한 버전 세그먼트로 사용된다.

  • 자세한 내용은 "버전 관리"에서 확인할 수 있다.

4) start_page

  • 수정금지! 페이지를 컴포넌트 버전의 홈 페이지로 지정한다.
    형식) 모듈명:페이지 (ROOT모듈은 모듈명 작성시 생략한다.)

5) asciidoc.attributes

  • 수정금지! 컴포넌트 버전에 속하는 모든 페이지와 리소스(해당되는 경우)에 적용할 AsciiDoc 속성 및 페이지 속성을 설정한다.

6) nav

  • 왼쪽 메뉴 페이지 구성에 사용될 탐색 파일 목록을 설정한다.

    • 한 줄에 하나씩 입력한다.

    • 들여쓰지 않는다.

    • 각 값을 하이픈(-)으로 시작하고 그 뒤에 공백을 입력한다.

    • 공백 뒤에 antora.yml 파일의 위치를 기준으로 개별 탐색 파일의 경로를 입력한다.

    • 나열된 순서로 왼쪽 메뉴 페이지가 구성된다.

1.2. 모듈 디렉토리 명명 규칙

모듈 이름은 페이지, 이미지, 첨부 파일, 예제 및 부분의 리소스 ID에서 모듈 좌표로 사용된다. 또한 해당 모듈에 할당된 게시 가능한 리소스의 URL에도 사용된다(ROOT 모듈 제외). 따라서 모듈 폴더 이름을 선택할 때 다음 사항을 지켜 생성한다.

  • 공백이나 슬래시(/)를 포함할 수 없다.

  • 대문자, 밑줄(_) 및 URL에서 권장되지 않는 기타 문자를 사용하지 않는다.

  • 내장 매크로의 이름(예: link elink e\link)으로 끝내지 않는다.

  • 너무 길거나 기억하기 어렵게 만들지 말고 짧고 설명적으로 만든다.

탐색 파일은 사이트의 왼쪽메뉴를 구성한다. 작성 방법은 다음과 같다.

1.3.1. 파일 이름 및 형식

탐색 파일은 nav.adoc으로 명명한다.
탐색 파일에는 하나 이상의 글머리 기호 목록이 포함되어 있다.

목록의 각 항목은 페이지에 대한 상호 참조, 사이트에 속하지 않은 웹 사이트의 URL 또는 중첩된 목록 항목 집합을 그룹화하는 범주 제목과 같은 연결되지 않은 텍스트일 수 있다.

1.3.2. 목록 구조

탐색 목록은 순서가 지정되지 않은 AsciiDoc 목록이다. 파일에 여러 목록이 포함된 경우 각 목록은 목록 제목으로 시작해야 하고 각 최상위 목록 항목은 최대 2 Level까지만 허용한다.

최상위 목록 항목은 점(.)으로 표시되는 목록 제목이거나, 목록 제목이 없는 경우 단일 별표(*)로 표시된 각 목록 항목을 말한다.

AsciiDoc 소스

탐색 파일을 작성하는 AsciiDoc 소스는 다음과 같다.

.가이드
* xref:00aboutManual.adoc[]
** xref:00_1writing.adoc[]
* xref:01title.adoc[]

결과

탐색 파일을 작성한 메뉴 형태는 다음과 같다.

메뉴의 각 항목은 문서 제목으로 표시된다. 문서 제목과 다른 항목명으로 표시하고 싶다면 [] 안에 작성한다.
내비게이션 파일
Figure 1. Navigation file (Site)

1.3.3. 내비게이션 등록

필수 구성 파일인 "antora.yml" 파일의 nav 키에 등록한다.

1.4. 매뉴얼 구성 예시

여러 개의 매뉴얼 문서를 하나의 통합 문서 사이트로 만들 때, 각 매뉴얼 문서의 내용을 논리적으로 나누어 명명된 모듈 디렉토리로 생성하고 사용자가 쉽게 탐색할 수 있도록 내비게이션 파일을 작성한다.

다음은 하나의 예시로 참고하여 각 제품의 특성에 맞게 구성하도록 한다.

1.4.1. Repository 구조

📒 repository (swlab-docs-제품명)
  📄 antora.yml
  📂 modules
    📁 ROOT
    📂 concepts (1)
      📂 pages
        📄 overview.adoc
        📄 latest-updates.adoc
        📄 architecture.adoc
      📄 nav.adoc
    📂 getting-started (2)
      📂 pages
        📄 quick-start.adoc
        📄 environment-setup.adoc
        📄 sample-application.adoc
      📄 nav.adoc
    📂 install-n-config (3)
      📂 pages
        📄 product-a.adoc
        📄 product-b.adoc
        📄 product-c.adoc
        📄 basic-configuration.adoc
        📄 advanced-configuration.adoc
      📄 nav.adoc
    📂 user (4)
      📂 pages
        📄 basic-usage.adoc
        📄 ui-components.adoc
        📄 core-features.adoc
        📄 advanced-usage.adoc
        📄 advanced-features.adoc
        📄 integration-features.adoc
      📄 nav.adoc
    📂 development (5)
      📂 pages
        📄 api-reference.adoc
        📄 command-reference.adoc
        📄 sdk-usage.adoc
      📄 nav.adoc
    📂 troubleshooting (6)
      📂 pages
        📄 faq.adoc
        📄 error-codes.adoc
        📄 getting-support.adoc
      📄 nav.adoc
    📂 examples-n-tutorials (7)
      📂 pages
        📄 basic-examples.adoc
        📄 advanced-tutorials.adoc
        📄 video-tutorials.adoc
      📄 nav.adoc
    📂 additional-resources (8)
      📂 pages
        📄 external-resources.adoc
        📄 glossary.adoc
      📄 nav.adoc
1 홈: 사이트의 전반적인 소개 및 최신 정보를 제공하는 페이지다. 사용자들이 처음 방문했을 때 전체적인 구조와 최신 업데이트를 빠르게 파악할 수 있도록 돕는다.
2 시작하기: 제품 설치 및 초기 설정에 대한 안내를 제공하여 새로운 사용자가 쉽게 따라하며 제품을 사용할 수 있게 한다.
3 설치 및 설정 가이드: 각 제품 또는 버전별 설치 방법과 초기 구성 및 기본 설정과 고급 옵션 및 사용자 정의 설정 등을 작성한다.
4 사용자 가이드: 제품의 주요 기능과 사용 방법에 대한 자세한 설명을 제공하여 사용자들이 제품을 효율적으로 활용할 수 있도록 도와준다.
5 개발자 가이드: 개발자들을 위한 API 참조, 명령어, SDK 사용법 등을 제공한다. 개발자들이 제품을 확장하거나 커스터마이즈하는 데 필요한 기술 정보를 포함한다.
6 문제 해결: 자주 묻는 질문(FAQ)과 일반적인 에러 코드 및 해결 방법, 기술 지원 연락처 및 방법 등 사용자가 자주 겪는 문제와 그 해결 방법을 빠르게 찾을 수 있도록 돕는다.
7 예제 및 튜토리얼: 예제 코드와 튜토리얼을 제공하여 사용자가 제품을 더 잘 이해하고 활용할 수 있도록 돕는다.
8 기타 리소스: 추가적인 참고 자료와 외부 리소스를 제공한다.

1.4.2. 내비게이션 파일

concepts > nav.adoc

.Concepts
* xref:overview.adoc[개요]
* xref:latest-updates.adoc[최신 업데이트]
* xref:architecture.adoc[아키텍처]

getting-started > nav.adoc

.Getting Started
* xref:quick-start.adoc[설치]
* xref:environment-setup[환경 설정]
* xref:sample-application.adoc[기본 예제]

install-n-config > nav.adoc

.설치 및 설정
* 설치
** xref:product-a.adoc[제품A 설치]
** xref:product-b.adoc[제품B 설치]
** xref:product-c.adoc[제품C 설치]
* 설정
** xref:basic-configuration.adoc[기본 설정]
** xref:advanced-configuration.adoc[고급 설정]

user > nav.adoc

.사용자 가이드
* xref:basic-usage.adoc[기본 사용법]
** xref:ui-components.adoc[UI 구성 요소]
** xref:core-features.adoc[기본 기능]
* xref:advanced-usage.adoc[고급 사용법]
** xref:advanced-features.adoc[고급 기능]
** xref:integration-features.adoc[통합 기능]

development > nav.adoc

.개발 가이드
* API 참조
** xref:api-overview.adoc[API 개요]
** xref:endpoint-descriptions.adoc[엔드포인트 설명]
* 명령어 참조
** xref:cli-commands.adoc[아키텍처]
* SDK 사용법
** xref:sdk-installation.adoc[SDK 설치]
** xref:sample-code.adoc[샘플 코드]

troubleshooting > nav.adoc

.문제 해결
* xref:faq.adoc[자주 묻는 질문(FAQ)]
* xref:error-codes.adoc[에러 코드]
* xref:getting-support.adoc[지원 받기]

examples-n-tutorials > nav.adoc

.예제 및 튜토리얼
* xref:basic-examples.adoc[기본 예제]
* xref:advanced-tutorials.adoc[고급 튜토리얼]
* xref:video-tutorials.adoc[비디오 튜토리얼]

additional-resources > nav.adoc

.기타 리소스
* xref:external-resources.adoc[외부 리소스]
* xref:glossary.adoc[용어집]

1.4.3. antora.yml

nav:
- modules/concepts/nav.adoc
- modules/getting-started/nav.adoc
- modules/install-n-config/nav.adoc
- modules/user/nav.adoc
- modules/development/nav.adoc
- modules/troubleshooting/nav.adoc
- modules/examples-n-tutorials/nav.adoc
- modules/additional-resources/nav.adoc

2. 버전 관리

Antora는 Git 리포지토리의 브랜치를 통해 각기 다른 문서 버전을 관리한다. 각 브랜치는 독립된 문서 버전을 나타내며, 이를 통해 여러 버전의 문서를 동시에 관리하고 배포할 수 있다.

2.1. Repository 구성

각 브랜치는 각각의 문서 버전을 나타낸다. master 브랜치는 최신 버전을, v1.0 브랜치는 1.0 버전을 나타낼 수 있다.

브랜치명은 version 의 'v’를 prefix로 생성한다.

2.2. Antora Playbook 파일 설정

antora-playbook.yml 파일에서 각 브랜치를 소스로 추가한다.

content:
  sources:
    - url: https://gitlab.bwg.co.kr/swd/swlab-docs.git
      branches: [master, v1.0] (1)
      start_path: getting-started
1 master 브랜치는 최신 버전을, v1.0 브랜치는 1.0 버전을 나타낼 수 있다.

2.3. 컴포넌트 설정 (antora.yml)

각 브랜치의 루트 디렉토리에 위치한 antora.yml 파일을 통해 해당 버전의 메타데이터를 정의한다. master 브랜치는 최신 버전을, v1.0 브랜치는 1.0 버전을 나타낸다.

2.3.1. master 브랜치의 antora.yml 파일

버전이 하나만 존재할 경우

version: '1.0' (1)
1 branch 명: v1.0

버전이 추가되었을 경우

version: '2.0' (1)
1 최신 버전을 기입한다.

3. 다국어 관리

국제화를 위해서 각 나라의 언어별로 프로젝트를 구분하여 리소스를 관리하는 구조를 갖고 있다.

4. 정적 HTML 파일 생성

다음 과정을 통해 사이트를 정적 HTML 파일로 고객에게 제공할 수 있다.

  1. 파일 다운로드

  2. 고객 안내

4.1. 파일 다운로드

Antora로 사이트를 빌드할 때 사이트의 정적 HTML 파일을 생성한다.
sftp로 다운로드 받고자하는 제품의 압축 파일을 다운로드한다.

4.1.1. cmd 창 실행

  • 실행 창(Run dialog box) 열기
    Window+R 버튼

  • 명령 프롬프트(Command Prompt) 실행
    'cmd' 입력

cmd 실행
Figure 2. 명령 프롬프트(Command Prompt) 실행

4.1.2. sftp 접속

>sftp -P 6300 bxdocs@182.162.100.110
bxdocs@182.162.100.110's password: (1)
1 비밀번호는 SWD팀에 문의한다.

4.1.3. 다운로드

sftp> get /data/home/bxdocs/off_site/swlab-docs-bxcm/docs-bxcm.zip (1)
sftp> get /data/home/bxdocs/off_site/swlab-docs-bxcp/docs-bxcp.zip (2)
sftp> get /data/home/bxdocs/off_site/swlab-docs-bxi/docs-bxi.zip (3)
sftp> get /data/home/bxdocs/off_site/swlab-docs-bxm/docs-bxm.zip (4)
1 BXCM
2 BXCP
3 BXI
4 BXM

4.1.4. sftp 종료

sftp> quit

4.2. 고객 안내

압축 파일을 전달한 후 오프라인 환경에서 문서를 열람하는 방법을 안내한다.

압축파일 구조
📒 docs-{제품명}.zip
  📂 site
    📂 _
    📂 swlab-docs-{제품명}
    📄 index.html (1)
1 압축파일 해제 후 site\index.html 파일을 더블 클릭하여 실행한다.

5. Local 테스트 방법

다음 과정을 통해 생성 또는 수정된 문서를 commit하기 전 Local에서 미리 확인할 수 있다.

5.1. Node 설치

"npm"과 "npx" 명령어 사용을 위한 Node를 설치한다.(16버전 권장)

5.2. npm install

  • 현재 프로젝티의 'package.json' 파일에 명시된 의존성 라이브러리를 설치하기 위해 npm install 명령어 수행한다.

npm install

  • 로컬 환경에서 페이지를 띄우기 위해 http-server 설치한다.

npm install -g http-server

5.3. antora-playbook.yml 수정

Local에서 테스트를 하기 위해 antora-playbook.yml 파일을 수정한다.

5.3.1. content > sources > url 임시 변경

content 키의 sources 하위에 있는 url을 다음과 같이 임시로 변경한다.

content:
  sources:
    - url: .

5.3.2. output 키 주석 처리

output 키 전체를 주석 처리한다.

# output:
#   destinations:
#     - provider: fs
#       path: ...

5.4. Local 실행

문서를 Local에서 빌드하고 페이지를 띄우기 위해 다음과 같은 명령어를 수행한다.

  • antora build

npx antora --fetch antora-playbook.yml

  • http-server

npx http-server

또는

npx http-server -p 포트번호

5.5. 페이지 접속

localhost:8080(또는 설정한 포트번호) 접속 후 build > site > 프로젝트 폴더 > current로 이동.

수정 후 npx antora --fetch antora-playbook.yml 명령어를 실행 후 새로고침해야 생성 또는 수정한 내용이 반영된다.
SWLab Bankware Global
  • 전체
  • BXM
  • BXCM
  • BXCP
  • BXI
제품 선택 시 더 정확한 매뉴얼 가이드를 제공해드립니다.

Copyright© Bankwareglobal All Rights Reserved.