소개
처음으로 모각 스터디 모임에 참석했습니다. Lovable dev를 혼자 써보긴했는데 무료 버전이라 몇 번 만들다가 금방 사용 한도가 차서 뭘 제대로 만들어보지 못했거든요. 역시 스터디에 참석하니 수혈하듯 예상하지 못한 내용을 알게 됩니다.
A. Lovable로 내 프로필 사이트 만들기
B. Notion-Claude MCP 연결해보기
진행 방법
A. Lovable로 내 프로필 사이트 만들기
A-1. Claude에서 다듬은 프롬프트를 Lovable에 가져와 그대로 명령
A-2. Supabase 연결하여 Fetch된 메타데이터를 DB에 저장하기
: 프롬프트로 기획했던 내용대로 사이트는 뚝딱 뚝딱 성공적으로 만들어졌습니다. 원래 기획하지 않았던 프로필 수정하기 기능이 없어서 추가했고, URL의 Metadata를 가져와서 블로그를 만들어주는 기능이 작동하지 않아서 두어번 수정 요청을 해서 반영했습니다. Metadata 가져오 기 동작은 Claude에게 코드 생성을 요청해서 가져왔고, 코드를 참고하여 반영해달라고 요청한 이후로 수정이 되었습니다.
수정이 모두 완료되자, Supabase와 연결하는 작업을 하려고 했으나 아쉽지만 그 이상은 일일 한도가 다 되어 더 진행할 수는 없었습니다. 하루 5개 명령어는 너무 짧은 거 아닌가!!
B. Notion-Claude MCP 연결해보기
Lovable로 DB를 만들어 보는 과정이 아쉬워, DB 데이터를 MCP로 Notion에 자동 저장하는 걸 한 번 시도해보기로 했습니다. 역시 오프라인에 나와야 생각하지도 못한 팁들을 배워갑니다. 사실 현업에 바쁘다는 핑계로 등록한 스터디도 잘 듣지 못했는데요, 그래서 MCP는 여기 저기 많이 들리지만 써보는 건 처음이었습니다.
지피터스 게시글에 올라온 Notion과 MCP 연동 설정하는 친절한 글들을 참고하여 저도 드디어 Claude에 망치가 생겼습니다. 다행히 오류없이 잘 설치되었고, 클로드에서 URL만 주고 Notion에 만들어둔 table에 저장해달라고 하니, 바로 바로 데이터가 잘 쌓이는 걸 확인할 수 있었습니다.
기능 중에 DuckduckGo 라는 Web Search API 를 사용했는데 닿님 얘기하신것처럼 대화가 모두 사라지더라고요. 이 부분은 저도 여쭤봐야겠습니다.
결과와 배운 점
배운 점과 나만의 꿀팁을 알려주세요.
과정 중에 어떤 시행착오를 겪었나요?
사용 중인 무료 AI서비스들의 한도가 다다랐을 때 갖고 있는 API가 있다면 그걸 연결해두면 계속 사용할 수 있다는 사실을 알게 됨 eg) Cursor - Claude API를 연결해두니 바로 사용할 수 있게 되었습니다.
Lovable이 더 이상 수정 요청해도 반영되지 않을 때 두 가지 방향으로 오류를 수정할 수 있는데, 그 중 하나는 '수정해줘'라고 명령하면 정말 데이터나 로직만 수정만 하고 눈에 보이게 화면에 반영하지 않았는지 확인하는 겁니다. '수정한 후 화면에 반영해줘'로 명령을 내려봅니다. 또 다른 하나는 클로드나 ChatGPT에게 코드를 추천받은 후 Lovable에 참고해서 수정해달라고 하는 겁니다. 저는 이번에 이 두 가지를 써봤는데 효과가 있었습니다.
이번에 Notion-Cluade 연동을 처음 시도해보는데 notion에 DB를 멀티로 더 생성했을 때, Notion 과 연동되는 Claude API는 하나만 생성해서 사용하고 DB ID만 바꿔서 적용하면 되는 줄 알았습니다. 초보는 예상치 못한 실수를 한 채 갑자기 계속 안 된다는 noti가 뜨니까 왜 안 되지? 하면서 헤맸는데 나중에서야 차근 차근 다시 살펴보고나서 깨닫게 되었습니다. 뭐든 직접 해봐야 알게 되는 것 같습니다.
초보는 모임에 나와서 고수들과 대화하면 몰랐던 지식을 알게 된다는 점입니다.
도움 받은 글 (옵션)
https://www.gpters.org/dev/post/create-gipeters-bookmark-function-OxpAqiba4SgWQMb