image
Akan.js
English
DocsConventionsReferencesCheatsheet
image
Akan.js
DocsConventionsReferencesCheatsheet
MIT 라이선스 하에 배포되었습니다.
Akan.js 공식 컨설팅 서비스Akansoft
Copyright © 2026 Akan.js 모든 권리 보유.
시스템 관리자bassman
일반
• 인증
• 스키마 설계
• 엣지 컴퓨팅
• 파일 관리
• Single Sign-On
• DataList & Enum
인터페이스
• CRUD
• Endpoint
• Form
관측성
• 로깅
• 의존성 주입
• 에러 처리
• 메트릭
성능
• 캐싱
• 이미지 최적화
• 지연 로딩
• 쿼리
• 큐
• 실시간
개발
• 문서화
• 스크립트
• 도커
• 쿠버네티스
일반
• 인증
• 스키마 설계
• 엣지 컴퓨팅
• 파일 관리
• Single Sign-On
• DataList & Enum
인터페이스
• CRUD
• Endpoint
• Form
관측성
• 로깅
• 의존성 주입
• 에러 처리
• 메트릭
성능
• 캐싱
• 이미지 최적화
• 지연 로딩
• 쿼리
• 큐
• 실시간
개발
• 문서화
• 스크립트
• 도커
• 쿠버네티스
Next
인증

Schema에서 form 만들기

모델 schema가 설계되면 form은 그 모양 위에 얇게 올리는 UI가 됩니다. 가장 쉬운 패턴은 wrapper에서 데이터를 준비하고, Template에서는 field만 그리는 것입니다.
  • Server page는 생성 기본값이나 parent id를 준비합니다.
  • Template은 `st.use.articleForm()`을 읽고 field를 그립니다.
  • Modal wrapper는 빠른 클라이언트 수정 흐름을 처리합니다.

Template은 단순하게

Template은 form이 어디서 왔는지 판단하지 않습니다. 현재 form state를 읽고 각 field를 store setter에 연결하는 일만 담당합니다.
Article template

SSR로 생성 form 만들기

페이지가 기본값을 이미 알고 있다면 server-rendered page에서 `Load.Edit`을 사용하세요. parent id, 현재 org, 기본 상태, URL에서 온 값에 유용합니다.
새 article page

수정 page

별도 수정 page가 필요하다면 서버에서 model을 조회해 `Load.Edit`에 넘기세요. Template은 생성 때와 그대로 재사용할 수 있습니다.
Article 수정 page

클라이언트 modal 수정

사용자가 이미 목록이나 상세 카드를 보고 있다면 새 page로 이동하는 것보다 modal에서 수정하는 편이 더 빠를 때가 많습니다.
현재 항목 수정
보기와 수정 modal

꿀팁

  • 생성, 수정 page, edit modal에서 하나의 Template을 재사용하세요.
  • parent id처럼 숨겨진 값은 사용자에게 고르게 하지 말고 서버에서 준비하세요.
  • 일반 이동은 `onSubmit`, `self` 같은 특수 submit path는 `submitOption`을 사용하세요.
  • Field 로직이 커지면 작은 field group으로 나누되, form의 주인은 Template으로 유지하세요.
Schema에서 form 만들기
Template은 단순하게
SSR로 생성 form 만들기
수정 page
클라이언트 modal 수정
꿀팁