소개
지난 사례로 클로드 MCP만을 활용해서 지피터스 사례글 url만 넣으면 러버블 앱에서 라디오로 재생되는 워크플로를 만드는 것을 함
결국 MCP를 활용한다는 것은, 각각 API 연동을 시키는 건데, 이걸 커서한테 다 개발로 바꿔달라고 하면 얼마나 해줄까? 라는 궁금증이 생김
진행 방법
클로드 MCP만을 활용한 워크플로
이렇게 url넣고 단계별로 수행할 것을 명령해주면, 클로드가 알아서 각각 mcp 를 활용해서 팟캐스트도 만들어주고 이걸 슈퍼베이스에 업로드도 해주고, 러버블 웹에서 바로 재생되도록 해줌.
커서야, 이거 그대로 개발로 해줘 -> 일단 실패
먼저 성장피터님한테 배운대로, PRD 빌더 GPTs를 활용해서 이 프로세스를 그대로 커서 에이전트로 개발할거니, PRD 문서를 작성해달라고 함
이렇게 명령했더니 커서에서 mcp를 호출하는 방식으로 처음에 prd를 만들어줬음. 그래서 다시 명령함.
각각의 단계를 mcp를 활용하지 않고 api를 호출해서 수행하는 형태가 되어야 해그렇게 만들어진 PRD 문서
이걸 커서에 가서 prd.md 파일을 만들어 붙여넣은 후 -> 이거 순서대로 개발하려면 해야하는 태스크들을 todo.md 파일로 만들어달라고 함
그리고 todo.md 파일에 있는 순서대로 개발을 진행해달라고 커서 에이전트한테 요청
근데 문제 -> 내가 만든 러버블 웹사이트에서 작동하도록 하려고 했는데, 내가 만든 러버블 웹 코드를 지금 만드는 환경에 추가로 붙일 자신이 없어짐.
그리고 PRD 빌더를 내가 읽어봐도 뭘 요청하고 있는지 모르겠어서 -> todo.md 파일에서도 뭘 하겠다는 건지 읽어도 잘 모르겠어서.. prd 빌더를 쓰는 게 과연 의미가 있나 싶었음. 맨땅부터 시작할 때는 prd 빌더로 초안을 잡 아주니까 좋은데, 이미 내가 원하는 개발요구사항이 있는 상황에서 prd를 만들게 시키면 - 결국 내가 prd 문서를 읽을 줄 모르면 오히려 방해가 된다고 생각이 들었음.
-> 러버블 웹 코드에서부터 다시 시작하자
2트 - 러버블 코드를 커서로 열고, 거기서 커서에이전트를 잘 달래가며 해보자
배운대로 러버블에서 깃헙 계정을 연결하고 -> 커서에서 clone repo 해서 열었음
전체 코드베이스를 분석해달라고 하고 개발서버에서 띄워달라고 함 (배운대로 함)
이후 커서 에이전트에게 직접 명령
api 같은 키를 하나도 안넣어줬는데 다 됐다고 함 -> api 키 안필요해? 하니까
한국 MP3 플레이어의 스크린 샷
아놔;
무튼 .env 파일을 만들어서 필요한 키를 넣으라고 함. (여기서 알게된 사실 - 커서 에이전트는 .env 파일을 직접 생성 수정이 불가함. .env 파일 자체가 보안파일(?) 이라 아예 접근을 못하는 것 같음)
근데 - 내가 사용하라고 처음에 지시한 mcp 종류가 5개인데, 그거마다 다 api 키가 필요하다고 함. 근데 파일명 변경, 파일 이동, js 파일 실행 등은 mcp 없이도 코드로 되는 부분인데 - 무조건 키가 필요하다고 함.
여기서 배운 점 -> 내가 진짜 이런 개념이 아예 없으면 - 커서 에이전트한테 휘둘리기만 하다가 진도를 못 나가겠구나
자 이제 다 추가했다고 하니까 다 완성됐다고 하는데 아무리 해도 개발서버에서 띄웠을 때 아무것도 안보이는 거임. 콘솔 에러를 확인해보니 Uncaught Error: supabaseKey is required. 라는 게 떴음 -> 결국 .env 파일에서 해당 키가 잘 로드되지 않아서 문제라는 거임.
그래서 해당 키를 참조하고 있는 곳을 알려달라 -> 각각 변수명이 정확한지 계속 확인함.
결국 문제 발견 : A 파일에서는 SUPABASE_SERVICE_ROLE_KEY 라고 하고 B 파일에서는 SUPABASE_PUBLISHABLE_KEY 로 선언하고 있어서 안된 거였음. 이걸 다 통일해주니까 바로 개발 서버에서 프리뷰가 뜸!!!!!!
자 이제 프리뷰에서 지피터스 링크를 넣고 라디오 생성을 시도 -> CORS 에러가 나서 그냥 firecrawl api만을 활용해서는 지피터스 링크를 못 읽는다고 함
firecrawl을 사용할거면 단순 헤더에 코드를 추가한다고 해결되지 않고 - "내가 직접 운영하는 백엔드 서버를 프록시로 두기"를 해야한다고 함
나는 백엔드 서버를 운영할줄도 모르고
프록시가 뭔지도 모름
프록시 서버인가 뭔가를 시도해보기로 함
여기서 약간의 시행착오
proxy-server.mjs 파일이 필요하다는데, 커서 에이전트가 만들어준 파일명은 proxy-server.js 임
커서 에이전트 믿을 게 못된다..
하지만 여전히 크롤링은 못해오고 있고 -> 덩달아 일레븐랩스로 팟캐스트도 생성을 못함
근데 그 이후에 슈퍼 베이스에 디비 생성하는 건 잘 실행이 돼서, 껍데기 데이터만 올라간 상황
결과와 배운 점
자 이제 이게 중요한데.......
하면서 여러 생각이 들었음 -> 정말 코드를 모르고 개발 개념이 없는 상황에서 커서 에이전트를 쓴다고 해서 개발이 가능할까.......?
계속 커서한테 해줘해줘를 외치는데 - 지금 얘가 뭘 하고 있는지 따라갈 수가 없어서 갓차 느낌으로 하고 있는 스스로를 발견
차라리 n8n 같은 건 워크플로가 눈에 보이니까 어떤 단계에서 현재 에러가 났구나, 어느 단계까지 지금 개발이 되어있구나- 직관적인데, 커서로 개발하다보면 길을 잃음
크롤링은 못했는데 슈퍼베이스에 데이터는 만들어주고.. -> 뭐가 되고 있는지도 모르겠음
일단 여기까지 올려보겠습니다
정제되지 않은 사례글 - 정말 죄송합니다..ㅎ..