메미데브메미데브
memi.dev v0.5.8 AI로 제작 2026.8.3–2026.8.14

메미데브

개발에 대한 모든 것을 다룹니다
제작

이 사이트는 AI로 만들었습니다

워드프레스 테마가 아닙니다. 설계·코딩·마이그레이션·에셋·문서까지 사람과 AI가 같이 짠 Nuxt 사이트입니다. 아래 비중은 대략입니다.

제작 기간 2026.8.3–2026.8.14

  • Grok 4.6 40%
  • Codex 5.6 30%
  • Claude Sonnet 5 20%
  • Gemini Flash 3.6 10%

Grok 4.6

xAI

40%

메인코딩

사이트 본편 설계와 구현.

Codex 5.6

OpenAI

30%

memi-board기능 검증

게시판 모듈 구현. 글·댓글을 직접 올려 작성 플로우가 도는지 확인.

Claude Sonnet 5

Anthropic

20%

memi-board

memi-board 코딩.

Gemini Flash 3.6

Google

10%

에셋문서

이미지·아이콘 같은 에셋과 문서 보조.

연결

영상과 패키지

개발 영상은 유튜브에, 이 사이트 게시판 모듈은 npm에 올려 두었습니다.
YouTube @fkkmemi
개발 과정과 설명을 영상으로 남깁니다.
memi-board on npm
Nuxt 4 + Firebase 게시판 모듈. 이 사이트에서 그대로 쓰고 있습니다.
구성

코드로 만들고, AI와 함께 짠 사이트

워드프레스 템플릿이 아니라 Nuxt 4 SSR과 Firebase로 운영합니다. 게시판은 memi-board입니다.
  • 이 사이트는 템플릿이 아니라, 사람과 AI가 코드를 짜서 올렸습니다
  • 운영 사이트 memi.dev를 Nuxt 4 SSR + App Hosting으로 교체 중
  • 옛 SPA는 old.memi.dev 박물관으로 유지
  • 게시판은 memi-board, 회원은 memiBoardUsers (admin / staff / user)
  • 헤더 메뉴는 settings/menu 한 문서로 관리
  • App Check는 AI Logic만 강제 — 박물관 Firestore 읽기는 그대로
프레임워크 & 언어
Nuxt 4
Vue 기반 풀스택 (SSR · Nitro)
Vue 3
Composition API · script setup
TypeScript
앱·스크립트 공용 타입
UI & 스타일
Nuxt UI v4
헤더·대시보드·폼·모달
Tailwind CSS v4
유틸리티 CSS · 라이트/다크
Lucide + Simple Icons
아이콘 세트
IBM Plex Sans KR
본문 글꼴
백엔드 & 데이터
Firebase Auth
Google · Apple 로그인
Cloud Firestore
회원·메뉴·게시판 데이터
Firebase Storage
이미지·첨부 파일
Firebase App Hosting
SSR 자동 배포
nuxt-vuefire
Nuxt × Firebase 구독
memi-board
게시글·댓글·첨부·검열 모듈 (npm)
App Check + reCAPTCHA v3
AI Logic 앱 증명
Firebase AI Logic
Gemini Developer API 검열
인프라
Squarespace DNS
memi.dev · old.memi.dev
Google Cloud
App Hosting 런타임 (Cloud Run)