Repolode
thesysdev

thesysdev/open-intelligent-ui

OpenUI를 기반으로 모델 답변을 대화형 지도, 차트, 폼, 실제로 작동하는 도구로 스트리밍해 표시하는 오픈소스 Next.js 데모입니다.

대체할 수 있는 제품:ChatGPT

스타
608
포크
48
열린 이슈
27
마지막 커밋
그저께

어떤 프로젝트인가요?

Open Intelligent UI는 ChatGPT의 Intelligent UI와 같은 대화형 답변 경험을 재현합니다. 예를 들어 샌프란시스코에서 하루를 보내는 일정을 요청하면 일반 텍스트 대신 지도, 사진, 편집 가능한 일정이 포함된 인터페이스를 생성해 보여줍니다. 모델은 OpenUI Lang을 스트리밍하고, 앱은 모델이 직접 레이아웃을 구성하는 컴포넌트 라이브러리를 사용해 이를 렌더링합니다.

컴포넌트 라이브러리는 레이아웃, 텍스트, 입력 요소, 차트, 표, MapLibre 지도, SVG 그리기, 샌드박스 처리된 HTML 뷰를 지원합니다. 답변은 `$variables`로 상태를 유지하고, 목록, 숫자, 날짜, 텍스트, 대시보드 집계를 위한 약 59개의 내장 `@functions`로 값을 계산할 수 있어 정적인 페이지가 아니라 작은 작업 도구처럼 동작할 수 있습니다.

채팅에는 OpenUI Cloud, OpenRouter 같은 OpenAI 호환 Chat Completions API, 또는 Ollama를 통한 로컬 모델을 사용할 수 있습니다. 프로젝트는 MIT 라이선스를 따르고 Node 24가 필요하며, 개발 전용 갤러리 페이지와 벤치마크 스크립트도 포함합니다.

핵심 기능

  • 01모델 답변을 지도, 차트, 표, 폼, 입력 요소가 포함된 대화형 UI로 렌더링합니다.
  • 02변수로 답변 상태를 유지하고 내장 함수로 값을 계산합니다.
  • 03마커, 카테고리, 도로 경로가 표시된 MapLibre 지도를 제공합니다.
  • 04OpenUI Cloud, 모든 OpenAI 호환 API 또는 로컬 Ollama 모델을 지원합니다.
  • 05컴포넌트와 예제 프로그램을 볼 수 있는 개발 전용 갤러리를 제공합니다.

활용 사례

  • 텍스트 대신 도구를 활용해 답변하는 생성형 채팅 인터페이스를 프로토타이핑합니다.
  • AI 채팅 제품 안에서 여행 일정 계획 도구, 대시보드 또는 계산기를 만듭니다.
  • 생성형 UI를 위한 로컬 또는 대체 LLM 제공자를 실험합니다.

빠른 시작

  1. 1

    환경 파일을 복사합니다

    cp .env.example .env
  2. 2

    종속 항목을 설치합니다

    npm install
  3. 3

    API 키를 .env에 생성합니다

    npm run generate:apiKey
  4. 4

    개발 서버를 시작하고 http://localhost:3000을 엽니다

    npm run dev

사용 전 알아둘 점

  • 답변을 생성하려면 Node 24와 OpenUI Cloud 키 또는 별도의 OpenAI 호환 API 키가 필요합니다.
  • 도로 경로는 공개 OSRM 데모 서버를 사용하며, 도보나 대중교통 경로가 아닌 도로 개요만 표시합니다.
  • README에서는 프로덕션용 라이브러리가 아니라 ChatGPT 기능을 재현한 데모라고 설명합니다.
  • 로컬 모델을 실행하려면 대용량 다운로드(기본 약 18 GB)와 상당한 메모리가 필요합니다.

토픽

자주 묻는 질문

open-intelligent-ui은(는) 무엇인가요?
OpenUI를 기반으로 모델 답변을 대화형 지도, 차트, 폼, 실제로 작동하는 도구로 스트리밍해 표시하는 오픈소스 Next.js 데모입니다. Open Intelligent UI는 ChatGPT의 Intelligent UI와 같은 대화형 답변 경험을 재현합니다. 예를 들어 샌프란시스코에서 하루를 보내는 일정을 요청하면 일반 텍스트 대신 지도, 사진, 편집 가능한 일정이 포함된 인터페이스를 생성해 보여줍니다. 모델은 OpenUI Lang을 스트리밍하고, 앱은 모델이 직접 레이아웃을 구성하는 컴포넌트 라이브러리를 사용해 이를 렌더링합니다.
open-intelligent-ui은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
open-intelligent-ui은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
open-intelligent-ui은(는) 아직 유지보수되고 있나요?
활발히 유지보수 중. open-intelligent-ui의 마지막 커밋은 2026년 10월 17일입니다.
open-intelligent-ui은(는) 어디에 사용할 수 있나요?
텍스트 대신 도구를 활용해 답변하는 생성형 채팅 인터페이스를 프로토타이핑합니다. AI 채팅 제품 안에서 여행 일정 계획 도구, 대시보드 또는 계산기를 만듭니다. 생성형 UI를 위한 로컬 또는 대체 LLM 제공자를 실험합니다.
open-intelligent-ui는 어떻게 설치하나요?
환경 파일을 복사합니다: cp .env.example .env 종속 항목을 설치합니다: npm install API 키를 .env에 생성합니다: npm run generate:apiKey 개발 서버를 시작하고 http://localhost:3000을 엽니다: npm run dev
open-intelligent-ui은(는) 어디서 받을 수 있나요?
소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/thesysdev/open-intelligent-ui

요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.

관련 프로젝트