원본: Notion 페이지 (1주차 과제 — 2주차에 제출)
결과물
콘텐츠 허브 — 마케팅 팀을 위한 자료 아카이빙 + AI 요약 + 콘텐츠 기획 웹 서비스
- 주요 기능:
- URL 추가 → Gemini AI 자동 요약/태그 추출
- 노션 페이지 복사 저장 + 자동 동기화 감지
- 아카이브 → 아이디어 전환 (채널 선택 + 참고자료 연결)
- 초안 에디터 (리치 텍스트)
- 태그/카테고리 필터링
- 팀 공유 링크
- 캐러셀 자동 생성 기능 (구현 중)
삽질과정 (어려웠던 부분)
- 인메모리 데이터 휘발: Supabase 없이 인메모리 저장소 사용 → Vercel 서버리스 환경에서 인스턴스마다 데이터 상이 → 노션 시드 데이터를 매번 초기화하는 방식으로 해결
- 와이어프레임 레이아웃 깨짐: 히어로 카드 flex 구조 + 벤토 그리드가 브라우저에서 전부 깨짐 → 복잡한 구조를 버리고 심플한 2열 grid로 단순화. 모바일 → 데스크탑 전환 시 5번 반복 수정
- Vercel 도메인 혼선:
dani-content-hub.vercel.appvscontent-hub-virid.vercel.app두 개 프로덕션 도메인이 생김 → 최종적으로content-hub-virid로 통일 - 빌드 에러 반복: 캐러셀 기능 추가 시 TypeScript 타입 에러로 빌드 실패 →
next build가 Vercel에서만 실패하고 로컬에선 재현이 어려워서 디버깅에 시간 소모
/schedule 활용
[이미지 — Notion 원본 참조]
/schedule 스킬로 노션 자동 동기화 감지 작업 설정:
- 작업 내용: 매시간 노션 “AI 자료 모음” DB를 체크해서 새로운/수정된 페이지가 있으면 콘텐츠 허브에 동기화
- 동작 방식: Claude Code 세션이 열려 있는 동안 cron 스케줄로 Notion MCP 도구 호출 → 현재 아카이브와 비교 → 새 항목 발견 시 알림
- 한계: Claude Code 세션 내에서만 동작 (3일 후 자동 만료). 실제 프로덕션에서는 웹 서비스 자체에 Notion API webhook 또는 cron job을 구현해야 함
인사이트 및 공유하고 싶은 내용
- 브레인스토밍 스킬
- 처음부터 코드를 쓰지 않고, 한 질문씩 요구사항을 좁히고 → 접근법 비교 → 디자인 확인 → 스펙 문서화 순서로 진행하니 “내가 뭘 만들고 싶은지”가 명확해짐
- 기술을 모르는 마케터도 의사결정에 자연스럽게 참여할 수 있었음
- 노션 MCP 연동의 가능성
- Claude Code의 Notion MCP 도구로 실제 워크스페이스 DB를 바로 읽어와서 웹 서비스에 반영할 수 있었음
- “노션 데이터가 콘텐츠 허브에 보이는” 경험을 빠르게 프로토타이핑할 수 있다는 점이 강력했음
/schedule로 매시간 자동 동기화까지 설정
다음에 한다면?
- Supabase DB 연결: 현재 인메모리 저장소라 서버 재시작하면 데이터가 날아감 → Supabase PostgreSQL 연결해서 영구 저장 + 팀원 간 실시간 데이터 공유
- 캐러셀 자동 생성 완성: 아카이브 자료 선택 → Gemini가 7장 슬라이드 카피 생성 → 1080x1080 이미지 렌더링 → PNG 다운로드까지 웹 서비스 안에서 원스톱 처리
팀 브랜딩을 위한 아이디어
- SNS에 선언하기 — AAA팀으로 우리 이런거 한다!
- 팀으로 ~한다는 것 / 서로서로 댓글 달기
- 각자의 결과물 + 과정 작성하기
팀 로고 만들어보기 (Selfish AAA)
- 셀피쉬클럽의 컬러를 담아서 새롭게 생성
- Genspark Agent
[이미지 — Notion 원본 참조: 로고 시안 다수]