Akan.js
Docs
문서컨벤션레퍼런스Cheatsheet
Akan.js
문서컨벤션레퍼런스Cheatsheet
Akan.js

MIT 라이선스 하에 배포되었습니다.

  • Akan.js 공식 컨설팅 서비스AkansoftCopyright © 2026 Akan.js 모든 권리 보유.시스템 관리자bassman
    사람함께에이전트▾
    사람 — 직접 정하고 책임지는 비즈니스 규칙과 흐름. 직접 읽어보세요.
    함께 — 개념은 알아두고, 세부 규칙은 에이전트가 따릅니다.
    에이전트 — 에이전트가 따르는 규칙과 레퍼런스. 필요할 때 찾아보세요.
    CLI 레퍼런스▾
    명령어WorkspaceApplicationLibraryModuleScalarPackagePagePrimitiveWorkflowQualityContextAgentGuideline
    AkanJS 레퍼런스▾
    akanjs/baseakanjs/commonakanjs/constantakanjs/fetchakanjs/signalakanjs/serverakanjs/clientakanjs/webkit
    UI 레퍼런스▾
    OverviewCoreDisplayFormsOverlaysSystemAgent커스터마이즈
    사람함께에이전트▾
    사람 — 직접 정하고 책임지는 비즈니스 규칙과 흐름. 직접 읽어보세요.
    함께 — 개념은 알아두고, 세부 규칙은 에이전트가 따릅니다.
    에이전트 — 에이전트가 따르는 규칙과 레퍼런스. 필요할 때 찾아보세요.
    CLI 레퍼런스▾
    명령어WorkspaceApplicationLibraryModuleScalarPackagePagePrimitiveWorkflowQualityContextAgentGuideline
    AkanJS 레퍼런스▾
    akanjs/baseakanjs/commonakanjs/constantakanjs/fetchakanjs/signalakanjs/serverakanjs/clientakanjs/webkit
    UI 레퍼런스▾
    OverviewCoreDisplayFormsOverlaysSystemAgent커스터마이즈
    이전Workflow다음Context

    코드 품질 CLI

    lint는 틀린 줄을 알려 줍니다. akan quality는 코드베이스의 모양이 흐트러지고 있다는 것을 알려 줍니다. 문법 오류가 아니라서, 누군가 측정하기 전에는 드러나지 않는 문제들입니다.
    이런 것을 찾습니다
    너무 길어진 파일
    500줄을 넘은 서비스, 800줄을 넘은 Template·Zone, 1,000줄을 넘은 Util입니다.
    akan.file.recommended-max-lines
    엉뚱한 파일에 놓인 헬퍼
    order.service.ts에서 OrderService 옆에 선언한 헬퍼 함수입니다.
    akan.convention.service
    서버 View가 없는 모듈
    UI를 Template, Zone, Util로만 그려서, 그 UI 전부가 JavaScript로 브라우저에 실려 갑니다.
    akan.ssr.module-missing-server-view
    번들로 넘어간 마크업
    클라이언트 컴포넌트가 핸들러 한두 개 때문에 큰 정적 하위 트리까지 통째로 감쌉니다.
    akan.ssr.client-static-markup
    리뷰 전, 리팩터링 후, 그리고 .tsx 파일을 고칠 때마다 실행하세요. 렌더 비율은 UI 변경이 소리 없이 깎아 먹을 수 있는 유일한 숫자입니다.
    이 페이지에서 쓰는 말
    용어설명
    규칙 (rule)
    akan.<scope>.<name> 이름을 가진 검사 하나이며, 경고마다 그 경고를 낸 규칙이 적힙니다.
    scope
    규칙이 속한 묶음으로 여섯 가지가 있으며, 출력은 scope 이름순으로 정렬됩니다.
    서버 렌더 비율
    ui/와 lib/의 JSX 엘리먼트 가운데 서버에서 렌더링되는 비율입니다.

    quality

    모든 앱과 라이브러리에서 코드 품질 경고를 찾거나, 서버/클라이언트 렌더 비율을 잽니다.
    • scan(기본값)은 모든 경고를 출력한 뒤 SSR 비율과 권장 규칙을 이어서 보여 줍니다.
    • ssr은 SSR 비율을 먼저 출력하고, 경고는 scope가 ssr인 것만 남깁니다.
    형식
    인자
    actionString기본값 scanscan | ssr
    출력할 보고서로, scan은 전부를, ssr은 렌더 비율만 다룹니다.
    옵션
    --formatString기본값 texttext | json
    짧게는 -f이며, json은 도구가 읽도록 각 경고의 fix까지 담은 전체 결과를 출력합니다.

    scan이 알려 주는 것

    경고마다 위치, 규칙, 문제, 고치는 법이 적힙니다. 경고 뒤에는 SSR 비율과 권장 규칙이 이어지므로 akan quality 한 번으로 경고와 비율을 모두 확인합니다. 줄여 보면 이런 모양입니다:
    Terminal
    • 경고 하나에 한 줄입니다: <file>:<line>:1 - warning <rule>: <message>. global 경고는 파일이 하나로 정해지지 않아 그 자리에 <global>이 찍힙니다.
    • 들여 쓴 줄은 덧붙인 정보입니다. note: related location은 함께 걸린 위치를 하나씩, fix:는 고치는 법을 알려 줍니다.
    • scope 이름순으로 정렬하고, 그다음 파일과 줄 순서를 따릅니다. 그래서 아래 표의 순서대로 나옵니다.
    • 렌더 비율만 보고 싶다면 akan quality ssr을 씁니다. 비율을 먼저 출력하고 ssr 경고만 남깁니다.
    scope 여섯 가지
    Scope설명
    agent
    setter를 감싸 버려서 에이전트 도구로 공개되지 않는 폼 필드를 찾습니다.
    convention

    scope별 규칙

    출력에 나온 규칙 id를 여기서 찾아보세요. 원인이 같은 규칙은 한 행에 묶었습니다.
    규칙이럴 때 뜹니다
    akan.agent.unpublished-form-setter
    값을 받는 화살표 핸들러가 st.do.set…On…을 불러서, 그 필드가 에이전트 도구로 공개되지 않습니다.
    akan.convention.<role>
    모듈 파일이 허용하지 않는 최상위 선언이며, 허용되는 선언은 아래 표에 있습니다.
    akan.file.recommended-max-linesakan.file.max-lines
    서비스 500줄, Template·Zone 800줄, Util 1,000줄, 모든 파일 2,000줄을 넘었습니다.
    akan.file.abstract-max-lines
    *.abstract.md가 300줄을 넘었으니, 코드로 드러나지 않는 내용만 남깁니다.
    akan.file.class-export-global-declaration
    클래스를 export하는 파일이 최상위에 <Class>Options 인터페이스 말고 다른 것을 선언했습니다.

    서버 렌더 비율

    렌더 비율은 컴포넌트 JSX 가운데 서버에서 렌더링되는 몫입니다. 50%를 바닥으로 삼고, 비율이 떨어지면 회귀로 봅니다.
    변경이 마크업을 클라이언트로 옮겼다면, PR에 이유를 적거나 되돌립니다.
    세는 방법
    • 파일이 아니라 엘리먼트를 셉니다. 여는 태그든 스스로 닫는 태그든 JSX 태그 하나가 엘리먼트 하나입니다.
    • 편은 지시문이 정합니다. "use client"로 시작하는 파일의 엘리먼트는 모두 클라이언트로, 나머지는 서버로 셉니다.
    • 앱과 라이브러리마다 한 행이고, 두 개 이상이면 workspace 합계 행이 붙습니다.
    • 50% 미만인 행 끝에는 <- below the 50% target이 붙습니다.
    akan quality ssr은 비율을 먼저 보여 주고, 그 뒤에 ssr 경고만 출력합니다:
    Terminal

    이 페이지

    코드 품질 CLI
    quality
    scan이 알려 주는 것
    scope별 규칙
    서버 렌더 비율
    참고
    이름설명
    실행 위치
    package.json, tsconfig.json, .env가 있는 워크스페이스 루트에서 실행합니다.
    읽는 대상
    apps/와 libs/ 아래의 .ts, .tsx(.d.ts 제외)와 모든 *.abstract.md를 읽습니다.
    건너뛰는 대상
    루트 .gitignore에 걸리는 경로와 node_modules, .git은 읽지 않습니다.
    종료 코드
    무엇을 찾든 성공으로 끝나므로, lint·typecheck 옆에서 돌려도 세 번째 관문이 되지 않습니다.
    예시
    .service.ts 안의 헬퍼처럼, 모듈 파일이 자기 역할에 맞지 않는 것을 선언한 경우입니다.
    file
    파일 단위 위생으로, 길이, 남은 스캐폴드, 전역 선언, 컴포넌트 파일의 export, //! 마커를 봅니다.
    global
    같은 export 이름이나 같은 함수 본문이 여러 파일에 있는 경우입니다.
    layout
    앱, 라이브러리, 모듈 구조에서 허용되지 않은 자리에 놓인 파일과 폴더입니다.
    ssr
    렌더 비율 규칙 여섯 개이며, akan quality ssr은 이 scope만 남깁니다.
    --format json으로 받으면
    JSON 결과에는 필드가 다섯 개 있습니다. akan quality ssr --format json도 모양은 같고, warnings만 scope가 ssr인 것으로 줄어듭니다.
    필드설명
    workspaceRoot
    검사한 워크스페이스의 절대 경로입니다.
    scannedFiles
    읽은 파일 수입니다.
    warnings
    경고마다 rule, scope, severity, message, fix가 있고, 해당하면 file, line, locations도 붙습니다.
    ssrBalance
    비율 표의 행마다 scope, serverMass, clientMass, serverShare(0~1)가 들어 있습니다.
    suggestedRules
    텍스트 출력 끝에 나오는 권장 규칙을 문자열 배열로 담습니다.
    akan.file.component-export
    akan.file.component-internal-declaration
    컴포넌트 파일이 컴포넌트가 아닌 것을 export하거나, <X>Props 말고 로컬 타입·함수를 둡니다.
    akan.file.bang-comment-in-client
    브라우저 코드의 //!·/*! 마커는 압축 후에도 남으므로 // FIXME:로 씁니다.
    akan.file.placeholder-export
    index.ts가 aa, dumb, someCommonLogic 같은 스캐폴드 자리표시자를 export합니다.
    akan.file.dictionary-stale-text
    사전에 Order description 같은 스캐폴드 문구가 남아 있습니다.
    akan.file.global-declarationakan.file.window-augmentationakan.file.prototype-mutation
    declare global, Window 인터페이스, .prototype. 수정은 저수준 통합 파일 하나에 모아 둡니다.
    akan.global.duplicate-exported-function-name
    두 파일이 같은 이름의 함수나 클래스를 export합니다.
    akan.global.duplicate-exported-function-body
    이름이 다른 export들이 같은 본문을 가지고 있으니, 헬퍼 하나로 뽑아냅니다.
    akan.layout.app-root-fileakan.layout.app-root-folderakan.layout.lib-root-fileakan.layout.lib-root-folder
    앱이나 라이브러리 루트에 허용 목록에 없는 파일이나 폴더가 있습니다.
    akan.layout.lib-facet-file
    lib/ 바로 아래에 cnst.ts, option.ts 같은 지원 파일이 아닌 파일이 있습니다.
    akan.layout.module-ui-file
    모듈 폴더의 .tsx 이름이 허용된 역할이 아닙니다. OrderCard.tsx 같은 경우입니다.
    akan.ssr.*
    렌더 비율 규칙 여섯 개로, 다음 섹션에 정리돼 있습니다.
    모듈 파일마다 허용되는 선언
    akan.convention.<role>은 이 목록 밖의 최상위 선언마다 뜹니다. 모델 이름이 Order일 때의 예입니다:
    파일최상위에 둘 수 있는 것
    order.constant.ts
    OrderInput, OrderObject, LightOrder, Order, OrderInsight, enumOf 클래스
    order.dictionary.ts
    export const dictionary
    order.document.ts
    OrderFilter, Order, OrderModel
    order.service.ts
    OrderService
    order.signal.ts
    OrderInternal, OrderSlice, OrderEndpoint
    order.store.ts
    OrderStore
    중복 검사가 건너뛰는 것
    • 당연히 겹치는 이름은 제외합니다. ui/, page/의 파일과 모듈 파일은 이름이 겹쳐도 됩니다. 다만 .constant.ts의 enumOf 클래스는 이름이 겹치면 안 됩니다.
    • 짧은 본문은 비교하지 않습니다. 공백을 줄인 뒤 80자 이상인 본문만 중복으로 봅니다.
    ui/와 lib/만 잽니다. 비율과 규칙 여섯 개는 apps|libs/*/ui/와 apps|libs/*/lib/ 아래의 .tsx만 읽고 테스트는 뺍니다. page/, webkit/, srvkit/, common/은 대상이 아니므로 라우트 파일은 이 숫자를 움직이지 못하고, 거기에 붙인 "use client"도 마찬가지입니다.
    ssr 규칙 여섯 가지
    규칙이럴 때 뜹니다
    akan.ssr.unnecessary-use-client
    "use client"가 있지만 hook, 이벤트 핸들러, store, 브라우저 API를 하나도 쓰지 않으니 이 줄을 지웁니다.
    akan.ssr.client-static-component
    클라이언트 파일의 컴포넌트가 클라이언트 전용 기능 없이 JSX 엘리먼트를 4개 이상 그립니다.
    akan.ssr.client-static-markup
    엘리먼트 10개 이상이 상호작용 한두 개를 감싸고 있으니, 정적인 부분은 서버로 옮깁니다.
    akan.ssr.client-mount-load
    useEffect(…, [])가 fetch.*나 데이터를 불러오는 st.do.* 액션을 부르는데, 라우트가 먼저 불러올 수 있습니다.
    akan.ssr.module-missing-server-view
    모듈의 클라이언트 파일이 엘리먼트를 12개 이상 그리는데, 서버용 Unit이나 View가 없습니다.
    akan.ssr.template-client-state
    .Template.tsx가 useState를 부르지만, Template의 폼 상태는 store에 둡니다.
    일부러 잡지 않는 것
    • 서드파티 코드. 패키지나 st, fetch를 import하는 파일은 "use client"를 지우라고 하지 않고, 패키지 컴포넌트를 그리는 컴포넌트도 건너뜁니다.
    • 역할상 필요한 지시문. 모듈의 Zone, Template, Util과 index_.tsx의 lazy() 경계는 불필요한 "use client"로 잡지 않습니다.
    • 사용자가 시작한 로드. onClick 안의 fetch나 의존성 배열이 있는 effect는 마운트 시점 로드가 아닙니다.
    • 서비스·스칼라 모듈. lib/ 아래 _로 시작하는 폴더에는 Unit이나 View를 요구하지 않습니다.
    관련 페이지
    아키텍처 · 프런트엔드→
    ssr 규칙마다 경고를 부르는 코드와 그것을 없애는 수정을 보여 줍니다.
    akan lint→
    앱, 라이브러리, 패키지 하나를 Biome으로 포맷하고 린트합니다.
    akan typecheck→
    TypeScript로 앱 하나의 타입을 검사합니다.