AI Works·2024년 12월 26일·3분 읽기

Netlify Blog MCP - AI 파워드 블로그의 시작

MCP 서버를 활용한 AI 기반 블로그 자동화 플랫폼을 소개합니다. WordPress에서 Netlify로의 여정.

안녕하세요! 👋

Netlify Blog MCP에 오신 것을 환영합니다!

🚀 왜 Netlify인가?

기존 WordPress + Oracle Cloud 조합에서 겪었던 문제들:

  • 잦은 서버 다운타임
  • 느린 응답 속도
  • 복잡한 서버 관리

이를 해결하기 위해 Netlify 기반 JAMStack 블로그로 전환했습니다.

🎯 핵심 기능

AI 자동화

MCP (Model Context Protocol) 서버를 통해 Claude가 직접 블로그를 관리합니다:

  • ✅ 포스트 작성/수정/삭제
  • ✅ 카테고리 및 태그 관리
  • ✅ 이미지 업로드 및 최적화
  • ✅ 자동 리서치 기능 (개발 중)

빠른 배포

Git push만으로 자동 배포가 진행됩니다. Netlify의 CDN을 통해 전 세계 어디서나 빠른 접속이 가능합니다.

모던 스택

  • Next.js 14: App Router 기반 최신 React 프레임워크
  • Tailwind CSS: 유틸리티 우선 CSS 프레임워크
  • Pretendard: 한글 최적화 폰트
  • TypeScript: 타입 안정성

📝 사용 방법

1. MCP 서버 연동

# MCP 서버 빌드
npm run mcp:build

# Cursor 설정에 추가
{
  "netlify-blog": {
    "command": "node",
    "args": ["path/to/dist/mcp/index.js"]
  }
}

2. AI로 글 작성

Cursor에서 Claude와 대화하며 글을 작성할 수 있습니다:

"AI Works 카테고리에 'Next.js 14의 새로운 기능'에 대한 글을 작성해줘"

3. 자동 배포

Git에 커밋하고 푸시하면 자동으로 배포됩니다:

git add .
git commit -m "Add new post"
git push

🎨 디자인 철학

jparkblog.com의 디자인을 참고하여 미니멀하고 깔끔한 UI/UX를 구현했습니다:

  • 넉넉한 여백과 가독성
  • 부드러운 인터랙션
  • 한글 폰트 최적화 (Pretendard)
  • 반응형 디자인

🔮 앞으로의 계획

  • [ ] SEO 최적화 (사이트맵, RSS)
  • [ ] 자동 리서치 & 콘텐츠 생성
  • [ ] 이미지 자동 최적화 (WebP 변환)
  • [ ] Google AdSense 통합
  • [ ] 다크모드 지원
  • [ ] 댓글 시스템 (Giscus)

💬 마무리

이 블로그는 인간과 AI의 협업으로 만들어집니다.

WordPress의 복잡함에서 벗어나 Netlify의 단순함으로, 그리고 MCP를 통한 완전한 자동화까지.

앞으로 더 많은 기능과 콘텐츠로 찾아뵙겠습니다! 🙏


Made with ❤️ by AI & Human Partnership

#Netlify#MCP#AI#자동화