# HandStack

> HTML·JavaScript·SQL로 업무 웹 앱을 만드세요.

HandStack 공식 문서입니다. 화면(HTML·JavaScript), 거래 계약(transact), SQL 계약(dbclient)을 ID로 연결해 업무 웹 앱을 만듭니다.
아래 목록은 문서별 한 줄 설명이며, 각 링크는 해당 문서의 웹 페이지입니다.

## 시작하기

- [HandStack 시작하기](https://handstack.kr/docs/startup/개요): HTML·JavaScript·SQL을 아는 개발자를 위한 HandStack 시작 안내입니다.
- [내 PC에서 실행하기](https://handstack.kr/docs/startup/빠른-시작): HandStack 배포본을 구성하고 ack 서버와 게시판 예제에 접속합니다.
- [게시판 프로젝트 시작하기](https://handstack.kr/docs/startup/handsonlab/게시판-프로젝트-시작하기): BOD 게시판의 화면·거래·SQL 전체 구현을 확인하는 상세 예제입니다.
- [계층형 데이터 조회하기](https://handstack.kr/docs/startup/handsonlab/계층형-데이터-조회하기): 일반적으로 화면에 필요한 데이터는 행(Row)과 열(Column)로 구성된 표 형태의 2차원 데이터로 정형화 되어있습니다.
- [나만의 프로젝트 약어 만들기](https://handstack.kr/docs/startup/handsonlab/나만의-프로젝트-약어-만들기): 우리는 사회 생활을 하면서 정말 무수히 많은 약어를 경험합니다. 원래의 단어로만 표기해서 이용하려면 문장이 워낙 길어지게 되므로 편의 상 단어의 첫 글자만 표기해서 약어로 만들어 사용하는 경우가 많았기 때문인데 영어로 된 단어들의 조합을 첫 문자로 줄여서 주로 사용하지만 한글로 된 단…
- [업무 모듈 배치 스크립트 만들기](https://handstack.kr/docs/startup/handsonlab/업무-모듈-배치-스크립트-만들기): 도메인 업무에 필요한 나만의 업무 모듈 (예: domain_business)을 개발할 때 사용하는 프로그램 실행과 관리에 대한 task.bat의 run, handstack 명령을 작성하는 방법을 설명합니다.
- [CLI 명령으로 ack 프로그램을 실행하는 배치 스크립트 만들기](https://handstack.kr/docs/startup/handsonlab/ack-배치-스크립트-만들기): C:\bin 디렉토리 시스템 환경변수 등록
- [ASP.NET Core 10 기반 Dockerfile 가이드](https://handstack.kr/docs/startup/handsonlab/ASP.NET-Core-8-기반-Dockerfile): ASP.NET Core 10 을 기반으로 하는 경량화된 Dockerlize 앱을 만들기 위한 Dockerfile의 구조와 각 단계에 대한 설명을 포함합니다. 해당 Dockerfile은 멀티스테이지 빌드를 활용하여 최적화된 이미지를 생성하는 방식으로 작성되었습니다.
- [공통 SQL 문법](https://handstack.kr/docs/startup/handsonlab/database/공통-SQL-문법): 데이터베이스 작업 데이터베이스 작업 개발자 가이드
- [docker 기반 MariaDB 10.6.1 관리 스크립트](https://handstack.kr/docs/startup/handsonlab/database/docker%20기반%20MariaDB%2010.6.1%20관리%20스크립트): docker 이미지 다운로드
- [로그 파일 모니터링하기](https://handstack.kr/docs/startup/handsonlab/debugging/로그-파일-모니터링하기): Windows PowerShell 및 Linux와 macOS 에서 사용 가능한 로그 모니터링 명령어로 HandStack 앱에서 기록하는 실시간 로그 파일 모니터링을 위한 PowerShell(Windows) 및 Bash(Unix/Linux) 명령어를 설명합니다.
- [ack 및 module 디버깅하기](https://handstack.kr/docs/startup/handsonlab/debugging/ack-및-module-디버깅하기): 프로그램 디버깅은 코드에서 오류를 찾고 수정하는 과정입니다. 이는 개발자의 코드가 의도대로 작동하지 않을 때, 문제가 무엇인지 파악하고 해결하는 데 필수적인 과정이자 기술입니다.
- [C# 함수 디버깅하기](https://handstack.kr/docs/startup/handsonlab/debugging/function/CSharp-함수-디버깅하기): 함수 디버깅하기
- [Node.js 함수 디버깅하기](https://handstack.kr/docs/startup/handsonlab/debugging/function/Node.js-함수-디버깅하기): Jering.Javascript.NodeJS는 ack 프로그램에서 Node.js 기반 함수를 호출 할 수 있게 해주는 오픈소스 라이브러리입니다.
- [Python 함수 디버깅하기](https://handstack.kr/docs/startup/handsonlab/debugging/function/Python-함수-디버깅하기): 함수 단위로 업무를 개발할 때 JetBrain 의 PyCharm Community 에디션을 이용하는 것을 권장합니다.
- [SSH를 이용한 원격 디버깅](https://handstack.kr/docs/startup/handsonlab/debugging/SSH를-이용한-원격-디버깅): Visual Studio 2022 통합 개발 환경으로 SSH(Secure Shell)를 통해 로컬 또는 원격 macOS, Linux 원격 환경에서 실행되는 ack 프로세스에 연결할 수 있습니다. 디버깅을 설정하는 방법과 디버그하는 방법은 다음과 같습니다.
- [UI 화면 디버깅하기](https://handstack.kr/docs/startup/handsonlab/debugging/UI-화면-디버깅하기): HandStack 기반 UI 화면은 Java, C#, PHP 등 서버 코드에 전혀 의존 하지 않는 완전한 표준 HTML, CSS, JavaScript로 구성되어 있습니다. 비즈니스에 따라 UI 화면 개발을 위해 다양한 상용소스와 오픈소스 기반에서 동작하는 화면을 개발하게 됩니다.
- [Windows 서버 원격 디버깅](https://handstack.kr/docs/startup/handsonlab/debugging/Windows-서버-원격-디버깅): Visual Studio 2022 통합 개발 환경으로 Visual Studio Remote Debugger (msvsmon.exe)를 사용하여 원격 Windows Server 환경에서 실행되는 ack 프로세스에 연결할 수 있습니다. Windows Server에 GUI 접근이 가능할 때…
- [docker 기반 개발용 데이터베이스 설치하기](https://handstack.kr/docs/startup/handsonlab/docker-기반-개발용-데이터베이스-설치하기): Docker Desktop 설치하기
- [ngrok을 통해 로컬 데이터베이스를 외부와 연결하기](https://handstack.kr/docs/startup/handsonlab/ngrok을-통해-로컬-데이터베이스-연결하기): 개발 용도로 로컬 데이터베이스를 외부에서 연결해야 하지만 온프레미스 버전을 사용하고 싶지 않다면 ngrok을 통해 연결하는 옵션을 선택할 수 있습니다.
- [npm 패키지 업데이트 및 취약점 대응 방법](https://handstack.kr/docs/startup/handsonlab/npm-패키지-업데이트-및-취약점-대응-방법): npm 패키지를 최신 버전으로 업데이트하고, 설치 시 발생하는 취약점을 확인하고 해결하는 방법을 안내합니다.
- [화면 UI 컨트롤 개발 퀵 가이드](https://handstack.kr/docs/startup/handsonlab/syn.controls/화면-UI-컨트롤-개발-퀵-가이드): 개요
- [syn.uicontrols.$chartjs](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$chartjs): syn_chartjs 컨트롤은 Chart.js를 이용하여 개발됩니다. Chart.js는 데이터를 시각화하는데 사용되는 인기 있는 오픈 소스 라이브러리입니다. 다양한 유형의 차트를 생성할 수 있습니다. 예를 들어, 막대 차트, 파이 차트, 라인 차트, 도넛 차트, 산점도 등을 생성할 수…
- [syn.uicontrols.$checkbox](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$checkbox)
- [syn.uicontrols.$codepicker](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$codepicker): 코드도움은 코드를 선택하는 도움을 제공하는 컨트롤입니다. 기본적으로 데이터베이스에 BaseCode, CodeHelp 테이블을 사용하여 코드를 관리하며 업무 테이블을 활용하여 데이터를 관리 할 수 있습니다.
- [syn.uicontrols.$contextmenu](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$contextmenu): syn_contextmenu 컨트롤은 https://github.com/mar10/jquery-ui-contextmenu 를 이용하여 개발됩니다.
- [syn.uicontrols.$data](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$data): syn_data 컨트롤은 가상의 데이터 소스를 제공합니다. 이 컨트롤은 데이터를 제공하는 역할을 하며, 데이터를 서버에서 가져오거나, 클라이언트에서 생성하거나, 다른 컨트롤에서 가져오거나 다양한 방법으로 활용할 수 있습니다.
- [syn.uicontrols.$datepicker](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$datepicker): syn_datepicker 컨트롤은 Pikaday를 이용하여 개발됩니다.
- [syn.uicontrols.$element](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$element): 사용자의 입력을 받을 수 없는 html 요소에 거래 요청과 응답을 위한 확장 기능을 부여합니다.
- [syn.uicontrols.$fileclient](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$fileclient): HandStack의 파일 업로드 컨트롤은 프로필 이미지, 단일 파일, 멀티 파일, 에디터내 링크등 다양한 형태의 파일 업로드를 제공합니다.
- [syn.uicontrols.$grid](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$grid): syn_grid 컨트롤은 [유료] handsontable를 이용하여 개발됩니다.
- [syn.uicontrols.$htmleditor](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$htmleditor): syn_htmleditor 컨트롤은 TinyMCE 5를 이용하여 개발됩니다. 에디터내 이미지 업로드 및 저장소 연동을 위해 repository 모듈을 지원합니다.
- [syn.uicontrols.$jsoneditor](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$jsoneditor): syn_jsoneditor 컨트롤은 JSON Editor를 이용하여 개발됩니다. https://github.com/josdejong/jsoneditor
- [syn.uicontrols.$list](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$list): syn_list 컨트롤은 DataTables 1.10.24를 이용하여 개발됩니다.
- [syn.uicontrols.$multiselect](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$multiselect): select 태그에 통합되어 있는 다중 선택을 지원하는 컨트롤입니다. tail.select.js를 이용하여 개발됩니다.
- [syn.uicontrols.$organization](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$organization): syn_organization 컨트롤은 OrgChart를 이용하여 개발됩니다.
- [syn.uicontrols.$radio](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$radio)
- [syn.uicontrols.$select](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$select): select 태그에 통합되어 있는 단일 선택을 지원하는 컨트롤입니다. tail.select.js를 이용하여 개발됩니다.
- [syn.uicontrols.$sourceeditor](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$sourceeditor): syn_sourceeditor 컨트롤은 monaco-editor를 이용하여 개발됩니다.
- [syn.uicontrols.$textarea](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$textarea): textarea 태그에 통합되어 있는 다중 행 편집을 지원하는 컨트롤입니다. codemirror를 이용하여 개발됩니다.
- [syn.uicontrols.$textbox](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$textbox)
- [syn.uicontrols.$tree](https://handstack.kr/docs/startup/handsonlab/syn.controls/syn.uicontrols.$tree): syn_tree 컨트롤은 fancytree를 이용하여 개발됩니다.
- [tabler-icons 서브셋 웹폰트 제작하기](https://handstack.kr/docs/startup/handsonlab/tabler-icons-서브셋-웹폰트-제작하기): https://github.com/tabler/tabler-icons 저장소에 있는 소스를 기반으로 지정된 아이콘 목록을 기준으로 outline과 filled를 한 개의 웹폰트로 합쳐서 빌드하는 전용 스크립트를 제공합니다.
- [Windows 메뉴얼로 필수 프로그램 설치하기](https://handstack.kr/docs/startup/handsonlab/Windows-필수-프로그램-설치하기): .NET 10.x 버전과 Node.js 20.x LTS 버전 설치하기
- [HandStack CLI 사용법](https://handstack.kr/docs/startup/HandStack-CLI-사용법): HandStack CLI는 HandStack 서비스를 개발 및 운영에 유용한 기능을 제공하기 위한 명령줄 인터페이스(Command Line Interface)입니다.
- [개발 환경 설정하기](https://handstack.kr/docs/startup/install/개발-환경-설정하기): HandStack 서버 소스를 수정하기 위한 저장소와 개발 도구를 준비합니다.
- [선택 프로그램 설치하기](https://handstack.kr/docs/startup/install/선택-프로그램-설치하기): Visual Studio 2022의 기능을 확장하고 개발 생산성을 향상시킬 수 있는 유용한 확장 프로그램들을 소개합니다. 이 가이드에서는 각 확장 프로그램의 기능과 설치 방법을 안내합니다.
- [개발 도구 자동 설치](https://handstack.kr/docs/startup/install/자동-설치): 여러 개발 도구를 함께 준비하는 기존 OS별 자동 설치 스크립트입니다.
- [지원 운영체제](https://handstack.kr/docs/startup/install/지원-운영체제): HandStack 배포본과 .NET의 운영체제·CPU 아키텍처를 맞춥니다.
- [패키지 관리자 설치하기](https://handstack.kr/docs/startup/install/패키지-관리자-설치하기): 필요한 경우에만 WinGet 또는 Homebrew를 준비합니다.
- [필수 프로그램 설치하기](https://handstack.kr/docs/startup/install/필수-프로그램-설치하기): HandStack에 필요한 도구와 선택 기준을 확인하고 공식 설치 안내로 이동합니다.
- [기본 modules 소개](https://handstack.kr/docs/startup/learning/기본-modules-소개): HandStack은 모듈러 모놀리식 아키텍처를 기반으로 만들어 집니다. 왜냐하면 모놀리식과 마이크로서비스 아키텍처의 장점을 활용하기 위해서 인데, 프로젝트의 업무 요건이나 규모에 따라 개발 및 운영 방식을 기업내에서 결정할 수 있는 방법이기 때문입니다.
- [비즈니스, 데이터 개발 시작하기](https://handstack.kr/docs/startup/learning/비즈니스-데이터-개발-시작하기): 거래란 무엇인가요?
- [소스 디렉토리 구조](https://handstack.kr/docs/startup/learning/소스-디렉토리-구조): HandStack 디렉토리는 다음을 의미합니다. 이외에도 업무에 따라 추가적으로 하위 디렉토리가 실시간으로 생성됩니다.
- [화면 개발 시작하기](https://handstack.kr/docs/startup/learning/화면-개발-시작하기): HandStack 화면은 다음과 같은 오픈소스 기반의 프레임워크와 라이브러리를 사용하여 만듭니다.
- [ack 프로그램 가이드](https://handstack.kr/docs/startup/learning/ack-프로그램-가이드): HandStack 에서 제공되는 서버 프로그램인 ack는 마이크로소프트에서 개발한 Kestrel 서버 프로그램이며 플랫폼 간 웹 서버로, Windows, Linux 및 macOS에서 실행됩니다.
- [syn.controls.js 가이드](https://handstack.kr/docs/startup/learning/syn.controls.js-가이드): 비즈니스 앱 화면을 개발하기 위해 일관된 기능과 디자인 테마로 만드는 것이 필요합니다.
- [$array 사용법 ($array)](https://handstack.kr/docs/startup/learning/syn/array): 개요
- [양방향 데이터 바인딩 사용법 (syn.$bind)](https://handstack.kr/docs/startup/learning/syn/binding): 개요
- [브라우저 정보 사용법 (syn.$b)](https://handstack.kr/docs/startup/learning/syn/browser): 개요
- [암호화(cryptography) 사용법 (syn.$c)](https://handstack.kr/docs/startup/learning/syn/cryptography): 개요
- [Date 확장 사용법 ($date)](https://handstack.kr/docs/startup/learning/syn/date): 개요
- [크기/위치 계산 사용법 (syn.$d)](https://handstack.kr/docs/startup/learning/syn/dimension): 개요
- [iframe 자식 화면 사용법 (syn.$n)](https://handstack.kr/docs/startup/learning/syn/iframe-child): 개요
- [iframe 부모 화면 사용법 (syn.$n)](https://handstack.kr/docs/startup/learning/syn/iframe-main): 개요
- [키보드 단축키 사용법 (syn.$k)](https://handstack.kr/docs/startup/learning/syn/keyboard): 개요
- [공통 라이브러리 사용법 (syn.$l)](https://handstack.kr/docs/startup/learning/syn/library): 개요
- [syn.$m](https://handstack.kr/docs/startup/learning/syn/manipulation): 개요
- [network 사용법 (syn.$n)](https://handstack.kr/docs/startup/learning/syn/network): 개요
- [Number 확장 사용법 ($number)](https://handstack.kr/docs/startup/learning/syn/number): 개요
- [Object 확장 사용법 ($object)](https://handstack.kr/docs/startup/learning/syn/object): 개요
- [parsehtml 사용법](https://handstack.kr/docs/startup/learning/syn/parsehtml): 개요
- [리포트 출력 사용법 (syn.$p)](https://handstack.kr/docs/startup/learning/syn/print): 개요
- [reflection ($object) 사용법](https://handstack.kr/docs/startup/learning/syn/reflection): 개요
- [syn.$r (request) 사용법](https://handstack.kr/docs/startup/learning/syn/request): $request 모듈(별칭 syn.$r)은 queryString 조회/생성, url 변환, http 요청(fetch/XHR), Cookie 조작 기능을 제공합니다.
- [다국어(i18n) 리소스 사용법 (syn.$res)](https://handstack.kr/docs/startup/learning/syn/resource): 개요
- [$string 사용법 ($string)](https://handstack.kr/docs/startup/learning/syn/string): 개요
- [syn.domain](https://handstack.kr/docs/startup/learning/syn/syn.domain): HandStack의 제공 기능과 비즈니스 사이에서 도메인의 고유 업무에 필요한 공통 기능을 제공합니다.
- [syn.js 라이브러리 퀵 가이드](https://handstack.kr/docs/startup/learning/syn/syn.js-라이브러리-퀵-가이드): 이 문서는 최신 /sample/syn 예제 기준으로 자주 쓰는 패턴만 빠르게 확인하기 위한 요약입니다. 상세 속성, 인자, 반환값은 각 모듈 문서의 API 참조 섹션을 확인하세요.
- [syn.js 소개](https://handstack.kr/docs/startup/learning/syn/syn.js-소개): syn.js는 HandStack 화면 개발에서 공통으로 사용하는 클라이언트 런타임입니다. 브라우저 정보, DOM 조작, HTTP 요청, 화면 생명주기, 거래 호출, 다국어 리소스, 출력, 검증, 암호화, 기본 타입 확장 유틸리티를 syn 네임스페이스와 전역 별칭으로 제공합니다.
- [template 사용법](https://handstack.kr/docs/startup/learning/syn/template): 개요
- [유효성 검사(validate) 사용법 (syn.$v)](https://handstack.kr/docs/startup/learning/syn/validation): 개요
- [화면 개발 및 거래 업무 사용법 (syn.$w)](https://handstack.kr/docs/startup/learning/syn/webform): 개요
- [그룹코드 등록](https://handstack.kr/docs/startup/learning/ui-library/그룹코드-등록): 분류: 그룹코드 등록
- [수직 단계](https://handstack.kr/docs/startup/learning/ui-library/단계-진행-수직-단계): 분류: 단계 진행
- [수평 단계](https://handstack.kr/docs/startup/learning/ui-library/단계-진행-수평-단계): 분류: 단계 진행
- [간단한 폼이 있는 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-간단한-폼이-있는-모달): 분류: 모달
- [기본 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-기본-모달): 분류: 모달
- [성공 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-성공-모달): 분류: 모달
- [스크롤 가능 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-스크롤-가능-모달): 분류: 모달
- [위험 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-위험-모달): 분류: 모달
- [작은 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-작은-모달): 분류: 모달
- [전체 너비 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-전체-너비-모달): 분류: 모달
- [큰 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-큰-모달): 분류: 모달
- [폼이 있는 모달](https://handstack.kr/docs/startup/learning/ui-library/모달-폼이-있는-모달): 분류: 모달
- [목록](https://handstack.kr/docs/startup/learning/ui-library/목록): 분류: 목록
- [배지](https://handstack.kr/docs/startup/learning/ui-library/배지): 분류: 배지
- [고스트 버튼](https://handstack.kr/docs/startup/learning/ui-library/버튼-고스트-버튼): 분류: 버튼
- [사각 버튼](https://handstack.kr/docs/startup/learning/ui-library/버튼-사각-버튼): 분류: 버튼
- [아웃라인 버튼](https://handstack.kr/docs/startup/learning/ui-library/버튼-아웃라인-버튼): 분류: 버튼
- [추가 색상](https://handstack.kr/docs/startup/learning/ui-library/버튼-추가-색상): 분류: 버튼
- [표준 버튼](https://handstack.kr/docs/startup/learning/ui-library/버튼-표준-버튼): 분류: 버튼
- [필 버튼](https://handstack.kr/docs/startup/learning/ui-library/버튼-필-버튼): 분류: 버튼
- [기본 폼](https://handstack.kr/docs/startup/learning/ui-library/서식-기본-폼): 분류: 서식
- [내 프로필](https://handstack.kr/docs/startup/learning/ui-library/서식-내-프로필): 분류: 서식
- [수평 폼](https://handstack.kr/docs/startup/learning/ui-library/서식-수평-폼): 분류: 서식
- [입력 마스크](https://handstack.kr/docs/startup/learning/ui-library/서식-입력-마스크): 분류: 서식
- [프로젝트 ID](https://handstack.kr/docs/startup/learning/ui-library/서식-프로젝트-id): 분류: 서식
- [프로필 수정](https://handstack.kr/docs/startup/learning/ui-library/서식-프로필-수정): 분류: 서식
- [HTTP 요청](https://handstack.kr/docs/startup/learning/ui-library/서식-http-요청): 분류: 서식
- [Node.js 버전](https://handstack.kr/docs/startup/learning/ui-library/서식-node-js-버전): 분류: 서식
- [알림 정보](https://handstack.kr/docs/startup/learning/ui-library/알림-정보): 분류: 알림 정보
- [유틸리티](https://handstack.kr/docs/startup/learning/ui-library/유틸리티): 분류: 유틸리티
- [진행 상태와 업무 흐름](https://handstack.kr/docs/startup/learning/ui-library/진행-상태와-업무-흐름): 분류: 진행 상태와 업무 흐름
- [참고사항](https://handstack.kr/docs/startup/learning/ui-library/참고사항): 분류: 참고사항
- [김철수](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-김철수): 분류: 카드 헤더
- [설명 및 액션 포함](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-설명-및-액션-포함): 분류: 카드 헤더
- [설명 포함](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-설명-포함): 분류: 카드 헤더
- [액션이 있는 카드](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-액션이-있는-카드): 분류: 카드 헤더
- [카드 샘플](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-카드-샘플): 분류: 카드 헤더
- [카드 액션](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-카드-액션): 분류: 카드 헤더
- [카드 제목](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-카드-제목): 분류: 카드 헤더
- [홍길동](https://handstack.kr/docs/startup/learning/ui-library/카드-헤더-홍길동): 분류: 카드 헤더
- [오늘의 예약 현황](https://handstack.kr/docs/startup/learning/ui-library/컴포넌트-종합-예제-오늘의-예약-현황): 분류: 컴포넌트 종합 예제
- [타이포그래피](https://handstack.kr/docs/startup/learning/ui-library/타이포그래피): 분류: 타이포그래피
- [탭](https://handstack.kr/docs/startup/learning/ui-library/탭): 분류: 탭
- [빠른 실행](https://handstack.kr/docs/startup/learning/ui-library/페이지-헤더와-레이아웃-빠른-실행): 분류: 페이지 헤더와 레이아웃
- [주요 업무 영역](https://handstack.kr/docs/startup/learning/ui-library/페이지-헤더와-레이아웃-주요-업무-영역): 분류: 페이지 헤더와 레이아웃
- [폼 구성과 검증](https://handstack.kr/docs/startup/learning/ui-library/폼-구성과-검증): 분류: 폼 구성과 검증
- [기본 텍스트 입력](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-기본-텍스트-입력): 분류: 폼 요소
- [기타 입력 요소](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-기타-입력-요소): 분류: 폼 요소
- [라디오 버튼·체크박스](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-라디오-버튼-체크박스): 분류: 폼 요소
- [버튼 그룹](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-버튼-그룹): 분류: 폼 요소
- [색상 입력](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-색상-입력): 분류: 폼 요소
- [선택 그룹(버튼형)](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-선택-그룹-버튼형): 분류: 폼 요소
- [선택(Select)](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-선택-select): 분류: 폼 요소
- [스위치](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-스위치): 분류: 폼 요소
- [알림](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-알림): 분류: 폼 요소
- [유효성 검사 상태](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-유효성-검사-상태): 분류: 폼 요소
- [이미지 선택](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-이미지-선택): 분류: 폼 요소
- [입력 그룹](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-입력-그룹): 분류: 폼 요소
- [체크박스·라디오 입력 그룹](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-체크박스-라디오-입력-그룹): 분류: 폼 요소
- [텍스트·아이콘 부가 입력](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-텍스트-아이콘-부가-입력): 분류: 폼 요소
- [파일·날짜·마스크 입력](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-파일-날짜-마스크-입력): 분류: 폼 요소
- [폼 컨트롤 스타일](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-폼-컨트롤-스타일): 분류: 폼 요소
- [폼 필드셋](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-폼-필드셋): 분류: 폼 요소
- [플로팅 라벨 입력](https://handstack.kr/docs/startup/learning/ui-library/폼-요소-플로팅-라벨-입력): 분류: 폼 요소
- [계정 인증](https://handstack.kr/docs/startup/learning/ui-library/ui-예제-계정-인증): 분류: UI 예제
- [계정 잠금](https://handstack.kr/docs/startup/learning/ui-library/ui-예제-계정-잠금): 분류: UI 예제
- [계정에 로그인](https://handstack.kr/docs/startup/learning/ui-library/ui-예제-계정에-로그인): 분류: UI 예제
- [UI 라이브러리 예제 소개](https://handstack.kr/docs/startup/learning/ui-library/ui-library-소개): HandStack 화면(Tabler 기반 UI)에서 자주 쓰는 레이아웃·컴포넌트 마크업을 분류별로 모은 참고 예제입니다.
- [AUIGrid](https://handstack.kr/docs/startup/learning/uicontrols/aui-grid): 이 컨트롤은 무엇인가요?
- [AUIPivot](https://handstack.kr/docs/startup/learning/uicontrols/aui-pivot): 이 컨트롤은 무엇인가요?
- [BarCalender · 한 줄 달력](https://handstack.kr/docs/startup/learning/uicontrols/bar-calender): `는 한 줄에서 날짜 또는 월 하나를 선택하는 HandStack 컨트롤입니다. syn.uicontrols.$barcalender`로 제어하며 새 외부 라이브러리 없이 기존 Tabler 스타일을 사용합니다. 이름은 디렉터리와 동일하게 BarCalender입니다.
- [Calendar](https://handstack.kr/docs/startup/learning/uicontrols/calendar): 이 컨트롤은 무엇인가요?
- [Chart](https://handstack.kr/docs/startup/learning/uicontrols/chart): HandStack은 Highcharts와 Chart.js를 서로 독립된 UI 컨트롤로 제공합니다. 두 컨트롤은 엔진의 원형 옵션을 보존하면서 $auigrid/$grid에서 얻는 {} 또는 {}] 행 데이터와 동일한 선택/거래 계약을 사용합니다. Apache ECharts는 별도 [EC…
- [CheckBox](https://handstack.kr/docs/startup/learning/uicontrols/check-box): 이 컨트롤은 무엇인가요?
- [CodePicker](https://handstack.kr/docs/startup/learning/uicontrols/code-picker): 이 컨트롤은 무엇인가요?
- [ColorPicker](https://handstack.kr/docs/startup/learning/uicontrols/color-picker): 이 컨트롤은 무엇인가요?
- [ContextMenu](https://handstack.kr/docs/startup/learning/uicontrols/context-menu): 이 컨트롤은 무엇인가요?
- [DataSource](https://handstack.kr/docs/startup/learning/uicontrols/data-source): 이 컨트롤은 무엇인가요?
- [DatePeriodPicker](https://handstack.kr/docs/startup/learning/uicontrols/date-period-picker): 이 컨트롤은 무엇인가요?
- [DatePicker](https://handstack.kr/docs/startup/learning/uicontrols/date-picker): 이 컨트롤은 무엇인가요?
- [DropDownCheckList](https://handstack.kr/docs/startup/learning/uicontrols/drop-down-check-list): 이 컨트롤은 무엇인가요?
- [DropDownList](https://handstack.kr/docs/startup/learning/uicontrols/drop-down-list): 이 컨트롤은 무엇인가요?
- [DropDownTextList](https://handstack.kr/docs/startup/learning/uicontrols/drop-down-text-list): Tom Select 2.6.2 기반 검색·조건 태그 컨트롤입니다. 키·표시값을 검색하고 그룹별 후보를 선택합니다. 태그를 클릭하면 AND/OR와 비교 연산자를 편집합니다.
- [ECharts](https://handstack.kr/docs/startup/learning/uicontrols/echarts): syn.uicontrols.$echarts는 로컬 Apache ECharts 6.1.0 전체 번들의 원시 option과 HandStack 객체 행 거래 방식을 연결합니다.
- [Element](https://handstack.kr/docs/startup/learning/uicontrols/element): 이 컨트롤은 무엇인가요?
- [FileClient](https://handstack.kr/docs/startup/learning/uicontrols/file-client): 이 컨트롤은 무엇인가요?
- [FileDropZone](https://handstack.kr/docs/startup/learning/uicontrols/file-drop-zone): 파일을 끌어다 놓거나 클릭해서 선택하면 repository 모듈로 업로드하고, 업로드한 파일 목록에서 바로 다운로드·삭제할 수 있는 컨트롤입니다. 오픈소스 Dropzone(v6.3.5, MIT)을 기반으로 하며 파일별 진행률, 썸네일, 오류 표시를 제공합니다.
- [FilterTagTextList](https://handstack.kr/docs/startup/learning/uicontrols/filter-tag-text-list): Tom Select 2.6.2 기반 검색·조건 태그 컨트롤입니다. 키·표시값을 검색하고 그룹별 후보를 선택합니다. 태그를 클릭하면 AND/OR와 비교 연산자를 편집합니다.
- [GridList](https://handstack.kr/docs/startup/learning/uicontrols/grid-list): 이 컨트롤은 무엇인가요?
- [Guide](https://handstack.kr/docs/startup/learning/uicontrols/guide): 이 컨트롤은 무엇인가요?
- [HtmlEditor](https://handstack.kr/docs/startup/learning/uicontrols/html-editor): 이 컨트롤은 무엇인가요?
- [JQGrid](https://handstack.kr/docs/startup/learning/uicontrols/jq-grid): 이 컨트롤은 무엇인가요?
- [OpenGrid](https://handstack.kr/docs/startup/learning/uicontrols/open-grid): 이 컨트롤은 무엇인가요?
- [OrganizationView](https://handstack.kr/docs/startup/learning/uicontrols/organization-view): 이 컨트롤은 무엇인가요?
- [PropertyPanel](https://handstack.kr/docs/startup/learning/uicontrols/property-panel): 이 컨트롤은 무엇인가요?
- [RadioButton](https://handstack.kr/docs/startup/learning/uicontrols/radio-button): 이 컨트롤은 무엇인가요?
- [SignaturePad](https://handstack.kr/docs/startup/learning/uicontrols/signature-pad): 마우스·터치·펜으로 서명을 입력받는 컨트롤입니다. 오픈소스 signaturepad(szimek, MIT, v5.1.4)를 감싸며, 획의 속도에 따라 굵기가 달라지는 자연스러운 선으로 그려집니다.
- [SourceEditor](https://handstack.kr/docs/startup/learning/uicontrols/source-editor): 이 컨트롤은 무엇인가요?
- [syn.$bind 양방향 바인딩](https://handstack.kr/docs/startup/learning/uicontrols/syn-bind-양방향-바인딩): syn.$bind는 Proxy 모델과 표준 HTML 요소 또는 HandStack UI 컨트롤을 가볍게 연결하는 바인딩 API입니다. 기존 syn-datafield/bindingID 기반 거래 바인딩과 별개이며, 두 방식을 같은 화면에서 함께 사용할 수 있습니다.
- [TextArea](https://handstack.kr/docs/startup/learning/uicontrols/text-area): 이 컨트롤은 무엇인가요?
- [TextBox](https://handstack.kr/docs/startup/learning/uicontrols/text-box): 이 컨트롤은 무엇인가요?
- [TextButton](https://handstack.kr/docs/startup/learning/uicontrols/text-button): 이 컨트롤은 무엇인가요?
- [TreeView](https://handstack.kr/docs/startup/learning/uicontrols/tree-view): 이 컨트롤은 무엇인가요?
- [uicontrols 소개](https://handstack.kr/docs/startup/learning/uicontrols/uicontrols-소개): uicontrols는 HandStack 화면 개발에서 반복적으로 사용하는 입력, 선택, 데이터 표시, 편집, 네트워크 보조 UI를 syn.uicontrols 네임스페이스로 제공하는 클라이언트 컨트롤 모음입니다.
- [uicontrols 퀵 가이드](https://handstack.kr/docs/startup/learning/uicontrols/uicontrols-퀵-가이드): 이 문서는 자주 쓰는 HandStack UI 컨트롤 패턴을 빠르게 확인하기 위한 요약입니다. 상세 옵션, 이벤트, 반환값은 각 컨트롤 문서의 API 참조 섹션을 확인하세요.
- [WebGrid](https://handstack.kr/docs/startup/learning/uicontrols/web-grid): 이 컨트롤은 무엇인가요?

## 따라 만들기

- [게시판 Board 테이블 설계](https://handstack.kr/docs/tutorial/도메인모델과-데이터베이스/게시판-board-테이블-설계): 주제 목차 · 이전 데이터베이스 연결과 검증
- [데이터 모델 개념](https://handstack.kr/docs/tutorial/도메인모델과-데이터베이스/데이터-모델-개념): 주제 목차 · 다음: 게시판 Board 테이블 설계
- [데이터베이스 연결과 검증](https://handstack.kr/docs/tutorial/도메인모델과-데이터베이스/데이터베이스-연결과-검증): DB01이 연결하는 실습용 SQLite 파일에 Board 테이블과 데이터를 준비하고 검증합니다.
- [04. 도메인 모델과 데이터베이스](https://handstack.kr/docs/tutorial/도메인모델과-데이터베이스/): 게시판 데이터를 설계하고 실제 연결 DB에 테이블을 준비합니다.
- [로그와 관측 개념](https://handstack.kr/docs/tutorial/모니터링과-운영인수인계/로그와-관측-개념): 주제 목차 · 다음: 서버 프로세스 관리
- [서버 프로세스 관리](https://handstack.kr/docs/tutorial/모니터링과-운영인수인계/서버프로세스-관리): 주제 목차 · 이전 인수인계 체크리스트
- [인수인계 체크리스트](https://handstack.kr/docs/tutorial/모니터링과-운영인수인계/인수인계-체크리스트): 주제 목차 · 이전: 서버 프로세스 관리
- [12. 모니터링과 운영 인수인계](https://handstack.kr/docs/tutorial/모니터링과-운영인수인계/): 거래 이력과 서버 상태를 확인하고 운영 인수인계 자료를 만듭니다.
- [조회 조건 바꾸기](https://handstack.kr/docs/tutorial/조회-조건-바꾸기): 실행한 게시판에서 검색 입력과 거래 연결을 읽고 작은 변경을 직접 확인합니다.
- [게시판 첫 조회](https://handstack.kr/docs/tutorial/첫-조회): 기존 게시판 예제를 실행하고 조회 조건을 바꾸며 화면과 데이터의 연결을 익힙니다.
- [결함 재현과 원인 분석](https://handstack.kr/docs/tutorial/테스트와-디버깅/결함-재현과-원인분석): 주제 목차 · 이전 회귀 확인 습관
- [진단 도구와 계층](https://handstack.kr/docs/tutorial/테스트와-디버깅/진단-도구와-계층): 주제 목차 · 다음: 결함 재현과 원인 분석
- [회귀 확인 습관](https://handstack.kr/docs/tutorial/테스트와-디버깅/회귀-확인-습관): 주제 목차 · 이전: 결함 재현과 원인 분석
- [10. 테스트와 디버깅](https://handstack.kr/docs/tutorial/테스트와-디버깅/): GlobalID와 거래 이력으로 실패 원인을 단계별로 찾습니다.
- [변경 복구와 백업](https://handstack.kr/docs/tutorial/프로젝트구조와-파일작업/변경-복구와-백업): 주제 목차 · 이전: 편집과 저장 규칙
- [편집과 저장 규칙](https://handstack.kr/docs/tutorial/프로젝트구조와-파일작업/편집과-저장-규칙): 주제 목차 · 이전 변경 복구와 백업
- [contracts 디렉토리 구조](https://handstack.kr/docs/tutorial/프로젝트구조와-파일작업/contracts-디렉토리-구조): 주제 목차 · 다음: 편집과 저장 규칙
- [02. 프로젝트 구조와 파일 작업](https://handstack.kr/docs/tutorial/프로젝트구조와-파일작업/): 계약 파일 위치를 익히고 안전하게 편집·저장·복구합니다.
- [새 프로젝트 만들기](https://handstack.kr/docs/tutorial/프로젝트와-개발서버/새-프로젝트-만들기): 주제 목차 · 이전 환경 구성과 기동 확인
- [프로젝트와 서버 개념](https://handstack.kr/docs/tutorial/프로젝트와-개발서버/프로젝트와-서버-개념): 주제 목차 · 다음: 새 프로젝트 만들기
- [환경 구성과 기동 확인](https://handstack.kr/docs/tutorial/프로젝트와-개발서버/환경-구성과-기동확인): 주제 목차 · 이전: 새 프로젝트 만들기
- [03. 프로젝트와 개발 서버](https://handstack.kr/docs/tutorial/프로젝트와-개발서버/): 실습 복사본에서 게시판 프로젝트를 준비하고 개발 서버를 실행합니다.
- [이벤트와 거래 연결](https://handstack.kr/docs/tutorial/화면동작과-거래연결/이벤트와-거래-연결): 주제 목차 · 이전 화면 이동과 메뉴
- [화면 스크립트 구조](https://handstack.kr/docs/tutorial/화면동작과-거래연결/화면-스크립트-구조): 주제 목차 · 다음: 이벤트와 거래 연결
- [화면 이동과 메뉴](https://handstack.kr/docs/tutorial/화면동작과-거래연결/화면이동과-메뉴): 주제 목차 · 이전: 이벤트와 거래 연결
- [06. 화면 동작과 거래 연결](https://handstack.kr/docs/tutorial/화면동작과-거래연결/): 버튼에 거래 호출을 연결하고 팝업 이동과 목록 갱신을 구성합니다.
- [목록 화면 작성](https://handstack.kr/docs/tutorial/화면저작/목록-화면-작성): 주제 목차 · 이전 입력 화면과 레이아웃
- [입력 화면과 레이아웃](https://handstack.kr/docs/tutorial/화면저작/입력-화면과-레이아웃): 주제 목차 · 이전: 목록 화면 작성
- [화면 저작 개념](https://handstack.kr/docs/tutorial/화면저작/화면-저작-개념): 주제 목차 · 다음: 목록 화면 작성
- [05. 화면 저작 (HTML/JS 작성)](https://handstack.kr/docs/tutorial/화면저작/): 게시판의 조회 조건·목록·입력 화면을 HTML과 JavaScript로 작성합니다.
- [의존성과 재적재 관리](https://handstack.kr/docs/tutorial/확장모듈/의존성과-재적재-관리): 주제 목차 · 이전: function 모듈 실습
- [확장 모듈 개념](https://handstack.kr/docs/tutorial/확장모듈/확장모듈-개념): 주제 목차 · 다음: function 모듈 실습
- [function 모듈 실습](https://handstack.kr/docs/tutorial/확장모듈/function-모듈-실습): 주제 목차 · 이전 의존성과 재적재 관리
- [09. 확장 모듈](https://handstack.kr/docs/tutorial/확장모듈/): 서버 함수와 파일 기능에 맞는 모듈을 선택하고 의존성을 확인합니다.
- [공개 거래와 인증 점검](https://handstack.kr/docs/tutorial/환경설정과-보안/공개거래와-인증-점검): 주제 목차 · 이전 비밀정보 관리
- [비밀정보 관리](https://handstack.kr/docs/tutorial/환경설정과-보안/비밀정보-관리): 주제 목차 · 이전: 공개 거래와 인증 점검
- [환경설정 원칙](https://handstack.kr/docs/tutorial/환경설정과-보안/환경설정-원칙): 주제 목차 · 다음: 공개 거래와 인증 점검
- [11. 환경설정과 보안](https://handstack.kr/docs/tutorial/환경설정과-보안/): 환경별 설정과 비밀정보를 분리하고 공개 거래의 인증 정책을 점검합니다.
- [단독 검증과 동적 SQL](https://handstack.kr/docs/tutorial/dbclient-SQL계약/단독-검증과-동적SQL): 주제 목차 · 이전: CRUD 계약 작성
- [CRUD 계약 작성](https://handstack.kr/docs/tutorial/dbclient-SQL계약/CRUD-계약-작성): 주제 목차 · 이전 단독 검증과 동적 SQL
- [dbclient 계약 개념](https://handstack.kr/docs/tutorial/dbclient-SQL계약/dbclient-계약-개념): 주제 목차 · 다음: CRUD 계약 작성
- [07. dbclient SQL 계약](https://handstack.kr/docs/tutorial/dbclient-SQL계약/): 게시판 CRUD SQL 계약을 작성하고 화면 없이 결과를 검증합니다.
- [개념과 용어](https://handstack.kr/docs/tutorial/handstack-기초개념/개념과-용어): 주제 목차 · 다음: 요청흐름 이해
- [도입 범위 판단](https://handstack.kr/docs/tutorial/handstack-기초개념/도입범위-판단): 주제 목차 · 이전: 요청흐름 이해
- [요청흐름 이해](https://handstack.kr/docs/tutorial/handstack-기초개념/요청흐름-이해): 주제 목차 · 이전 도입 범위 판단
- [01. HandStack 기초 개념](https://handstack.kr/docs/tutorial/handstack-기초개념/): 첫 조회에서 본 화면·거래·SQL과 ack 서버의 역할을 구분합니다.
- [따라 만들기](https://handstack.kr/docs/tutorial/): 실행, 이해, 수정, 구현, 진단 순서로 게시판 개발 능력을 키웁니다.
- [거래 계약 개념](https://handstack.kr/docs/tutorial/transact-거래계약/거래계약-개념): 주제 목차 · 다음: 데이터 맵과 전문
- [데이터 맵과 전문](https://handstack.kr/docs/tutorial/transact-거래계약/데이터맵과-전문): 주제 목차 · 이전 CRUD 거래 연결과 검증
- [CRUD 거래 연결과 검증](https://handstack.kr/docs/tutorial/transact-거래계약/CRUD-거래-연결과-검증): 주제 목차 · 이전: 데이터 맵과 전문
- [08. transact 거래 계약](https://handstack.kr/docs/tutorial/transact-거래계약/): 화면과 SQL을 연결하고 거래 요청·응답과 출력 매핑을 확인합니다.

## 작업별 가이드

- [실행·화면·거래 문제 해결](https://handstack.kr/docs/guides/문제-해결): 서버 접속, 화면 로딩, Board 테이블과 거래 응답 문제를 증상별로 점검합니다.
- [AI 에이전트에 HandStack 문서 연결하기](https://handstack.kr/docs/guides/에이전트에-문서-연결하기): Claude Code, Codex CLI, Cursor 같은 AI 코딩 에이전트가 HandStack 공식 문서를 직접 검색하고 읽도록 문서 MCP 서버(https://handstack.kr/mcp)를 등록합니다.
- [작업별 가이드](https://handstack.kr/docs/guides/): 화면, 거래, 확장, 배포와 문제 해결 문서를 작업별로 찾습니다.

## API·설정 참조

- [화면에서 거래 호출하기](https://handstack.kr/docs/reference/거래-호출): syn.$w.transactionAction의 구문, 기본 옵션, 입출력 연결과 실패 동작을 확인합니다.
- [식별자와 파일 경로](https://handstack.kr/docs/reference/식별자와-파일-경로): HDS, BOD, BOD010, LD01의 의미와 화면·거래·SQL 계약 파일을 대조합니다.
- [모듈 라이선스 관리](https://handstack.kr/docs/reference/api/모듈%20라이선스%20관리): 어셈블리 서명: 라이선스 발급을 위해 어셈블리는 서명이 필요하므로, 프로젝트 파일에 다음과 같이 모듈 명과 동일하게 서명 파일을 만들고 설정을 추가합니다. modulename.snk 서명 파일은 프로젝트 루트에 위치해야 합니다.
- [ack 프로그램](https://handstack.kr/docs/reference/api/ack-프로그램): ack 프로그램은 ASP.NET Core 앱의 In-Process HTTP 서버 구현을 사용하여 실행되는 Kestrel 이라는 이름의 웹 서버 프로그램입니다. ack 프로그램은 다음과 같은 기능을 제공합니다.
- [checkup](https://handstack.kr/docs/reference/api/modules/checkup): checkup은 HandStack 운영 콘솔과 테넌트 앱 관리 기능을 제공하는 모듈입니다. 모듈 설정 초기화, 관리자 키 재설정, 로그인, 테넌트 앱 자산/설정 관리, 운영 기능 실행을 한곳에서 다룹니다.
- [command](https://handstack.kr/docs/reference/api/modules/command): command는 XML 계약을 기준으로 서버 측 CLI 프로세스와 Web URL 호출을 실행하는 모듈입니다. transact 계약에서 CommandType을 C로 지정하면 RoutingCommandUri 규칙에 따라 /command/api/execution으로 라우팅됩니다.
- [dbclient](https://handstack.kr/docs/reference/api/modules/dbclient): dbclient는 XML SQL 계약을 기준으로 관계형 데이터베이스 요청을 실행하는 모듈입니다. SQL Server, Oracle, MySQL/MariaDB, PostgreSQL, SQLite 데이터 원본을 설정할 수 있으며, transact에서는 CommandType=D 거래의 기본…
- [forwarder](https://handstack.kr/docs/reference/api/modules/forwarder): forwarder는 HttpClient 기반 포워드 프록시 모듈입니다. requestKey로 허용된 대상만 호출하며, 서버 사이드 HTTP 요청을 대상 URL로 전달합니다.
- [function](https://handstack.kr/docs/reference/api/modules/function): function은 XML 함수 계약을 기준으로 C#, Node.js, Python 함수를 실행하는 모듈입니다. 업무 로직이 단순 SQL로 끝나지 않거나 외부 라이브러리, 파일, 계산 로직이 필요한 경우 transact에서 CommandType=F로 라우팅해 사용합니다.
- [graphclient](https://handstack.kr/docs/reference/api/modules/graphclient): graphclient는 XML 계약을 기준으로 Neo4j와 Memgraph에 Cypher를 실행하는 그래프 데이터베이스 모듈입니다. API 형태와 계약 refresh 흐름은 dbclient와 비슷하지만, 데이터 원본과 파라미터 바인딩은 그래프 데이터베이스에 맞춰 동작합니다.
- [logger](https://handstack.kr/docs/reference/api/modules/logger): logger는 HandStack 모듈들이 전송한 거래 로그와 이벤트 로그를 저장하고 조회하는 모듈입니다. SQLite를 기본으로 사용할 수 있으며, 설정에 따라 애플리케이션별 로그 저장소와 테이블을 분리합니다.
- [prompter](https://handstack.kr/docs/reference/api/modules/prompter): prompter는 XML 프롬프트 계약을 기준으로 LLM 요청을 실행하는 모듈입니다. OpenAI, Claude, Gemini, Ollama, LM Studio 같은 제공자를 LLMSource로 등록하고, transact에서는 CommandType=P로 라우팅합니다.
- [repository](https://handstack.kr/docs/reference/api/modules/repository): repository는 파일 업로드, 다운로드, 삭제, 파일 메타데이터 관리를 담당하는 모듈입니다. 저장소 정의는 JSON 계약으로 관리하고, 메타데이터 저장/조회는 dbclient 계약과 연계합니다.
- [transact](https://handstack.kr/docs/reference/api/modules/transact): transact는 클라이언트의 업무 거래 요청을 수신하고, 거래 계약의 CommandType에 따라 실행 모듈로 라우팅한 뒤 표준 응답을 반환하는 중심 모듈입니다. HandStack에서 화면, API, 배치, workflow가 공통 거래 모델로 만나는 지점입니다.
- [wwwroot](https://handstack.kr/docs/reference/api/modules/wwwroot): wwwroot는 HandStack 화면과 정적 리소스를 제공하는 모듈입니다. 계약 기반 화면 리소스는 ContractRequestPath 아래에 노출하고, 실제 정적 자산은 WWWRootBasePath에서 서비스하며, 공통 파일 카탈로그에 등록한 호스트 파일도 지정 URL로 제공합니다.
- [syn.config.json 환경설정](https://handstack.kr/docs/reference/api/syn.config.json-환경설정): syn.loader.js 에 의해 조회되는 웹 서버의 루트 디렉토리의 syn.config.json 파일은 HandStack 화면을 구성하는데 필요한 설정을 담고 있으며, 이를 통해 화면의 동작과 기능을 설정됩니다.
- [syn.controls.js 라이브러리](https://handstack.kr/docs/reference/api/syn.controls.js-라이브러리): 일관된 기능과 디자인을 표현하는 비즈니스 앱 화면을 개발하기 위해 다양한 오픈소스를 활용하여 필요한 기능을 구현하고 고도화된 라이브러리를 syn.controls.js UI 컨트롤 단위로 제공합니다.
- [계약 중심 거래](https://handstack.kr/docs/reference/concept/계약-중심-거래): 실습으로 익히려면 학습 트랙의 08. transact 거래 계약을 참고하세요.
- [데이터 게더링(Gatering)과 바인딩(Binding)](https://handstack.kr/docs/reference/concept/데이터-게더링과-바인딩): 실습으로 익히려면 학습 트랙의 05. 화면 저작, 08. transact 거래 계약을 참고하세요.
- [데이터베이스 연동](https://handstack.kr/docs/reference/concept/데이터베이스-연동): 실습으로 익히려면 학습 트랙의 04. 도메인 모델과 데이터베이스, 07. dbclient SQL 계약을 참고하세요.
- [모듈러 모놀리식 아키텍처](https://handstack.kr/docs/reference/concept/모듈러-모놀리식-아키텍처): 실습으로 익히려면 학습 트랙의 01. HandStack 기초 개념을 참고하세요.
- [서버리스 Function](https://handstack.kr/docs/reference/concept/서버리스-Function): 실습으로 익히려면 학습 트랙의 09. 확장 모듈을 참고하세요.
- [프로그램 다운타임 최소화 아이디어](https://handstack.kr/docs/reference/concept/프로그램-다운타임-최소화-아이디어): 실습으로 익히려면 학습 트랙의 12. 모니터링과 운영 인수인계를 참고하세요.
- [HandStack 도메인 주도 로우코드 거버넌스](https://handstack.kr/docs/reference/concept/domain-driven-low-code-governance): 현업이 직접 만들고 IT가 안전하게 운영하는 정보화 시스템을 위한 기준입니다.
- [In-process / Out-process 메시징](https://handstack.kr/docs/reference/concept/In-process-Out-process-메시징): 실습으로 익히려면 학습 트랙의 09. 확장 모듈을 참고하세요.
- [개념 이해](https://handstack.kr/docs/reference/concept/): HandStack의 요청 흐름, 계약과 모듈, 설계 배경을 필요한 순서로 이해합니다.
- [API·설정 참조](https://handstack.kr/docs/reference/): HandStack의 API, 계약, 식별자, 설정과 UI 컨트롤을 작업 또는 정확한 이름으로 찾습니다.

## IDE 사용하기

- [도메인 모델과 SDLC 문서](https://handstack.kr/docs/ide/guides/도메인-모델링): 엔티티·앱 데이터베이스·SDLC 문서를 구분하고 필요한 설계만 작성·연결·백업합니다.
- [Tabler 웹 페이지 제작](https://handstack.kr/docs/ide/guides/tabler-studio): HandStack 런타임 연결 전 HTML 시안을 만들고 프로젝트 저장과 HTML 내보내기를 구분합니다.
- [IDE 사용하기](https://handstack.kr/docs/ide/): HandStack IDE에서 파일을 열고 화면과 계약을 검증한 뒤 운영 담당자에게 전달하는 학습 경로입니다.
- [4. 계약 실행하기](https://handstack.kr/docs/ide/learn/계약-실행하기): SQL 계약, 거래 계약, 화면에서 같은 입력을 실행하고 결과와 오류를 비교합니다.
- [5. 메뉴와 검증](https://handstack.kr/docs/ide/learn/메뉴와-검증): 업무 셸 메뉴에 화면을 연결하고 정상·빈 결과·실패 요청의 증거를 남깁니다.
- [6. 운영 인수인계](https://handstack.kr/docs/ide/learn/운영-인수인계): 파일·모델·로컬 설정을 구분해 백업하고 실행·관측·복구 정보를 전달합니다.
- [1. 작업 영역 열기](https://handstack.kr/docs/ide/learn/작업영역-열기): 작업 영역과 개발 탭의 차이를 익히고 파일 하나를 저장한 뒤 디스크 반영을 확인합니다.
- [2. 프로젝트와 서버](https://handstack.kr/docs/ide/learn/프로젝트와-서버): 프로젝트명과 업무 코드를 구분하고 새 프로젝트 생성과 개발 서버 연동의 완료 조건을 확인합니다.
- [3. 화면 편집하기](https://handstack.kr/docs/ide/learn/화면-편집하기): 생성된 화면의 문구 하나를 바꾸며 View Designer와 HTML·JavaScript 저장 관계를 익힙니다.
- [단축키와 편집 문맥](https://handstack.kr/docs/ide/reference/단축키): 소스 편집, 화면 디자이너, 디버그의 기본 키와 포커스에 따른 동작을 구분합니다.
- [메뉴와 도구](https://handstack.kr/docs/ide/reference/메뉴와-도구): 작업 목적에서 IDE의 메뉴·패널·전용 편집기 위치를 찾습니다.
- [IDE 문제 해결](https://handstack.kr/docs/ide/reference/문제-해결): 파일·미리보기·거래·디버그 문제를 최초 실패 지점부터 좁히고 복구 후 같은 조건으로 재검증합니다.
- [설정과 보안](https://handstack.kr/docs/ide/reference/설정과-보안): IDE·개발 서버·환경 프리셋의 적용 위치와 개발자 모드의 보안 영향을 구분합니다.
- [파일과 저장 규칙](https://handstack.kr/docs/ide/reference/파일과-저장-규칙): IDE 계약 확장자, 모듈 경로, 화면 메타데이터, 메뉴 연결과 백업 범위를 한곳에서 찾습니다.
- [IDE 빠른 참조](https://handstack.kr/docs/ide/reference/): 메뉴 이름, 파일 확장자, pageMappings, 저장 위치와 오류 증상으로 IDE 고유 기능을 찾습니다.

## 배포·운영 원칙 (12-Factors)

- [개요](https://handstack.kr/docs/twelvefactor/코드베이스/개요): 코드베이스 원칙은 하나의 애플리케이션이 하나의 버전 관리 기준을 가져야 한다는 뜻입니다. 배포 대상이 개발 서버, 검증 서버, 운영 서버처럼 여러 개일 수는 있지만, 어떤 소스가 어떤 산출물로 배포되었는지는 항상 추적 가능해야 합니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/코드베이스/코드베이스-관리): 처음 확인할 위치
- [개요](https://handstack.kr/docs/twelvefactor/실행환경/개요): 개발/운영 환경 일치 원칙은 개발, 검증, 운영 환경의 차이를 가능한 한 줄이라는 뜻입니다. 환경 차이가 클수록 "개발 PC에서는 되는데 운영에서는 안 되는" 문제가 많아집니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/실행환경/실행환경-표준화): 환경별 기준표 만들기
- [개요](https://handstack.kr/docs/twelvefactor/로그/개요): 로그 원칙은 애플리케이션이 로그를 이벤트 스트림으로 다루고, 운영 환경에서 수집과 분석이 가능하게 하라는 뜻입니다. 로그는 장애가 난 뒤 보는 파일이 아니라, 시스템이 지금 무엇을 하고 있는지 알려주는 운영 데이터입니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/로그/로그-분석-흐름): 장애 분석 순서
- [12-Factors 란](https://handstack.kr/docs/twelvefactor/Factors-란): 최근 소프트웨어는 개발자 PC, 사내 서버, 클라우드, 컨테이너 환경을 오가며 실행됩니다. 12-Factor는 이런 환경 차이에도 애플리케이션을 예측 가능하게 빌드하고 배포하고 운영하기 위한 12가지 원칙입니다.
- [개요](https://handstack.kr/docs/twelvefactor/관리작업/개요): 관리작업 원칙은 데이터 보정, 계약 복사, 캐시 정리, 인증서 생성, 배포 후 확인 같은 일회성 작업을 애플리케이션 코드와 같은 기준으로 관리하라는 뜻입니다. 운영자가 서버에서 즉흥적으로 실행한 명령은 재현하기 어렵고, 실패했을 때 추적하기도 어렵습니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/관리작업/관리작업-스크립트-운영): 루트 스크립트
- [Docker 컨테이너에서 ack 프로세스에 연결 디버깅하기](https://handstack.kr/docs/twelvefactor/관리작업/Docker-컨테이너에서-ack-연결-디버깅): ack 프로그램은 docker를 이용하여 실행될 수 있습니다. 이 경우에는 docker 내부에서 디버깅을 해야합니다. docker에서 실행하기 위한 Dockerfile은 다음과 같습니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/종속성/개발환경-종속성-관리): 개발 PC 필수 확인
- [개요](https://handstack.kr/docs/twelvefactor/종속성/개요): 종속성 원칙은 애플리케이션이 필요로 하는 라이브러리, 런타임, 도구를 암묵적으로 기대하지 말고 명시적으로 관리해야 한다는 뜻입니다. 서버에 우연히 설치되어 있는 DLL, Node 패키지, CLI 도구에 기대면 신규 개발자 PC와 운영 서버에서 서로 다른 결과가 나옵니다.
- [개요](https://handstack.kr/docs/twelvefactor/설정/개요): 설정 원칙은 코드와 설정을 분리하는 것입니다. 같은 코드가 개발, 검증, 운영 환경에서 실행되더라도 연결 문자열, 포트, 파일 경로, 인증 키, 외부 서비스 주소는 환경에 따라 달라질 수 있습니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/설정/설정-분리와-환경변수): 환경 변수 설정
- [개요](https://handstack.kr/docs/twelvefactor/백엔드서비스/개요): 백엔드 서비스 원칙은 데이터베이스, 파일 저장소, 메시징, 메일, 외부 API 같은 리소스를 애플리케이션에 붙였다 떼는 자원으로 취급하라는 뜻입니다. 코드가 특정 서버나 특정 외부 서비스에 강하게 묶이면 환경 전환과 장애 대응이 어려워집니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/백엔드서비스/백엔드서비스-연동): 연결 정보 관리
- [개요](https://handstack.kr/docs/twelvefactor/빌드-릴리즈-실행/개요): 빌드, 릴리즈, 실행 원칙은 세 단계를 분리하라는 뜻입니다. 빌드는 소스를 실행 가능한 산출물로 만들고, 릴리즈는 산출물과 환경 설정을 결합하며, 실행은 특정 환경에서 프로세스를 시작합니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/빌드-릴리즈-실행/빌드-릴리즈-실행-절차): 로컬 빌드
- [Jenkins에서 원격 시스템의 명령을 비밀번호 없이 수행하는 설정](https://handstack.kr/docs/twelvefactor/빌드-릴리즈-실행/Jenkins에서-원격-시스템의-명령을-비밀번호-없이-수행하는-설정): Jenkins 에서 대상 서버에 파일을 전달 하기 위해 CLI 명령어 (예: Ubuntu의 rsync)를 이용하여 Jenkins에서 원격 시스템의 명령을 비밀번호 없이 수행하려면 Jenkins 계정에 대해 SSH 키 기반 인증을 설정하고 필요한 권한을 부여해야 합니다. 다음 단계를 따…
- [Windows 서버 호스팅](https://handstack.kr/docs/twelvefactor/빌드-릴리즈-실행/Windows-서버-호스팅): IIS (인터넷 정보 서비스) 관리자 설치하기
- [개요](https://handstack.kr/docs/twelvefactor/프로세스/개요): 프로세스 원칙은 애플리케이션을 하나 이상의 독립 실행 프로세스로 실행하고, 프로세스 내부 상태에 장기 데이터를 의존하지 말라는 뜻입니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/프로세스/프로세스-실행-관리): 실행 방식 선택
- [개요](https://handstack.kr/docs/twelvefactor/포트-바인딩/개요): 포트 바인딩 원칙은 애플리케이션이 외부 요청을 받을 수 있도록 스스로 네트워크 포트를 열고, 그 포트를 통해 서비스를 제공해야 한다는 뜻입니다. 실제 운영에서는 이 포트 앞에 IIS, Nginx, 로드밸런서, 리버스 프록시가 놓일 수 있습니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/포트-바인딩/포트-바인딩과-프록시): 로컬 포트 확인
- [개요](https://handstack.kr/docs/twelvefactor/동시성/개요): 동시성 원칙은 하나의 애플리케이션을 여러 작업 단위로 나누고, 필요한 만큼 프로세스나 작업자를 늘려 처리량을 확장하라는 뜻입니다. 모든 일을 하나의 긴 실행 흐름에 묶으면 장애와 병목을 분리하기 어렵습니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/동시성/동시성-작업-분리): 작업 유형 분류
- [개요](https://handstack.kr/docs/twelvefactor/폐기가능성/개요): 폐기가능성 원칙은 프로세스를 빠르게 시작하고, 안전하게 종료하고, 언제든 교체할 수 있게 만들라는 뜻입니다. 서버나 프로세스가 영원히 살아 있다고 가정하면 배포, 장애 복구, 확장이 모두 어려워집니다.
- [실무 가이드](https://handstack.kr/docs/twelvefactor/폐기가능성/재시작과-복구-전략): 배포 중 파일 잠김 줄이기

## 기타

- [HandStack 라이선스 버전 1.0 (2024년 04월)](https://handstack.kr/docs/라이선스): 저작권 (c) 2024, HandStack 모든 권리 보유.
- [기여하기](https://handstack.kr/docs/information/community/기여하기): 기여를 감사하고 환영합니다
- [프로젝트 정보 관리](https://handstack.kr/docs/information/community/프로젝트-정보-관리): HandStack 대화 주제
- [Forbes 소개](https://handstack.kr/docs/information/forbes/Forbes-모듈이란): HandStack Forbes는 HandStack의 확장 기능으로서, 오픈소스 커뮤니티나 아웃소싱과 같은 방법으로 외부의 소스를 효율적으로 통합 처리할 수 있도록 가이드 라인을 제공합니다.
- [5kb 미만 Javascript 오픈소스 목록](https://handstack.kr/docs/information/resource/5kb-미만-Javascript-오픈소스-목록): MicroJS 웹 사이트는 작고 강력한 마이크로 프레임워크와 마이크로 라이브러리를 발견하고 선택할 수 있도록 도와줍니다. 이 사이트는 종속성이 없고, 압축된 상태에서 5KB 이하인 라이브러리만을 다룹니다.
- [기술문서 Tech Docs](https://handstack.kr/docs/information/resource/기술문서): 언어 학습
- [디자인 시스템 참고자료](https://handstack.kr/docs/information/resource/디자인-시스템-참고자료): 디자인 시스템이란?
- [AI로 게시판 설계 검토하기](https://handstack.kr/docs/information/resource/AI로-게시판-설계-검토하기): 게시판 테이블과 SQL을 생성형 AI로 검토한 선택 학습 자료입니다.
- [Claude CLI 기술 레퍼런스](https://handstack.kr/docs/information/resource/Claude%20CLI%20기술%20레퍼런스): 여기에서 슬라이드를 직접 확인하세요.
- [Codex CLI 기술 레퍼런스](https://handstack.kr/docs/information/resource/Codex%20CLI%20기술%20레퍼런스): 여기에서 슬라이드를 직접 확인하세요.
- [HandStack 프로젝트 전용 DESIGN.md 템플릿](https://handstack.kr/docs/information/resource/HandStack-프로젝트-전용-DESIGN.md-템플릿): | 항목 | 내용 |
- [HandStack 화면 HTML 작성 지침](https://handstack.kr/docs/information/resource/HandStack-화면-HTML-작성-지침): 이 문서는 HandStack 화면 개발 시 준수해야 할 한국어 응답 규칙 및 Tabler CSS Framework 기반의 HTML 작성 지침을 명시합니다.
- [HandStack 화면 JavaScript 작성 지침](https://handstack.kr/docs/information/resource/HandStack-화면-JavaScript-작성-지침): 이 문서는 HandStack 화면 개발 시 준수해야 할 한국어 응답 규칙 및 syn.js, syn.uicontrols.js 기반의 JavaScript 작성 지침을 명시합니다.
- [Libman으로 오픈소스 관리하기](https://handstack.kr/docs/information/resource/Libman으로-오픈소스-관리하기): 조준철
- [LLM 성능을 끌어올리는 프롬프트 엔지니어링](https://handstack.kr/docs/information/resource/LLM-성능을-끌어올리는-프롬프트-엔지니어링): 생성형 AI, 특히 거대 언어 모델(LLM)은 이제 단순한 기술 트렌드를 넘어 우리 업무의 패러다임을 바꾸고 있습니다. 하지만 누구나 같은 LLM을 사용하는데, 왜 결과물의 퀄리티는 천차만별일까요? 그 해답은 바로 프롬프트 엔지니어링(Prompt Engineering)에 있습니다.
- [Ubuntu 22.04+ 추천 개발 도구 설치하기](https://handstack.kr/docs/information/resource/Ubuntu-22.04-추천-개발-도구-설치하기): 소프트웨어 개발자와 운영자를 위한 좋은 도구는 생산성을 10배 이상 높일 수 있습니다. 이 글에서는 Ubuntu 22.04+ 에서 개발자와 운영자를 위한 추천 도구를 설치하는 방법을 소개합니다.
- [PowerShell 명령어 가이드](https://handstack.kr/docs/information/resource/Windows-macOS-Ubuntu-공통-쉘-명령어-가이드): Microsoft 의 PowerShell 은 Windows, macOS, Linux를 모두 지원하며 .NET 기반의 강력한 성능을 갖춘 오픈 소스 차세대 크로스 플랫폼 자동화 및 구성 프레임워크입니다.
- [Winget 추천 개발 도구 설치하기](https://handstack.kr/docs/information/resource/Winget-추천-개발-도구-설치하기): 소프트웨어 개발자와 운영자를 위한 좋은 도구는 생산성을 10배 이상 높일 수 있습니다. 이 글에서는 Windows에서 Winget을 사용하여 개발자와 운영자를 위한 추천 도구를 설치하는 방법을 소개합니다. Windows 11+ 에서는 기본으로 적용되어 있습니다.
- [빠른 시작](https://handstack.kr/docs/MD-템플릿): 전달 하고자 하는 요약 내용을 정리합니다

## AI 에이전트 연동

- [AI 에이전트에 HandStack 문서 연결하기](https://handstack.kr/docs/guides/에이전트에-문서-연결하기): 문서를 검색·조회하는 원격 MCP 서버(https://handstack.kr/mcp) 등록 방법
- [AGENTS.md](https://handstack.kr/docs/reference/vide-coding-instruction/examples/AGENTS): HandStack 프로젝트용 AGENTS.md 템플릿

## 전체 본문

- [전체 문서](https://handstack.kr/llms-full.txt): 388개 문서의 마크다운 본문
- [시작하기](https://handstack.kr/llms-startup.txt): 189개 문서의 마크다운 본문
- [따라 만들기](https://handstack.kr/llms-tutorial.txt): 51개 문서의 마크다운 본문
- [작업별 가이드](https://handstack.kr/llms-guides.txt): 3개 문서의 마크다운 본문
- [API·설정 참조](https://handstack.kr/llms-reference.txt): 83개 문서의 마크다운 본문
- [IDE 사용하기](https://handstack.kr/llms-ide.txt): 15개 문서의 마크다운 본문
- [배포·운영 원칙 (12-Factors)](https://handstack.kr/llms-twelvefactor.txt): 28개 문서의 마크다운 본문
- [기타](https://handstack.kr/llms-etc.txt): 19개 문서의 마크다운 본문

## Optional

- [시스템 관리 담당자를 위한 학습](https://handstack.kr/docs/reference/presentation/시스템-관리-및-운영-담당자-학습): 시스템 관리 (SM) 및 운영 담당자가 안정적으로 시스템을 유지 보수 및 운영 할 수 있도록 레퍼런스와 가이드를 제공합니다.
- [화면/기능 개발자를 위한 학습](https://handstack.kr/docs/reference/presentation/화면-기능-개발자-학습): 화면/기능 개발자들이 빠르게 개발할 수 있도록 실제 프로젝트를 진행하면서 필요한 다양한 기술과 도구들을 소개합니다.
- [HandStack 도메인 주도 로우코드 거버넌스](https://handstack.kr/docs/reference/presentation/domain-driven-low-code-governance): 도메인 담당자가 HandStack으로 필요한 정보화 시스템을 직접 구현하고, 중앙 IT 조직은 표준·보안·품질·운영 경계를 제공하는 방법을 소개합니다.
- [HandStack 개발자를 위한 학습](https://handstack.kr/docs/reference/presentation/HandStack-개발자-학습): HandStack 개발자들이 빠르게 개발할 수 있도록 HandStack의 기본 개념부터 시작하여, 실제 프로젝트를 진행하면서 필요한 다양한 기술과 도구들을 소개합니다.
- [architect](https://handstack.kr/docs/reference/vide-coding-instruction/agents/architect): 시스템 설계, 확장성 및 기술적 의사결정을 위한 소프트웨어 아키텍처 전문가입니다. 새로운 기능 계획, 대규모 시스템 리팩토링 또는 아키텍처 의사결정 시 적극적으로(PROACTIVELY) 사용하세요.
- [build-error-resolver](https://handstack.kr/docs/reference/vide-coding-instruction/agents/build-error-resolver): 빌드 및 TypeScript 에러 해결 전문가입니다. 빌드 실패나 타입 에러 발생 시 적극적으로(PROACTIVELY) 사용하세요. 아키텍처 편집 없이 최소한의 변경으로 빌드/타입 에러만 수정합니다. 빌드를 빠르게 정상화하는 데 집중합니다.
- [code-expert](https://handstack.kr/docs/reference/vide-coding-instruction/agents/code-expert): 코딩, 리팩토링, 테스트, 디버깅을 전문으로 하는 숙련된 개발자입니다. 고품질의 코드 구현과 기술적 문제 해결을 담당합니다.
- [code-reviewer](https://handstack.kr/docs/reference/vide-coding-instruction/agents/code-reviewer): 전문 코드 리뷰 전문가입니다. 품질, 보안 및 유지보수성을 위해 적극적으로 코드를 리뷰합니다. 코드 작성 또는 수정 직후 즉시 사용하세요. 모든 코드 변경에 대해 반드시 사용해야 합니다.
- [doc-updater](https://handstack.kr/docs/reference/vide-coding-instruction/agents/doc-updater): 문서 및 코드맵 전문가입니다. 코드맵과 문서를 업데이트할 때 적극적으로(PROACTIVELY) 사용하세요. /update-codemaps 및 /update-docs를 실행하고, docs/CODEMAPS/*를 생성하며, README와 가이드를 업데이트합니다.
- [e2e-runner](https://handstack.kr/docs/reference/vide-coding-instruction/agents/e2e-runner): Playwright를 사용하는 E2E 테스트 전문가입니다. E2E 테스트 생성, 유지 관리 및 실행에 적극적으로(PROACTIVELY) 사용하세요. 테스트 여정 관리, 불안정한(Flaky) 테스트 격리, 아티팩트(스크린샷, 비디오, 트레이스) 업로드, 핵심 사용자 흐름 정상 작동 보장…
- [handstack-developer](https://handstack.kr/docs/reference/vide-coding-instruction/agents/handstack-developer): Handstack 프레임워크 전문 개발자입니다. View(JS/HTML)와 Contract(XML) 파일을 생성하고 수정하는 데 특화되어 있습니다. 새로운 화면 개발이나 쿼리 수정 시 사용하세요.
- [orchestrator](https://handstack.kr/docs/reference/vide-coding-instruction/agents/orchestrator): 프로젝트 관리 및 팀 조율을 담당하는 오케스트레이터입니다. 작업의 조율, 결과 확인, 업무 분배, 진행 상황 관리를 수행합니다.
- [planner](https://handstack.kr/docs/reference/vide-coding-instruction/agents/planner): 복잡한 기능 및 리팩토링을 위한 전문 계획 전문가입니다. 사용자가 기능 구현, 아키텍처 변경 또는 복잡한 리팩토링을 요청할 때 적극적으로(PROACTIVELY) 사용하세요. 계획 작업을 위해 자동으로 활성화됩니다.
- [refactor-cleaner](https://handstack.kr/docs/reference/vide-coding-instruction/agents/refactor-cleaner): 죽은 코드(Dead code) 정리 및 통합 전문가입니다. 사용되지 않는 코드, 중복 및 리팩토링을 위해 적극적으로(PROACTIVELY) 사용하세요. 분석 도구(knip, depcheck, ts-prune)를 실행하여 죽은 코드를 식별하고 안전하게 제거합니다.
- [security-reviewer](https://handstack.kr/docs/reference/vide-coding-instruction/agents/security-reviewer): 보안 취약점 탐지 및 해결 전문가입니다. 사용자 입력, 인증, API 엔드포인트 또는 민감한 데이터를 처리하는 코드를 작성한 후 적극적으로(PROACTIVELY) 사용하세요. 비밀 정보(secrets), SSRF, 인젝션, 안전하지 않은 암호화 및 OWASP Top 10 취약점을 찾아…
- [tdd-guide](https://handstack.kr/docs/reference/vide-coding-instruction/agents/tdd-guide): 테스트 주도 개발(TDD) 전문가로, 테스트 우선(write-tests-first) 방법론을 강제합니다. 새로운 기능 작성, 버그 수정 또는 리팩토링 시 적극적으로(PROACTIVELY) 사용하세요. 80% 이상의 테스트 커버리지를 보장합니다.
- [ui-designer](https://handstack.kr/docs/reference/vide-coding-instruction/agents/ui-designer): 사용자 인터페이스(UI) 구현을 담당하는 디자이너/퍼블리셔입니다. HTML, CSS, JS, 폼, 유틸리티 등을 다룹니다.
- [ux-designer](https://handstack.kr/docs/reference/vide-coding-instruction/agents/ux-designer): 사용자 경험(UX) 설계를 담당하는 디자이너입니다. 디자인 시스템, 기본 구조(Base), 레이아웃, 컴포넌트 설계를 수행합니다.
- [build-fix](https://handstack.kr/docs/reference/vide-coding-instruction/commands/build-fix): 빌드 및 수정 (Build and Fix)
- [code-review](https://handstack.kr/docs/reference/vide-coding-instruction/commands/code-review): 코드 리뷰 (Code Review)
- [e2e](https://handstack.kr/docs/reference/vide-coding-instruction/commands/e2e): Playwright를 사용하여 E2E 테스트를 생성하고 실행합니다. 테스트 여정을 생성하고, 테스트를 실행하며, 스크린샷/비디오/트레이스를 캡처하고 아티팩트를 업로드합니다.
- [handstack-scaffold](https://handstack.kr/docs/reference/vide-coding-instruction/commands/handstack-scaffold): 새로운 Handstack 모듈(화면 및 기능) 코드를 스캐폴딩합니다. ID(CDM999)를 입력받아 JS, HTML, XML 파일을 생성합니다.
- [plan](https://handstack.kr/docs/reference/vide-coding-instruction/commands/plan): 요구사항을 재정의하고 리스크를 평가하며 단계별 구현 계획을 수립합니다. 코드를 건드리기 전에 사용자의 확인을 기다리세요(WAIT).
- [refactor-clean](https://handstack.kr/docs/reference/vide-coding-instruction/commands/refactor-clean): 리팩터 클린 (Refactor Clean)
- [tdd](https://handstack.kr/docs/reference/vide-coding-instruction/commands/tdd): 테스트 주도 개발(TDD) 워크플로우를 강제합니다. 인터페이스를 스캐폴딩하고, 테스트를 '먼저' 생성한 다음, 통과하기 위한 최소한의 코드를 구현합니다. 80% 이상의 커버리지를 보장합니다.
- [test-coverage](https://handstack.kr/docs/reference/vide-coding-instruction/commands/test-coverage): 테스트 커버리지 (Test Coverage)
- [update-codemaps](https://handstack.kr/docs/reference/vide-coding-instruction/commands/update-codemaps): 코드맵 업데이트 (Update Codemaps)
- [update-docs](https://handstack.kr/docs/reference/vide-coding-instruction/commands/update-docs): 문서 업데이트 (Update Documentation)
- [AGENTS.md](https://handstack.kr/docs/reference/vide-coding-instruction/examples/AGENTS): HandStack 프로젝트에서 AI 코딩 에이전트가 지켜야 할 식별자·계약·화면·보안 규칙을 담은 AGENTS.md 템플릿과 하위 폴더용 예시입니다.
- [CLAUDE.md](https://handstack.kr/docs/reference/vide-coding-instruction/examples/CLAUDE): HandStack 프로젝트에서 Claude Code가 문서 조회, 작업 순서, 검증, 보안을 지키도록 하는 CLAUDE.md 템플릿입니다.
- [HANDSTACK.md](https://handstack.kr/docs/reference/vide-coding-instruction/examples/HANDSTACK): Handstack 프레임워크의 표준 코드 예시입니다.
- [user-CLAUDE.md](https://handstack.kr/docs/reference/vide-coding-instruction/examples/user-CLAUDE): 이것은 사용자 레벨의 CLAUDE.md 파일 예시입니다. ~/.claude/CLAUDE.md에 배치하세요.
- [handstack-dev-hooks](https://handstack.kr/docs/reference/vide-coding-instruction/hooks/handstack-dev-hooks): Handstack 개발 훅 (Hooks for Handstack Dev)
- [handstack-integration](https://handstack.kr/docs/reference/vide-coding-instruction/mcp-configs/handstack-integration): Handstack MCP 통합 가이드
- [claude-code-plugins](https://handstack.kr/docs/reference/vide-coding-instruction/plugins/claude-code-plugins): 플러그인 및 마켓플레이스
- [handstack-plugins](https://handstack.kr/docs/reference/vide-coding-instruction/plugins/handstack-plugins): Handstack 개발용 플러그인 가이드
- [읽어보기](https://handstack.kr/docs/reference/vide-coding-instruction/): 바이브 코딩을 위해 레퍼런스를 위한 프로덕션 수준의 에이전트, 스킬, 훅(Hooks), 명령어, 규칙 및 MCP 설정을 포함하고 있습니다. 이 설정들은 실제 제품을 만들며 사용하면서 지속적으로 개선 및 발전 합니다.
- [agents](https://handstack.kr/docs/reference/vide-coding-instruction/rules/agents): 에이전트 오케스트레이션
- [coding-style](https://handstack.kr/docs/reference/vide-coding-instruction/rules/coding-style): 코딩 스타일
- [git-workflow](https://handstack.kr/docs/reference/vide-coding-instruction/rules/git-workflow): Git 워크플로우
- [handstack-rules](https://handstack.kr/docs/reference/vide-coding-instruction/rules/handstack-rules): Handstack 개발 규칙
- [hooks](https://handstack.kr/docs/reference/vide-coding-instruction/rules/hooks): 훅(Hooks) 시스템
- [patterns](https://handstack.kr/docs/reference/vide-coding-instruction/rules/patterns): 일반적인 패턴
- [performance](https://handstack.kr/docs/reference/vide-coding-instruction/rules/performance): 성능 최적화
- [roles](https://handstack.kr/docs/reference/vide-coding-instruction/rules/roles): 역할별 가이드라인 (Role Guidelines)
- [security](https://handstack.kr/docs/reference/vide-coding-instruction/rules/security): 보안 가이드라인
- [testing](https://handstack.kr/docs/reference/vide-coding-instruction/rules/testing): 테스트 요구사항
- [backend-patterns](https://handstack.kr/docs/reference/vide-coding-instruction/skills/backend-patterns): Node.js, Express, Next.js API 라우트를 위한 백엔드 아키텍처 패턴, API 설계, 데이터베이스 최적화 및 서버 사이드 모범 사례입니다.
- [clickhouse-io](https://handstack.kr/docs/reference/vide-coding-instruction/skills/clickhouse-io): 고성능 분석 워크로드를 위한 ClickHouse 데이터베이스 패턴, 쿼리 최적화, 분석 및 데이터 엔지니어링 모범 사례입니다.
- [coding-standards](https://handstack.kr/docs/reference/vide-coding-instruction/skills/coding-standards): TypeScript, JavaScript, React, Node.js 개발을 위한 범용 코딩 표준, 모범 사례 및 패턴입니다.
- [frontend-patterns](https://handstack.kr/docs/reference/vide-coding-instruction/skills/frontend-patterns): React, Next.js, 상태 관리, 성능 최적화 및 UI 모범 사례를 위한 프론트엔드 개발 패턴입니다.
- [handstack-patterns](https://handstack.kr/docs/reference/vide-coding-instruction/skills/handstack-patterns): Handstack 아키텍처 및 개발 패턴
- [project-guidelines-example](https://handstack.kr/docs/reference/vide-coding-instruction/skills/project-guidelines-example): 프로젝트 가이드라인 스킬 (예시)
- [보안 리뷰](https://handstack.kr/docs/reference/vide-coding-instruction/skills/security-review/SKILL): 인증 추가, 사용자 입력 처리, 비밀 정보 작업, API 엔드포인트 생성, 또는 결제/민감한 기능 구현 시 이 스킬을 사용하세요. 포괄적인 보안 체크리스트와 패턴을 제공합니다.
- [system-architecture-example](https://handstack.kr/docs/reference/vide-coding-instruction/skills/system-architecture-example): 견고하고 확장 가능한 시스템 아키텍처를 담고 있습니다. 이 구조를 기반으로 한 시스템 설계 설명서를 정리 합니다.
- [테스트 주도 개발 워크플로우](https://handstack.kr/docs/reference/vide-coding-instruction/skills/tdd-workflow/SKILL): 새로운 기능 작성, 버그 수정 또는 코드 리팩토링 시 이 스킬을 사용하세요. 유닛, 통합, E2E 테스트를 포함한 80% 이상의 커버리지를 가진 테스트 주도 개발을 강제합니다.