reopt designreopt design
DocsExploreToolsPricingBuilder
Login
Start
Overview
Start
Next.js 설치
Manual install
Core Concepts
아키텍처
Composition Patterns
Accessibility
Keyboard Patterns
Styling
로컬라이제이션
Theme System
Advanced Patterns
Build & Operate
Skills
AI Integration
CLI (opt surface add)
Dependency Graph
Tools
Canvas Catalog
Theme Builder
Form Builder
Templates
Templates
Releases
Release Notes
Oopt-ui
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

reopt Inc.Business registration no. 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

Start
  1. Docs
  2. /
  3. Start
  4. /
  5. Manual install

Manual install

공개 npm manual install과 Surface CLI 사용법을 별도로 정리

reopt design · Updated Aug 2, 2026

1. 패키지 매니저 설치

public npm 패키지이므로 별도 registry나 토큰 설정은 필요하지 않습니다.

bash
bun add @reopt-ai/opt-ui
bun add -d tailwindcss @tailwindcss/postcss postcss
npx @reopt-ai/opt-cli surface list

2. 패키지 설치

bash
bun add @reopt-ai/opt-ui

런타임은 @reopt-ai/opt-ui 를 import하고, 필요한 경우 optional peer dependency를 각 프로젝트에 추가합니다.

3. Surface 설치

bash
npx @reopt-ai/opt-cli surface add billing-page
  • npx @reopt-ai/opt-cli surface list 로 설치 가능한 Surface 목록을 확인합니다.

  • 복사된 Surface는 프로젝트 내부 코드로 취급하고 직접 수정합니다.

4. 문제 해결

  • 404가 나면 패키지 이름과 요청한 버전이 npmjs.org에 배포됐는지 확인합니다.

  • Surface가 최신이 아니면 CLI 버전을 확인합니다. Surface registry는 CLI 패키지와 함께 배포됩니다.

PreviousNext.js 설치App Router 기준으로 opt-ui를 설치하고 theme/provider를 연결하는 방법Start
Go to Next.js 설치
Next아키텍처opt-ui Core/Shells/Surfaces와 opt-charts 분리, docs/registry 연결 방식을 설명합니다.Core Concepts