Nutlope/napkins

어떤 프로젝트인가요?

핵심 기능

• 01Together AI를 통해 Kimi K2.5를 사용해 와이어프레임이나 스크린샷을 앱 코드로 변환합니다.
• 02브라우저에서 Sandpack 코드 샌드박스로 생성된 앱을 미리 볼 수 있습니다.
• 03업로드한 이미지를 S3에 저장합니다.
• 04Next.js app router와 Tailwind CSS로 만들어졌습니다.

활용 사례

• 간단한 손그림 UI 스케치를 실행 가능한 프로토타입으로 변환합니다.
• 비전 LLM이 스크린샷을 프런트엔드 코드로 변환하는 방식을 살펴봅니다.
• 확장 가능한 Next.js 및 Tailwind 프로젝트의 시작점으로 활용합니다.

빠른 시작

1. 1

   저장소를 클론합니다

   git clone https://github.com/Nutlope/napkins
2. 2

   .env 파일을 만들고 Together AI API 키를 추가합니다

3. 3

   S3 버킷을 만들고 .env.example의 값을 사용해 인증 정보를 .env에 추가합니다

4. 4

   종속 항목을 설치하고 로컬에서 실행합니다

   npm install && npm run dev

사용 전 알아둘 점

• !앱을 생성하려면 유료 Together AI API 키가 필요합니다.
• !이미지를 저장하려면 S3 버킷을 설정해야 합니다.

토픽

자주 묻는 질문

napkins은(는) 무엇인가요?

Kimi K2.5와 Together AI를 기반으로 와이어프레임이나 스크린샷을 작동하는 앱으로 변환하는 오픈소스 도구입니다. Napkins.dev는 와이어프레임을 앱으로 변환하는 생성 도구입니다. UI 스케치나 스크린샷을 업로드하면 비전 기능을 갖춘 LLM이 작동하는 앱의 코드를 생성하며, 브라우저 내 코드 샌드박스에서 미리 볼 수 있습니다.

napkins은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

napkins은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

napkins은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. napkins의 마지막 커밋은 2026년 10월 23일입니다.

napkins은(는) 어디에 사용할 수 있나요?

간단한 손그림 UI 스케치를 실행 가능한 프로토타입으로 변환합니다. 비전 LLM이 스크린샷을 프런트엔드 코드로 변환하는 방식을 살펴봅니다. 확장 가능한 Next.js 및 Tailwind 프로젝트의 시작점으로 활용합니다.

napkins는 어떻게 설치하나요?

저장소를 클론합니다: git clone https://github.com/Nutlope/napkins .env 파일을 만들고 Together AI API 키를 추가합니다 S3 버킷을 만들고 .env.example의 값을 사용해 인증 정보를 .env에 추가합니다 종속 항목을 설치하고 로컬에서 실행합니다: npm install && npm run dev

napkins은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/Nutlope/napkins