vercel-labs/json-render

외부 오픈소스 저장소를 소개하는 글입니다. HDATF 제품이 아닙니다.

무엇을 하나

json-render는 AI가 prompt로 화면을 JSON 형태로 만들되, 미리 정한 컴포넌트와 동작 목록 안에서만 만들게 하는 framework입니다. 모델이 응답하는 대로 스트리밍되며 React, Vue, Svelte, React Native, PDF, 이메일 등으로 렌더링됩니다.

ATF에 주는 도움

ATF Works의 AI assistant가 글 대신 화면 컴포넌트로 답하되 정해진 컴포넌트 목록을 벗어나지 않게 하는 방법에 참고할 수 있습니다. PDF 출력은 LabChin 보고서와도 비교해 볼 만합니다.

라이선스

Apache-2.0 허용 범위가 넓고 특허 사용 허락이 포함됩니다. 상업적 이용이 가능하며 고지 문구를 유지하고 변경 사실을 밝혀야 합니다.

같은 분야 저장소

• tambo-ai/tambo
  Tambo는 UI를 그려 주는 agent를 만드는 React 툴킷입니다. 개발자가 Zod schema로 컴포넌트를 등록하면 agent가 알맞은 컴포넌트를 골라 props를 스트리밍합니다. 대화 상태와 agent loop는 호스팅 또는 self-hosted 백엔드가 맡습니다.
• AnmolSaini16/mapcn
  MapLibre GL 기반으로 Tailwind 스타일을 입히고 shadcn/ui와 호환되는 React 지도 컴포넌트입니다. 마커, 팝업, 경로, 지도 컨트롤을 제공합니다. 기본 CARTO 지도를 상업적으로 쓰려면 라이선스가 필요합니다.
• ChartGPU/ChartGPU
  WebGPU로 그리는 TypeScript 차트 라이브러리입니다. 점이 많은 시계열, 스트리밍 업데이트, 여러 차트를 모은 대시보드, 3D 시리즈를 대상으로 합니다. WebGL이나 Canvas 대체 경로가 없어서 지원하지 않는 브라우저는 앱이 따로 처리해야 합니다.
• nextlevelbuilder/ui-ux-pro-max-skill
  여러 플랫폼과 프레임워크에서 UI를 만들 때 쓰는 AI skill입니다. 프로젝트 요구사항을 분석해 페이지 패턴, 스타일, 색상, CTA 위치를 담은 디자인 시스템을 만들어 줍니다.
• lukilabs/beautiful-mermaid
  beautiful-mermaid는 Mermaid 다이어그램을 테마를 바꿀 수 있는 SVG나 터미널용 ASCII, Unicode 텍스트로 그려 주는 TypeScript 라이브러리로, DOM에 의존하지 않습니다. 플로차트, 상태, 시퀀스, 클래스, ER, XY 차트 다이어그램을 지원합니다.

Trendshift 순위 목록에 오른 저장소만 담았고, 목록은 후보를 찾는 데만 썼습니다. 순위 숫자는 옮기지 않았습니다. 설명과 라이선스, 별 수는 각 GitHub 저장소에서 확인했습니다. 해설은 우리의 판단입니다. 이 프로젝트들을 직접 시험한 것은 아니며, 상승 목록에 올랐다고 품질이 증명되지는 않습니다.