본문으둜 κ±΄λ„ˆλ›°κΈ°

κ°œμš”

πŸ’Ž ν”„λ‘œμ νŠΈ κ°œμš”: SurfAI μ΅œμ’… μ—…λ°μ΄νŠΈ: 2025λ…„ 6μ›” 29일

이 λ¬Έμ„œλŠ” SurfAI ν”„λ‘œμ νŠΈμ˜ λΉ„μ „, 핡심 κ°œλ…, μ£Όμš” κΈ°λŠ₯, 그리고 λͺ©ν‘œλ₯Ό μƒμ„Ένžˆ μ„€λͺ…ν•©λ‹ˆλ‹€.


1. ν”„λ‘œμ νŠΈ λΉ„μ „ (Vision)​

SurfAI의 핡심 비전은 AI 이미지 및 λΉ„λ””μ˜€ 생성 기술의 λ³΅μž‘μ„±μ„ μ œκ±°ν•˜κ³ , λˆ„κ΅¬λ‚˜ μ „λ¬Έκ°€ μˆ˜μ€€μ˜ 결과물을 μ†μ‰½κ²Œ λ§Œλ“€ 수 μžˆλ„λ‘ ν•˜λŠ” κ²ƒμž…λ‹ˆλ‹€.

기쑴의 AI 생성 도ꡬ듀은 μ‚¬μš©μžκ°€ λ³΅μž‘ν•œ λ…Έλ“œ κ΅¬μ‘°λ‚˜ μˆ˜λ§Žμ€ νŒŒλΌλ―Έν„° 값을 직접 μ΄ν•΄ν•˜κ³  μ„€μ •ν•΄μ•Ό ν•˜λŠ” 높은 μ§„μž… μž₯벽을 κ°€μ§€κ³  μžˆμŠ΅λ‹ˆλ‹€. SurfAIλŠ” μ΄λŸ¬ν•œ 문제λ₯Ό ν•΄κ²°ν•˜κΈ° μœ„ν•΄, 기술 μ „λ¬Έκ°€(κ΄€λ¦¬μž)κ°€ 잘 λ§Œλ“€μ–΄μ§„ ComfyUI μ›Œν¬ν”Œλ‘œμš°λ₯Ό "ν…œν”Œλ¦Ώ"으둜 λ“±λ‘ν•˜λ©΄, 일반 μ‚¬μš©μžλŠ” 마치 잘 λ§Œλ“€μ–΄μ§„ 카메라 μ•±μ˜ ν•„ν„°λ₯Ό κ³ λ₯΄λ“―, λͺ‡ κ°€μ§€ 직관적인 νŒŒλΌλ―Έν„°λ§Œ μ‘°μ ˆν•˜μ—¬ 일관성 있고 κ³ ν’ˆμ§ˆμ˜ 결과물을 얻을 수 μžˆλŠ” ν˜μ‹ μ μΈ μ‚¬μš©μž κ²½ν—˜μ„ μ œκ³΅ν•˜κ³ μž ν•©λ‹ˆλ‹€.


2. 핡심 κ°œλ… (Core Concepts)​

SurfAI μ„œλΉ„μŠ€λŠ” λ‹€μŒ 두 κ°€μ§€ 핡심 κ°œλ…μ„ μ€‘μ‹¬μœΌλ‘œ κ΅¬μΆ•λ©λ‹ˆλ‹€.

κ°€. μ›Œν¬ν”Œλ‘œμš° ν…œν”Œλ¦Ώ (Workflow Template)​

  • μ •μ˜: νŠΉμ • λͺ©μ (예: 'κ³ ν’ˆμ§ˆ 인물 사진 생성', 'μ• λ‹ˆλ©”μ΄μ…˜ μŠ€νƒ€μΌ λ‹¨νŽΈ λΉ„λ””μ˜€ μ œμž‘')을 μœ„ν•΄ μ΅œμ ν™”λœ ComfyUI μ›Œν¬ν”Œλ‘œμš°μ˜ "청사진"μž…λ‹ˆλ‹€.
  • ꡬ성 μš”μ†Œ: ν…œν”Œλ¦Ώμ€ ComfyUI의 원본 definition JSONκ³Ό, μ‚¬μš©μžκ°€ μ œμ–΄ν•  수 μžˆλŠ” parameter_map으둜 κ΅¬μ„±λ©λ‹ˆλ‹€.
  • μ—­ν• : κ΄€λ¦¬μžλ§Œμ΄ 이 ν…œν”Œλ¦Ώμ„ μƒμ„±ν•˜κ³  κ΄€λ¦¬ν•˜λ©°, μ„œλΉ„μŠ€μ˜ 핡심 생성 λŠ₯λ ₯을 μ •μ˜ν•˜κ³  ν™•μž₯ν•˜λŠ” 역할을 ν•©λ‹ˆλ‹€.

λ‚˜. 동적 νŒŒλΌλ―Έν„° (Dynamic Parameters)​

  • μ •μ˜: μ›Œν¬ν”Œλ‘œμš° ν…œν”Œλ¦Ώ λ‚΄μ—μ„œ μ‚¬μš©μžκ°€ 직접 μˆ˜μ •ν•  수 μžˆλ„λ‘ κ΄€λ¦¬μžκ°€ μ§€μ •ν•œ 핡심 λ³€μˆ˜λ“€μž…λ‹ˆλ‹€.
  • μ˜ˆμ‹œ: positive_prompt, negative_prompt, seed, cfg, steps, λΉ„λ””μ˜€μ˜ length 및 fps λ“±.
  • μ—­ν• : μ‚¬μš©μžλŠ” λ³΅μž‘ν•œ λ…Έλ“œ ꡬ쑰λ₯Ό μ „ν˜€ λͺ°λΌλ„, ν”„λ‘ νŠΈμ—”λ“œμ˜ μΉœν™”μ μΈ UIλ₯Ό 톡해 이 νŒŒλΌλ―Έν„° κ°’λ“€λ§Œ μˆ˜μ •ν•˜μ—¬ μžμ‹ λ§Œμ˜ 독창적인 결과물을 생성할 수 μžˆμŠ΅λ‹ˆλ‹€.

3. μ£Όμš” κΈ°λŠ₯ (Key Features)​

κ°€. κ΄€λ¦¬μž (Admin) κΈ°λŠ₯​

  • μ›Œν¬ν”Œλ‘œμš° ν…œν”Œλ¦Ώ 관리 (CRUD): κ΄€λ¦¬μž μ „μš© νŽ˜μ΄μ§€μ—μ„œ μ›Œν¬ν”Œλ‘œμš° ν…œν”Œλ¦Ώμ„ 생성, 쑰회, μˆ˜μ •, μ‚­μ œν•  수 μžˆμŠ΅λ‹ˆλ‹€.
  • μ—­ν•  기반 μ ‘κ·Ό μ œμ–΄ (RBAC): νŠΉμ • 이메일 μ£Όμ†Œλ₯Ό κ°€μ§„ μ‚¬μš©μžμ—κ²Œλ§Œ κ΄€λ¦¬μž κΆŒν•œμ„ λΆ€μ—¬ν•˜μ—¬ μ‹œμŠ€ν…œμ„ μ•ˆμ „ν•˜κ²Œ κ΄€λ¦¬ν•©λ‹ˆλ‹€.
  • (ν–₯ν›„) μ‚¬μš©μž 및 μ„œλΉ„μŠ€ 톡계 관리: 전체 μ‚¬μš©μž λͺ©λ‘ 쑰회, μ„œλΉ„μŠ€ μ‚¬μš©λŸ‰ 톡계 등을 확인할 수 μžˆλŠ” λŒ€μ‹œλ³΄λ“œ κΈ°λŠ₯을 ν™•μž₯ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

λ‚˜. 일반 μ‚¬μš©μž (User) κΈ°λŠ₯​

  • κ°„νŽΈν•œ 둜그인: 이메일/λΉ„λ°€λ²ˆν˜Έ κ°€μž… λ˜λŠ” Google 계정을 ν†΅ν•œ κ°„νŽΈ λ‘œκ·ΈμΈμ„ μ§€μ›ν•©λ‹ˆλ‹€.
  • ν…œν”Œλ¦Ώ 기반 생성: 곡개된 μ›Œν¬ν”Œλ‘œμš° ν…œν”Œλ¦Ώ λͺ©λ‘μ—μ„œ μ›ν•˜λŠ” μŠ€νƒ€μΌμ„ μ„ νƒν•˜κ³ , κ°„λ‹¨ν•œ 폼 μž…λ ₯을 톡해 이미지/λΉ„λ””μ˜€ 생성을 μš”μ²­ν•©λ‹ˆλ‹€.
  • μ‹€μ‹œκ°„ μ§„ν–‰ 상황 확인: WebSocket을 톡해 생성 μž‘μ—…μ˜ μ§„ν–‰λ₯ , λŒ€κΈ°μ—΄ μƒνƒœ, 그리고 생성 쀑인 프리뷰 결과물을 μ‹€μ‹œκ°„μœΌλ‘œ 확인할 수 μžˆμŠ΅λ‹ˆλ‹€.
  • 개인 가러리 (νžˆμŠ€ν† λ¦¬): μžμ‹ μ΄ μƒμ„±ν•œ λͺ¨λ“  결과물을 "νžˆμŠ€ν† λ¦¬" νŽ˜μ΄μ§€μ—μ„œ ν™•μΈν•˜κ³  관리할 수 μžˆμŠ΅λ‹ˆλ‹€.
  • κ²°κ³Όλ¬Ό 관리: κ°€λŸ¬λ¦¬μ—μ„œ 각 결과물을 ν™•λŒ€ν•˜μ—¬ 상세 생성 정보(μ‚¬μš©ν•œ νŒŒλΌλ―Έν„° λ“±)λ₯Ό ν™•μΈν•˜κ³ , κ³ ν™”μ§ˆ 원본 νŒŒμΌμ„ λ‹€μš΄λ‘œλ“œν•˜κ±°λ‚˜ μ‚­μ œν•  수 μžˆμŠ΅λ‹ˆλ‹€.

4. 기술 μŠ€νƒ (Tech Stack)​

  • Frontend: Next.js, React, TypeScript, Tailwind CSS
  • Backend: NestJS, TypeScript, TypeORM, PostgreSQL
  • Infrastructure: Docker, Google Cloud Run, Cloudflare R2, Nginx
  • Documentation: Docusaurus, Gemini CLI, Mermaid

5. 기술적 λͺ©ν‘œ (Technical Goals)​

  • μ•ˆμ •μ„± 및 ν™•μž₯μ„±: λͺ¨λ“  μ„œλΉ„μŠ€λ₯Ό Docker μ»¨ν…Œμ΄λ„ˆν™”ν•˜κ³  Google Cloud Run에 λ°°ν¬ν•˜μ—¬, νŠΈλž˜ν”½μ— 따라 μžλ™μœΌλ‘œ ν™•μž₯λ˜λŠ” μ•ˆμ •μ μΈ μ„œλ²„λ¦¬μŠ€ μ•„ν‚€ν…μ²˜λ₯Ό κ΅¬μΆ•ν•©λ‹ˆλ‹€.
  • λ³΄μ•ˆ: JWT와 HttpOnly μΏ ν‚€λ₯Ό μ΄μš©ν•œ μ•ˆμ „ν•œ 인증, CSRF 및 WAFλ₯Ό ν†΅ν•œ μ›Ή 곡격 λ°©μ–΄, μ—­ν•  기반 μ ‘κ·Ό μ œμ–΄ λ“± 닀측적인 λ³΄μ•ˆ 체계λ₯Ό μ μš©ν•©λ‹ˆλ‹€.
  • μžλ™ν™”λœ μ›Œν¬ν”Œλ‘œμš°: GitHub Actionsλ₯Ό μ΄μš©ν•œ CI/CD νŒŒμ΄ν”„λΌμΈμ„ κ΅¬μΆ•ν•˜μ—¬, μ½”λ“œ λ³€κ²½ 사항을 μžλ™μœΌλ‘œ ν…ŒμŠ€νŠΈν•˜κ³  λ°°ν¬ν•˜λŠ” ν”„λ‘œμ„ΈμŠ€λ₯Ό ν™•λ¦½ν•©λ‹ˆλ‹€.
  • μœ μ§€λ³΄μˆ˜μ„±: ν”„λ‘ νŠΈμ—”λ“œμ™€ λ°±μ—”λ“œλ₯Ό λͺ…ν™•νžˆ λΆ„λ¦¬ν•˜κ³ , 각 λ‚΄λΆ€μ—μ„œλ„ λͺ¨λ“ˆκ³Ό μ»΄ν¬λ„ŒνŠΈμ˜ μ±…μž„μ„ λͺ…ν™•νžˆ λ‚˜λˆ„λŠ” 클린 μ•„ν‚€ν…μ²˜λ₯Ό μ§€ν–₯ν•©λ‹ˆλ‹€.
  • μ‚΄μ•„μžˆλŠ” λ¬Έμ„œ: Docusaurusλ₯Ό 톡해 λͺ¨λ“  λ¬Έμ„œλ₯Ό μ½”λ“œμ™€ ν•¨κ»˜ Git으둜 κ΄€λ¦¬ν•©λ‹ˆλ‹€. 이λ₯Ό 톡해 항상 μ΅œμ‹  μƒνƒœμ˜ μ •ν™•ν•œ λ¬Έμ„œλ₯Ό λͺ¨λ“  ꡬ성원이 μ‰½κ²Œ μ—΄λžŒν•  수 μžˆλŠ” ν™˜κ²½μ„ κ΅¬μΆ•ν•©λ‹ˆλ‹€.