Giting.
낮의 Giting

홈 · 슬라이드 · 발표 자료 · 에이전트 네이티브 · React · MIT · 직접 써봄

open-slide 대표 이미지 abafe9e (2026-09-28) · shallow clone(depth 1000) 기준, commitCount 는 하한값
분석 리포트실측 정보사이트적용점원문 README

에이전트를 위한 배관, 진짜다

open-slide 는 에이전트용 슬라이드 프레임워크다(★8,317, MIT). 덱을 자연어로 설명하면 코딩 에이전트가 React 를 쓰고, 프레임워크는 1920×1080 고정 캔버스, 스케일, 네비게이션, 발표 모드, 그리고 HTML·PDF·PPTX 내보내기를 맡는다. 페이지는 제약된 DSL 이 아니라 임의의 React 컴포넌트다. Vercel OSS 프로그램의 후원을 받고, 마지막 커밋이 오늘 기준이며, 최근 90일에 136커밋이 쌓였다.

무엇으로 만들어졌나

규모는 115,783줄이고 TypeScript 중심이다(tsx 142파일 56K줄 + ts 189파일 27K줄). 문서는 MDX 28파일로 두껍고, 테스트 55파일, 태그가 75개라 릴리스가 잦다. 저자는 24명인데 리드 한 명이 이끄는 형태고 상위 커밋에 Claude 가 들어 있다. 에이전트 도구답게 AI 와 함께 만든 흔적이다. 이슈 응답은 빠른 편이다. 표본 25건 중 7건에 답이 달렸고 중앙값이 6시간이다.

클론만 하지 않았다, 직접 써봤다

이 리포트는 코드를 재는 데서 멈추지 않았다. 실제로 이 도구로 덱을 하나 만들어봤다. npx @open-slide/cli init 로 스캐폴드하니 스킬 네 개(/create-slide, /slide-authoring, /apply-comments, /current-slide)가 .claude 와 .agents 에 자동으로 깔렸다. 슬라이드 작성 레퍼런스를 읽고 페이지를 쓰는 게 정확히 이 도구가 상정한 흐름인데, 그걸 그대로 따라 slides/<이름>/index.tsx 에 React 컴포넌트 일곱 개를 썼다. npm run build 는 608ms 만에 정적 사이트를 냈고, 매니저 화면에 내가 만든 덱이 예제와 나란히 떴다. 발표 모드에서 1920×1080으로 일곱 장을 뽑았다. 배관은 광고 그대로였다.

그런데, 돌아간다고 잘 만들어지는 건 아니다

직접 써보고 남은 결론은 하나다. open-slide 가 있다고 좋은 슬라이드가 나오지는 않는다. 표, 색, 여백 같은 디자인 품질은 전부 React 를 쓰는 에이전트와 디자인 시스템에서 나온다. 프레임워크는 캔버스와 발표와 내보내기 같은 배관만 맡는다. 엉성한 입력을 넣으면 그 엉성함을 충실히 렌더할 뿐이다. 슬라이드를 잘 만드는 규율은 여기서 마크다운 레퍼런스 하나와 테마로 얇게 처리된다. 그래서 판정은 참고용이다. 배관이 필요하면 바로 써도 좋지만, 좋은 슬라이드는 여전히 각자의 숙제로 남는다. 돌아간다고 다 된 게 아니다.

실측 정보

HEAD 커밋
abafe9e (2026-09-28) · shallow clone(depth 1000) 기준, commitCount 는 하한값
무엇
에이전트용 슬라이드 프레임워크. 덱을 자연어로 설명하면 코딩 에이전트가 React를 쓰고, 프레임워크가 1920×1080 고정 캔버스·스케일·네비게이션·발표 모드·내보내기(HTML/PDF/PPTX)를 맡는다. 페이지는 임의의 React 컴포넌트(제약 DSL 아님). Vercel OSS 프로그램 후원
규모 / 실측
115,783줄 · TypeScript 중심(tsx 142파일/56K + ts 189파일/27K) · MDX 문서 28파일 · 604파일 · 테스트 55 · CI 2
활발 / 유지
최근 90일 136커밋 · 마지막 커밋 2026-09-28 · 태그 75(잦은 릴리스, 버전 churn 각오) · 저자 24(리드 주도, 상위에 Claude 커밋 포함) · 이슈 응답 빠른 편(표본 25건 중 7건 응답·중앙값 6시간)
에이전트
스킬 4종 내장(/create-slide·/slide-authoring·/apply-comments·/current-slide, `.claude`·`.agents`에 설치) · 브라우저 인스펙터 코멘트가 소스에 @slide-comment 마커로 남고 /apply-comments 로 에이전트가 일괄 반영
직접 써봄
이 리포트는 클론 실측 + 실사용이다. `npx @open-slide/cli init` 스캐폴드 → 페이지(React) 작성 → `npm run build` 608ms → 발표 모드 1920×1080 캡처까지 실제로 돌려 VOL.06 덱 7장을 뽑았다
라이선스 / 주의
MIT. ⚠️ 유명한 openslide/openslide(의료 슬라이드 이미지 C 라이브러리, ★518)와 이름이 겹치나 완전히 다른 프로젝트다(미러·포크 아님). ⚠️ SPA라 정적 서빙엔 history fallback 필요(없으면 딥링크 404), index 번들 1.3MB, 번들 폰트는 Geist(한글은 테마에 폰트 지정)

사이트 실측

주소
open-slide.dev
응답 · 첫 화면
200 · 2.5초 (데스크톱)
요청 · 전송량
51개 · 1.3MB
깨진 요청 · 콘솔 오류
0개 · 0개
폰(390px)
가로 넘침 없음
디자인
밝은 화면 · GeistSans

홈페이지를 실제 크롬으로 띄워 첫 화면까지만 쟀습니다(2026-10-16 · 데스크톱 1440px · 폰 390px). 로그인 · 입력 같은 동작은 하지 않았고, 사이트 상태는 리포 품질과 따로 봅니다. 색 칸은 바탕 · 면 · 글자 · 흐린 글자 · 강조 · 선, 점선은 「못 잼」.

적용점

  • 이럴 때 유용에이전트(Claude Code·Cursor·Codex 등)로 React 슬라이드를 만들고 싶을 때. 배관(1920×1080 캔버스·발표 모드·PPTX 내보내기)이 진짜로 되고, 록인 없이 정적으로 배포된다. 직접 써보니 스캐폴드부터 빌드까지 매끄러웠다(빌드 608ms). '에이전트를 위한'이 마케팅 문구가 아니라 실제 작동 방식이다.
  • 이럴 땐 주의open-slide가 있다고 좋은 슬라이드가 나오는 건 아니다. 디자인 품질은 React 를 쓰는 에이전트와 디자인 시스템 몫이고, 프레임워크는 배관만 책임진다. 엉성한 입력을 넣으면 그 엉성함을 충실히 1920×1080으로 렌더한다. 슬라이드를 잘 만드는 규율은 여기서 얇게(마크다운 레퍼런스 하나 + 테마) 처리된다.
  • 먼저 볼 것MIT라 자유롭다. 다만 SPA 정적 서빙엔 history fallback 이 필요하고(없으면 /s/<덱> 딥링크가 404), index 청크가 1.3MB이며, 번들 폰트가 Geist라 한글 덱은 테마에서 폰트를 지정해야 한다. 이름이 의료용 openslide 와 겹쳐 검색·인용에서 혼동될 수 있다.
◈ 참고용

판정은 참고용이다. 오해 없게 먼저 말하면, 도구 자체는 진짜고 잘 만들었다. 별 8,317에 90일 136커밋으로 활발하고, 이슈 응답 중앙값이 6시간으로 빠르며, Vercel OSS 후원을 받는다. 무엇보다 클론해서 재기만 한 게 아니라 실제로 이걸로 VOL.06 덱 7장을 만들어봤다. 스캐폴드가 비대화형으로 깔끔하게 됐고, 덱은 slides/<이름>/index.tsx 에 React 컴포넌트로 쓰면 됐고, 빌드가 608ms에 정적 사이트로 나왔고, 발표 모드와 PPTX 내보내기까지 배관이 다 붙어 있었다. '에이전트를 위한'은 마케팅이 아니라 사실이었다. 그런데 직접 써보고 나서 남은 결론은 이거다. open-slide 가 있다고 좋은 슬라이드가 나오지는 않는다. 이 도구는 슬라이드를 돌아가게 해주지 잘 만들어 주지 않는다. 표·색·여백 같은 디자인 품질은 전부 React 를 쓰는 쪽(에이전트)과 디자인 시스템에서 나오고, 프레임워크는 캔버스·발표·내보내기 같은 배관만 맡는다. 천장은 작성자에게 달려 있고 open-slide 는 바닥과 배관만 책임진다. 돌아간다고 다 된 게 아니다. 그래서 도입 후보가 아니라 참고용으로 둔다. 배관이 필요하면 바로 써도 좋지만, 좋은 슬라이드는 여전히 각자의 숙제다.

원문 README

아래는 open-slide/open-slide 저장소의 README 원문입니다(GitHub 렌더, 수집 시점 기준). 저작권은 원 프로젝트에 있으며 원 저장소의 라이선스를 따릅니다. GitHub에서 보기

README 전문 펼치기
open-slide github cover

Vercel OSS Program

open-slide

GitHub stars GitHub forks License: MIT

The slide framework built for agents. Describe your deck in natural language — your coding agent writes the React. open-slide handles the canvas, scaling, navigation, hot reload, and present mode so the agent can focus on content.

Every slide renders into a fixed 1920 × 1080 canvas. Pages are arbitrary React components, not a constrained DSL.

npx @open-slide/cli init my-slide

Why open-slide

Slides are visual code. Agents are great at writing code. open-slide is the missing runtime that turns "make slides about X" into a polished, presentable deck — without you ever leaving the chat.

Highlights

🤖 Agent-native authoring

Works with any coding agent (Claude Code, Codex, Cursor, …). The scaffolder ships with built-in skills:

  • /create-slide — drafts a deck end-to-end. Asks four scoping questions (topic & aesthetic, page count, text density, motion vs. static), picks an id, plans the structure, and writes the pages.
  • /slide-authoring — the technical reference for the 1920 × 1080 canvas, type scale, palette, and layout rules. The agent reads this before writing.

From a one-line prompt to a polished deck, no boilerplate.

🎯 In-browser inspector

Click any element in the dev server and attach a comment — "make this red", "change to 'Open Slide Rocks'", "shrink the headline". Comments are persisted as @slide-comment markers in source. Run /apply-comments and the agent applies every pending edit, then clears the markers.

The loop: present → click to comment → /apply-comments → repeat.

🖼️ Assets manager + svgl logo search

Manage images, videos, and fonts per deck through a built-in assets panel. Search and drop in any brand logo via the integrated svgl catalogue — no more hunting for SVGs.

🎬 Professional present mode

Fullscreen playback with keyboard navigation, plus a presenter mode with current/next slide preview, speaker notes, and a timer. Built for the stage, not just the browser tab.

📦 Export to static HTML, PDF & PPTX

One command exports your deck as a self-contained static HTML site, a print-ready PDF, or an editable PowerPoint file. The PPTX export runs entirely in the browser and turns each page into native text boxes, shapes, and images — no server, no headless browser.

📁 Slide manager

Organise decks into folders with custom emoji and drag-and-drop to reorder. Useful once you've built more than three decks and need to find anything.

🚀 Deploy-friendly

Outputs a plain static build — one-click deploy to Vercel, Cloudflare Pages, Zeabur, Netlify, or any static host. No server, no runtime, no lock-in.

Get started

npx @open-slide/cli init my-slide
cd my-slide
pnpm dev

The scaffolded workspace ships with agent skills preconfigured for Claude Code. From there you drive the deck through your agent — or edit slides/<id>/index.tsx directly. See CLAUDE.md for the hard rules.

Repo layout

This repo is a pnpm + Turbo monorepo.

Path Description
packages/core @open-slide/core — runtime (home page, slide viewer, present mode, inspector), Vite plugin, and the open-slide dev/build/preview CLI.
packages/cli @open-slide/cli — npx @open-slide/cli init scaffolder. Generates a minimal workspace where Vite/React/tsconfig stay hidden inside core.
apps/demo Example workspace that consumes @open-slide/core via workspace:*. Used for local development of the framework.

Development

pnpm install
pnpm dev      # runs the demo against the local @open-slide/core
pnpm build    # builds all packages
pnpm check    # type-checks all packages
pnpm lint     # lints via biome

Support

If open-slide has been useful to you, consider supporting development:

Buy Me a Coffee

License

MIT © Yiwei Ho

의견

판정에 대한 반론, 도입 경험, 정정 제보를 환영합니다. GitHub 계정으로 참여합니다.

이것도 재봤습니다

전체 리포트 →