Skip to content

Huh에러 메시지는 코드가 아니라 스프레드시트에서 관리하세요

Error messages belong in a spreadsheet, not in your codebase. Manage your content in Google Sheets, Airtable, Notion — and ship without code changes.

Huh

⚡ Quick Install

bash
# Install core + framework binding
pnpm add @sanghyuk-2i/huh-core @sanghyuk-2i/huh-react

# Install CLI for data pulling
pnpm add -D @sanghyuk-2i/huh-cli
bash
# Install core + framework binding
npm install @sanghyuk-2i/huh-core @sanghyuk-2i/huh-react

# Install CLI for data pulling
npm install -D @sanghyuk-2i/huh-cli
bash
# Install core + framework binding
yarn add @sanghyuk-2i/huh-core @sanghyuk-2i/huh-react

# Install CLI for data pulling
yarn add -D @sanghyuk-2i/huh-cli

🔄 How It Works

1
📊

Create Spreadsheet

PM이 Google Sheets나 Notion에서 에러 메시지를 정의합니다. 개발자 없이도 언제든 수정 가능합니다.

2
⚙️

Run CLI

huh pull 명령으로 타입 안전한 JSON을 자동 생성. 빌드 타임에 유효성을 검증합니다.

3
🚀

Use in App

React/Vue/Svelte에서 한 줄로 에러 UI를 렌더링. 완전한 타입 지원과 자동완성을 제공합니다.

typescript
// 1. Setup Provider (once)
<HuhProvider config={errorConfig}>
  <App />
</HuhProvider>

// 2. Use anywhere in your app
function LoginPage() {
  const huh = useHuh();

  try {
    await login();
  } catch (error) {
    // Shows error UI automatically from spreadsheet
    huh('ERR_AUTH', { userName: user.name });
  }
}

📦 Packages

📦
@sanghyuk-2i/huh-core
Zero dependencies. 타입 정의, 파싱, 템플릿 엔진, 유효성 검증을 담당하는 핵심 패키지
⚛️
@sanghyuk-2i/huh-react
React 18+ 지원. HuhProvider와 useHuh 훅으로 간편한 통합
💚
@sanghyuk-2i/huh-vue
Vue 3 지원. Composition API 스타일의 useHuh composable 제공
🔥
@sanghyuk-2i/huh-svelte
Svelte 5 지원. Reactive한 에러 핸들링 바인딩
@sanghyuk-2i/huh-cli
커맨드라인 도구. init, pull, validate 명령으로 워크플로우 자동화
🧪
@sanghyuk-2i/huh-test
테스팅 유틸리티. Vitest, Jest와 함께 사용 가능

Ready to Ship Faster? 🚀

하드코딩된 에러 메시지는 이제 그만. 팀이 가장 잘 사용하는 도구에서 콘텐츠를 관리하세요.

Released under the MIT License.