소개
bubble.io 노코드로 현수막 관리시스템 웹앱만들기를 했습니다.
목적은 간단합니다. 정당현수막이 행정동별 각 2개만 설치된게 맞는지 시각화해서 관리하는 것입니다.
강남구 옥외광고물 조례에는 정당현수막 행정동별 2개만 설치하도록 제한하고 있습니다.
각 정당별 현수막의 데이터를 DB로 관리해서 지도기능을 활용해 시각적으로 구현하고자 합니다.
사실 버블을 선택한 이유는 제가 개발은 잘 모르고 경험도 없어서 버블은 시각적인 요소가 강해서 프로그램 개념 잡기, 비교적 쉽게 프론트, 백엔드의 개념을 이해할 수 있기 때문입니다.
제가 이해한 내용입니다
✅ 프론트엔드 = 디자인 탭 → 화면을 만들고, 사용자 경험(UX)을 설계하는 부분
✅ 백엔드 = 데이터 + 워크플로우 탭 → 데이터를 저장하고, 로직(기능)을 처리하는 부분
진행 방법
저번에 개발한 내용에 이어서 추가한 기능은,
ㅁ map 화면에 행정동별 현수막 갯수 넣은거
Google지도에서 위치 위치를 보여주는지도
한국 위치의 위치를 보여주는지도
ㅁ map 화면에 정당 클릭했을 때 색깔 바꾸는거 자세히 설명
위치의 위치를 보여주는지도
VPS 설정 페이지의 스크린 샷
Google지도에서 위치 위치를 보여주는지도
중국어 텍스트가 강조된 Google 문서 문서 페이지의 스크린 샷
위치의 위치를 보여주는지도
ㅁ 한글주소 입력된거 : 이건 잘 모르겠음(버블신이 도와준거)
ㅁ api 불러오기 한거/행정동 데이터 불어온거-----------여기부터 gpt에게 본격 질문 시작
<gpt 0-3 mini, web키고, bubble.io gpts>
Adobe Adobe Adobe Adobe Adobe의 스크린 샷
결과와 배운 점
api 연동에 대해서 배웠고, 무엇보다 어마어마한 팁 : gpts bubble에 질문해서 계속 답을 찾아내고 오류를 수정하는 것입니다.
ㅁ 질문내용 : api연동이 안됩니다. 파라미터 개념 설명해주시면 좋겠습니다.
한국 TV 채널 웹 사이트의 스크린 샷
ㅁ 향후계획
1. 핸드폰으로 봤을때 배치를 좀 이쁘게 하고 싶다.
2. 지도에 당별로 클릭하면 소팅되어서 표식되도록 하겠습니다.
