반응형 Bubble12 로그인-비로그인 상관 없이 최초 방문자에게만 팝업 띄우기 유저가 사이트를 최초 방문했을 때 팝업을 띄우고, 로그인이나 비로그인 상관없이 유저가 '다시 보지 않기'를 선택한다면 유저가 재 접속 했을 때 동일한 팝업을 띄우지 않도록 설정하는 기능입니다. 유저마다 다른 설정으로 개별 경험을 줄 수 있어 UX 설계 시 다양하게 활용할 수 있습니다 :) 1. Local storage 플러그인 설치 플러그인에서 'Local Storage' 검색 후 설치해주세요. 'Local Storage' 플러그인은 유저의 브라우저에 있는 스토리지에 데이터를 저장할 수 있게 해주는 플러그인입니다. 이걸 활용하면 로그인 - 비로그인 상태와 상관없이 유저의 브라우저 스토리지에 상태 값을 저장할 수 있게 되죠. 이 속성을 활용해 기능을 구현하는 것입니다. 2. 페이지에 Local Storag.. 2022. 6. 19. 리피팅 그룹 페이지네이션 설정하기 리피팅 그룹의 데이터 항목이 많아지면 페이지 단위(페이지네이션)로 끊어서 보여줘야 유저의 이용이 편리할 텐데요. 자체적으로 기능을 제공하지 않기 때문에 플러그인을 활용해 페이지네이션을 설정할 수 있습니다. 1. Toolbox 플러그인 설치 플러그인에서 'toolbox'를 찾아서 설치합니다. 이 Toolbox 플러그인은 이름 그대로 자바스크립트를 기반으로 한 다양한 기능을 제공하는데요. 여기서 'List of numbers'라는 기능을 활용합니다. 2. 페이지 내에 'List of numbers' 요소 삽입 툴박스 플러그인을 설치했다면 비주얼 요소에서 'List of numbers'라는 요소가 생성됩니다. 이걸 클릭해 페이지 내에 넣어주세요. 프론트에서 보여지는 것이 아니라 기능 역할만 하기 때문에 아무 .. 2022. 6. 18. Repeating Group 클릭 시 정보 수정 팝업 띄우기 리피팅 그룹을 유저가 클릭 했을 때 해당 데이터를 수정할 수 있는 팝업 띄우는 방법 리피팅 그룹은 데이터 목록을 유저에게 보여줄 수 있어 다양하게 활용하실 수 있는데요. 다음과 같이 유저가 리피팅 그룹 내 데이터를 수정할 수 있도록 하실 수 있습니다. 리피팅 그룹(폴더 리스트)에서 '구글' 폴더를 수정한다고 가정할게요. 수정 버튼을 클릭하면 위 그림과 같이 팝업이 뜹니다. Input 요소에 클릭했던 폴더의 이름인 '구글', 색상인 '화이트'가 미리 지정되어 있습니다. 이걸 '페이스북', '그린'색상으로 변경하면, 이렇게 변경됩니다. 과정을 정리하자면 다음과 같습니다. 1) 리피팅 그룹 내 데이터 클릭 2) 수정 팝업의 state 설정 (데이터 끌어오기) 3) 수정 팝업 표시 (끌어온 데이터 표시하기) 4.. 2022. 6. 9. 05. 옵션(option sets) 옵션은? 옵션은 미리 지정해놓은 정적 데이터 값입니다. 동일하게 반복되거나 예상되는 값(일종의 변수)이 있다면 그때그때 데이터를 생성하는 것보다 미리 옵션으로 지정해놓고 불러오는 것이 효율적입니다. 예를 들어 FAQ를 작성한다고 했을 때 카테고리 값을 미리 정리해둔다면 나중에 유저에게 특정 카테고리의 FAQ만 볼 수 있는 기능을 제공할 수 있겠죠. 상단 'Option sets'로 들어가 주세요. 좌측에서 'New option set'를 추가할 수 있는 영역이 있고 여기서 새 옵션을 추가하게 되면 상단 목록에 노출됩니다. 옵션을 선택하면 우측에 해당 옵션의 옵션 값을 관리할 수 있는 영역이 표시되는데요. 여기서 옵션 값을 추가하고 수정하거나 옵션 값의 속성을 설정할 수 있습니다. 속성(Attributes).. 2022. 5. 1. 04. 데이터 구조 설계 - 2) 데이터 필드 (data field) 데이터 필드란? 데이터 필드는 지정된 데이터 타입을 구성하는 요소 값입니다. 데이터를 정의하는 방법과 같습니다. 모든 데이터는 이 데이터 필드로 구성되어 있고 향후 사이트의 UI나 워크플로우를 설계할 때도 데이터 필드를 활용하게 됩니다. 데이터 필드는 또 각 필드 값의 유형을 설정할 수 있는데요. 예를 들어 '상품'이라는 데이터 타입이 있다고 가정해볼게요. 이 상품은 아마 제목, 소개, 가격, 제품 사진 등의 데이터 필드로 구성되어 있을 겁니다. 여기서 제목의 유형은 당연히 문자열(텍스트)이 되겠죠. 소개 역시 텍스트일 겁니다. 하지만 가격의 유형은 숫자, 소수점이 없기 때문에 정수(Integer)가 될 것이고 제품 사진의 유형은 이미지가 될 것입니다. 이렇게 각기 다른 유형으로 데이터 필드를 구성하면 .. 2022. 4. 30. 04. 데이터 구조 설계 - 1) 데이터 타입 (data types) 데이터 타입이란? 버블은 동적 데이터를 다루는 웹앱을 제작하는데 필요한 데이터베이스 구축을 지원합니다. 덕분에 굉장히 쉽게 데이터베이스 구조를 원하는 대로 설계할 수가 있는데요. 그러려면 가장 먼저 데이터 타입을 지정해야 합니다. 데이터 타입은 유저에게 동적으로 제공하는 데이터의 항목입니다. 예를 들어 어떤 상품을 판매하는 사이트라고 할 때, 유저에게 상품을 보여주려면 데이터베이스에 '상품'이라는 데이터 항목이 있어야 하겠죠. 그리고 그 항목을 구성하는 여러 요소(필드 값)를 지정해놓으면 각기 다른 상품을 유저에게 제공할 수 있습니다. *버블에서 새 앱을 만들면 'User'의 데이터 타입이 기본 생성됩니다. 이 'User' 타입은 삭제가 되지 않습니다. 데이터 타입을 지정했다면 상단 탭에서 'App da.. 2022. 4. 29. 이전 1 2 다음 반응형