소개
시도하고자 했던 것과 그 이유를 알려주세요.
bubble.io 노코드로 현수막 관리시스템 웹앱만들기를 했습니다.
목적은 간단합니다. 정당현수막이 행정동별 각 2개만 설치된게 맞는지 시각화해서 관리하는 것입니다.
강남구 옥외광고물 조례에는 정당현수막 행정동별 2개만 설치하도록 제한하고 있습니다.
각 정당별 현수막의 데이터를 DB로 관리해서 지도기능을 활용해 시각적으로 구현하고자 합니다.
진행 방법
1. bubble.io 를 활용해 지도기능과 현수막 정보를 입력하는 창을 만들었습니다.
1) 우선, 현수막 정보에 입력될 정보를 입력하는 입력page를 만들었습니다. 버블의 input 엘리먼트와 드롭다운, date/timepicker 등을 활용했어요.
https://nocode2-30082.bubbleapps.io/version-test
2) 워크플러에서 등록버튼을 눌었을 때 input에 입력된 value를 각 속성에 맞는 DB로 입력되도록 create new thing action을 활용했어요.
3) 이 과정에서 데이터는 구조가 상당히 중요하다는 것을 느꼈습니다. 데이터의 속성이 일치하지 않으면 데이터가 전송되지 않기 때문입니다.
현수막의 위치(geographic address), 게시일, 종료일, icon, 정당명 등으로 위와 같이 설정
아주 많은 시행착오가 있었고 필드의 속성(예를 들면 text 또는 date 등)을 잘못입력하면 수정이 안되서 삭제후 생성해야함. 삭제하면 데이터로 같이 삭제되어서 다시 입력해야함.
2. 입력된 데이터의 위치정보를 지도에 표시하는 map 페이지를 만들었습니다.
1) 지도기능에서 맨땅에 헤딩을 좀 많이 했어요. 아~~~진짜 혼자 이것저것 만지다고 시간만 가 고,,,,안되고,,하기 싫고,,머 그러다 아이 모르겠다. 그냥 plug in 사자! 이렇게 결론!
설치 plug in
2) map box 관련 유툽자료가 있어서 이걸로 구입했어요. 일단 기본적인 기능만 구현했어요.
3) 이것도 api 입력하는 절차는 있었습니다. mapbox사이트 가서 회원가입하고 tokken 생성 등
4) 워크플러에서 add list of markers Action으로 위치정보를 입력했어요~
결과와 배운 점
1) 배운점 : 데이터 연결을 위해서는 속성이 중요하다. 데이터 타입을 같이 하지 않으면 에러가 생긴다.
2) 앞으로 할일
- 주소를 입력하면 관할동을 자동으로 찾아줬음 좋겠다
--api형태로 공공데이터 연결, 플러그인
--cvs받아서 데이터 타입에 시군구를 업로드
- 데이터 구조를 잘 설정해서 각동별로 데이터 보기, 정당별로 데이터 리피팅 그룹으로 불러오기 등 해볼게요~
3) 질문할 것 : 각 정당별로 마커를 달리하고 싶은데, 그게 잘 안됨. 현수막 정보에 필드명으로 icon 생성하고 데이터 생성했어요. 그리고 등록 워크플러에서 do a search for 현수막 정보's each item's icon으로 했는데 마커를 안불러오네요~ㅠㅠ
도움 받은 글 (옵션)
참고한 지피터스 글이나 외부 사례를 알려주세요.
유툽강좌---한국꺼는 잘 없어서 영어로 된 강의 봤더니, 버블실력보다 영어실력이 늘겠어요..^^
