클로드 코드, 스트래피, GCP 클라우드 런으로 웹사이트 재구축하기

한 개발자가 Lovable 플랫폼에서 이전한 후 회사 웹사이트를 재구축한 경험을 상세히 설명했습니다. 주요 동기는 Lovable의 크레딧 시스템 한계를 극복하기 위한 것이었는데, 이 시스템은 로컬 개발과 자동화 기능을 제한하고 변경을 두렵게 만들었습니다. 새로운 기술 스택은 Claude Code로 구축되었으며, 헤드리스 CMS로 Strapi를 사용하고 배포에는 GCP Cloud Run을 활용했습니다.

기술 스택과 구현

재구축은 세 가지 핵심 구성 요소에 중점을 두었습니다: AI 지원 개발을 위한 Claude Code, 콘텐츠 관리를 위한 Strapi, 호스팅과 서비스를 위한 Google Cloud Platform입니다. 이 조합은 데이터베이스, 자동화 도구, 스케줄러, 확장성 옵션, 무료 티어에서 이용 가능한 기타 Google 서비스에 대한 접근을 제공했습니다.

스킬 개발과 활용

개발자는 프로젝트 전반에 걸쳐 Claude Code의 스킬 시스템을 적극적으로 활용했습니다:

• Anthropic이 제공한 프론트엔드 스킬과 미학 스킬과 같은 스킬 사용
• 프로젝트 진행에 따라 수많은 맞춤형 스킬 생성
• 특정 디자인 관련 스킬에는 다음이 포함됨:
  • 브레인스토밍을 위한 Superpower Plug-in
  • 비디오 및 인터랙티브 그래픽 제작을 위한 Remotion 스킬 (블로그 게시물과 웹사이트에서 예시 확인 가능)
  • 일관된 디자인 언어 유지를 위한 맞춤형 디자인 스킬
  • Draw things 스킬
• 운영 스킬 개발 포함:
  • Strapi를 통한 GCP 배포
  • 블로그 게시물, SEO, AEO를 위한 스키마 생성
  • Claude Code로 구동되는 자동 콘텐츠 파이프라인 구축

워크플로우 장점

개발자는 Strapi로 모든 편집을 로컬에서 실행하고 진행 상황을 GitHub에 동기화할 수 있는 능력을 강조했으며, 배포는 GCP Cloud Run이 처리했습니다. 이 접근 방식은 이전 Lovable 설정에서 존재했던 변경을 두려워하는 지속적인 공포를 제거했습니다. 이 프로젝트는 오픈 소스이며, 팀은 Claude Code를 사용한 고급 에이전트 워크플로우에 대한 라이브 웨비나를 진행하고 있습니다.