안녕하세요. 노코드 버블을 스터디하고 있는 제이슨입니다.
1주차 숙제로 허세임 스터디장님께서 올려주신 GPT 연동 사례글을 클론하는 숙제를 내주셨는데요. 저 같은 초보자가 버블을 처음 접하면서 매우 간단한 부분이었지만 이해하기까지 시간이 많이 걸렸던 부분을 공유하고자 합니다. (저만 오래 걸렸을 수도 있습니다.)
1. 구현 내용
1.1 진행 목표
숙제 완료골프 기록 모바일 웹을 만들기 위해 DB 설계의 중요성을 인지
개발 초보자로서 DB에 대한 이해 부족
GPT API를 통해 GPT에게 DB에 설계에 대해 물어보고 설명 듣기
1.2 시간을 많이 뺏긴 부분
처음에는 이 화면만 보이다가 "회원 가입하기"를 누르면 아래 화면을 보이게 할 예정인데 Prameter에 대해 설정하는 방법에 대해 시간을 많이 허비했어요.
그래서 간단히 공유해봅니다.
1.2.1 이동할 페이지 Parameter 설정하기
1) Parameter 설정이 필요한 그룹의 Conditional 탭에서 Get data from page URL 선택
2) Parameter name > tab 입력 (tab은 Key값으로 저장됩 니다.)
그러면 우측 Conditional 창의 data 부분이 tab으로 바뀝니다.
그 후 is를 선택하고 "signup" 이부부는 본인이 설정할 Parameter 값을 직접 입력하면 됩니다.
(""는 입력 안해도 자동으로 채워줘요)
저는 회원가입 양식을 보여줄 예정이라 signup을 입력했습니다.
3) 회원 가입하기 버튼 워크플로우 설정
워크플로우에서 Go to page를 검색합니다.
Destination에서 Current page 선택
Key에는 아까 입력한 Key값인 "tab", Parameter 값인 signup을 입력
1.2.2 API연동 json 형식으로 입력
API 연동할 때 이곳은 꼭 json 형식으로 입력해야 합니다. 저는 따옴표 안붙였다가 한참 해맸습니다.
1.2.3 사용 프롬프트
우선 간단하게 입력해봤습니다.
몇가지 결과 보면서 프롬프트 수정하려고합니다.
## 역할
너는 15년차 개발자이자 노코드 플랫폼인 Bubble.io의 파트너 개발자야.
너는 버블 및 개발 초보자에게 웹 또는 앱 서비스를 만들기 위해 필요한 데이터베이스를 설계해주고, 그 데이터베이스에대해 쉽고 자세히 설명해줘야돼.
## 작동 방식
사용자가 만들고 싶은 서비스를 입력하면 아래 항목들을 하나하나 쉽게 설명해줘.
**[앱 아이디어나 기능 간단히 설명 — 예: 골프 기록 관리 시스템, 예약 시스템, 마켓플레이스, SNS 등]**
1. 이 앱을 만들기 위해 어떤 데이터 타입이 필요한지 알려줘.
2. 각 데이터 타입에 어떤 필드를 만들어야 하는지 알려주고, 각 필드의 데이터 타입도 함께 알려줘. (예: 텍스트, 숫자, 날짜, 이미지, 사용자 목록 등)
3. 데이터 타입 간의 관계는 어떻게 설정해야 하는지 설명해줘.
(예: 어떤 필드가 다른 데이터 타입을 참조해야 하는지)
4. 필드와 데이터 타입을 어떻게 이름 짓고 구성하면 나중에 헷갈리지 않는지도 알려줘.
5. Bubble에서 기본으로 제공하는 User 타입은 어떻게 활용하면 좋을지도 설명해줘.
6. 워크플로우에서 이 데이터 구조가 실제로 어떻게 쓰이는지도 간단한 예시로 보여줘.
(예: 회원가입 → 글 작성 → 예약하기 등의 워크플로우 예시 및 설명)
## 출력 방식
1. 완전 초보자 기준으로 하나하나 쉬운 말로, 예시와 함께 설명해줘.
2. 가능하다면 목록이나 표 형태로 설명해 주면 더 좋아.
3. 다른 질문 없이 바로 답변을 작성해줘.아래는 결과물입니다.
필요하신분들은 사용해보세요.
https://250323study001.bubbleapps.io/version-test?debug_mode=true
결과와 배운 점
처음에는 정말 막막했는데, 허세임 스터디장님이 올려주신 글 따라해보면서 버블의 기본적인 작동 방식이나 DB에 대해서도 조금 이해가 되니까 그래도 조금 자신감이 붙네요.
글 작성하면서 캡쳐하다가 버블에 만들어놓은 GPT연동 페이지가 날아가서 다시 만드는 바람에 갑자기 진이 빠져서 급하게 마무리합니다. (무료 버전은 히스토리 저장 기능이 없나봐요. 아무리 찾아도 안보입니다.)
간단하지만 엄청 헤매면서 만들어가며 느낀 부분이 많았는데 다 공유 드리지를 못했네요. 다음 사례에는 더 자세하게 작성해보도록 하겠습니다.
