Skip to main content

기술 스택

딸깍문서는 현대적이고 검증된 기술 스택을 사용합니다.

프론트엔드​

기술버전용도
Next.js16.xReact 프레임워크
React19.xUI 라이브러리
TypeScript5.x타입 안전성
Tailwind CSS3.x스타일링
TipTap3.x리치 텍스트 에디터

Next.js App Router​

최신 App Router 아키텍처를 사용합니다:

  • Server Components
  • Server Actions
  • Streaming
  • Parallel Routes

TipTap 에디터​

ProseMirror 기반의 확장 가능한 에디터:

const editor = useEditor({
  extensions: [
    StarterKit,
    Table.configure({ resizable: true }),
    Image,
    Link,
    Highlight,
    TextAlign,
    Placeholder,
  ],
});

백엔드​

기술용도
Next.js API RoutesREST API
NextAuth.js인증
Supabase데이터베이스, 스토리지

AI 통합​

서비스용도
Anthropic Claude문서 생성/편집
Claude VisionOCR, PDF 빈칸 감지
OpenAI GPT대안 모델 (선택)

Claude API 사용​

import Anthropic from "@anthropic-ai/sdk";

const anthropic = new Anthropic({
  apiKey: process.env.ANTHROPIC_API_KEY,
});

const response = await anthropic.messages.create({
  model: "claude-sonnet-4-20250514",
  max_tokens: 8000,
  stream: true,
  messages: [{ role: "user", content: prompt }],
});

문서 처리​

라이브러리용도
pdf-libPDF 생성/편집
pdfjs-distPDF 렌더링
mammothDOCX 파싱
html-to-docxDOCX 생성

데이터베이스​

Supabase (PostgreSQL)​

  • 관계형 데이터베이스
  • Row Level Security
  • 실시간 구독
  • Storage

배포​

플랫폼용도
Vercel애플리케이션 호스팅
Supabase데이터베이스 호스팅

개발 도구​

도구용도
ESLint코드 린팅
Prettier코드 포맷팅
TypeScript타입 체크