AI 에이전트와 MCP를 사용해 내 웹사이트 콘텐츠를 완전히 자동화하는 방법

I’m happy to translate the article for you, but I’ll need the full text you’d like translated. Could you please paste the content (or the portion you want translated) here? I’ll keep the source line exactly as you provided and preserve all formatting, markdown, code blocks, and URLs.

AI 이전

우선, 내 사이트에 새 팟캐스트 에피소드를 추가하는 것이 어떤 느낌인지 말씀드리겠습니다. 저는 Nuxt Content를 사용하고 있기 때문에 각 팟캐스트는 일부 YAML front‑matter가 포함된 마크다운 파일 하나에 불과합니다. 이 YAML에는 날짜, 팟캐스트 이름, 이미지 URL, 진행자 등과 같은 정보가 들어 있습니다.

작년에는 단순히 기존 팟캐스트 에피소드를 가져와서 VS Code에서 Duplicate를 클릭한 뒤, 새 팟캐스트 정보로 모든 것을 이름만 바꾸는 식으로 작업했습니다. 다시 말해, 저는 수동으로 다음을 했습니다:

1. 새 에피소드 링크를 클릭했습니다.
2. 호스팅 사이트에서 정보를 복사해 마크다운 파일에 붙여넣었습니다.
3. 에피소드 이미지를 다운로드하고 Cloudinary에 업로드한 뒤, Cloudinary 이미지 이름을 복사해 파일에 붙여넣었습니다.

Cloudinary는 이미지를 관리하고 사이트 성능을 유지하는 데 훌륭하지만, 이미지를 다운로드하고 다시 업로드하는 추가 작업은 번거로웠습니다. 때때로 새 에피소드를 추가하는 데 시간이 오래 걸렸는데, 그 이유는 바로 귀찮았기 때문이었습니다.

Automating with Prompts and the Playwright MCP

VS Code에서 재사용 가능한 프롬프트를 사용하여 프로세스의 일부를 자동화하기 시작했습니다. Copilot용 지시문을 만든 뒤 Play 버튼을 눌러 새 채팅에서 프롬프트를 실행하고 팟캐스트 URL을 제공했습니다.

Playwright MCP를 설치하면 Copilot이 팟캐스트가 호스팅된 URL로 이동하여 관련 메타데이터를 추출할 수 있었습니다. 잘 작동했고 많은 시간을 절약했으며, 여러 URL을 제공하여 일괄 업데이트도 가능했습니다.

하지만 이미지 처리에는 여전히 문제가 있었습니다. Cloudinary 사용을 중단하고 이미지를 사이트의 public 폴더에 직접 저장하고 싶었지만, 그렇게 하면 Cloudinary의 최적화 혜택을 잃게 됩니다.

Goose, Playwright MCP, Cloudinary MCP 및 GitHub MCP 자동화

다음으로 Goose를 사용해 보았습니다. Goose는 Block에서 만든 코딩 에이전트로, 데스크톱 앱(또는 CLI 옵션)에서 “레시피”(즉, 매개변수가 있는 프롬프트)를 실행할 수 있습니다. 기존 프롬프트를 Goose에 복사해 레시피로 저장하고, 팟캐스트 URL을 매개변수로 추가했습니다.

새로운 워크플로우 모습

1. Playwright MCP가 팟캐스트 페이지로 이동해 이미지 URL을 포함한 모든 필요한 정보를 추출합니다.
2. Goose가 이미지를 로컬에 다운로드합니다.
3. Cloudinary MCP가 확장 프로그램 설정에 저장된 API 키를 사용해 이미지를 내 Cloudinary 계정에 업로드하고, 올바른 폴더를 자동으로 선택합니다.
4. Goose가 올바른 Cloudinary 이미지 ID를 포함한 마크다운 파일을 작성합니다.
5. GitHub MCP를 이용해 Goose가 새로운 에피소드 파일들로 풀 리퀘스트를 생성합니다.

또한 Goose에게 개발 서버를 실행하고 Playwright로 변경 사항을 검증하도록 요청할 수 있었으며, 팟캐스트 페이지의 스크린샷을 찍어 모든 것이 올바르게 보이는지 확인했습니다.

모든 것이 정상적으로 작동했습니다. PR이 병합된 후, 새로운 팟캐스트 에피소드가 사이트에 적절히 최적화된 Cloudinary 이미지와 함께 표시되었습니다.

결론

모든 것을 파악하고 프로세스를 설정하는 데 시간이 걸렸으며, 맞아요, 단일 에피소드를 위해서는 복사‑붙여넣기가 더 빨랐을 것입니다. 하지만 이제 워크플로우가 자동화되었습니다: 다음에 팟캐스트 에피소드를 추가하고 싶을 때는 그냥 제 Goose 레시피를 실행하고 팟캐스트 URL을 전달하면 됩니다. 메타데이터 추출부터 이미지 업로드 및 PR 생성까지 전체 파이프라인이 자동으로 이루어집니다.

I am a guest on one tonight so when that is out I will be able to add it easily to the site. In fact, if I had a team of people working on my site I could even share the recipe with them and they could simply run it.

I am using **Nuxt Content** for my site, which means I have no CMS. My content lives in markdown files and it makes it very easy as a developer to add content but perhaps not so easy for non‑developers. But now, even my mother could add a new podcast episode to my site. That is just amazing. This is just my personal site but think about the possibilities of this use case for many other businesses.

I am very impressed with what **Goose** can do. The more I am using it, the more it is blowing my mind. I am now going to go ahead and add other **recipes** for the rest of the content I add, or perhaps just modify this recipe with parameters so I can have one recipe. I shall keep playing around. This is fun.

Let me know if you found this interesting, are doing something similar, or have used any of the MCPs mentioned above. We are living in exciting times, so if you haven't started to experiment yet then what are you waiting for? Just play around and have fun.