본문 바로가기
버블 개발/중급

72. Option SET (중급) : 버블에서 옵션 세트 구성, 사용하기, 서로 다른 옵션 연결, 옵션사용 예시

by 스타트업 사업가 마르코 2023. 8. 8.
이 섹션에서는 데이터베이스와 유사한 구조로 옵션 리스트를 저장하는 데 사용되는 옵션 세트(Option SET)에 대해 설명합니다. 사용자에게 옵션세트는 일반 데이터 보다 훨씬 빠르게 보여집니다.

 

(1) 옵션 세트(Option SET)의 정의

옵션 세트를 사용하면 데이터베이스를 사용하지 않고 데이터베이스와 유사한 구조로 다양한 유형의 정적 옵션을 설정할 수 있습니다.
  • 이는 요일, 결혼 여부, 색상, 국가 등 빠르게 로드하고 거의 업데이트되지 않는 데이터와 같은 정보를 저장하는 데 유용합니다.
  • 옵션 집합을 사용하여 정적 옵션을 저장하고 앱에서 사용할 수 있습니다.

 

옵션 세트는 애플리케이션을 구성하는 JavaScript 파일의 일부로 다운로드됨을 의미하는 애플리케이션 소스 코드의 일부가 됩니다.

  • 따라서 데이터베이스 조회가 필요하지 않으며 앱의 새 버전을 배포할 때까지 사용자의 장치에 캐시 되어 빠르게 로드되고 가벼워집니다.
  • 이것은 또한 사용자가 옵션 세트를 추가, 편집 또는 삭제할 수 없으며 Live에서 옵션을 사용할 수 있게 되기 전에 앱을 다시 배포해야 함을 의미합니다.
  • 데이터베이스와 달리 옵션 세트는 암호화되지 않으며 애플리케이션 소스 코드의 일부가 됩니다. 그러므로 옵션 세트에는 보안에 민감한 정보가 포함되어서는 안 됩니다.

 

(2) 옵션 세트 구성 방식

옵션 세트는 이름에서 알 수 있듯이 옵션을 포함하는 세트입니다. 
각 세트에 데이터 유형의 필드와 유사한 속성 목록을 추가할 수 있습니다.

 

: 속성은 다음 유형 중 하나로 설정할 수 있습니다.

  • text (텍스트)
  • number (숫자)
  • date(날짜)
  • date interval(날짜 간격)
  • yes / no
  • file(파일)
  • image(사진)
  • geographic address(지리적 주소)
  • 다른 옵션 세트
 
 
 
 

요약하면 각 옵션 세트는 위 유형 중 하나의 동일한 속성을 공유하는 옵션 모음으로 구성됩니다.

  • 데이터 유형과 마찬가지로 옵션 세트를 서로 연결할 수 있습니다.
  • 예를 들어 State 및 City라는 두 개의 옵션 세트를 설정하고 State 옵션 세트에 연결되는 City에 속성을 생성할 수 있습니다.(아래 참고)

옵션세트 설정
옵션세트 설정

위의 예시에서 왼쪽(1)에 옵션 세트가 표시되고 오른쪽(2)에 해당 옵션 세트에 대한 속성(Attributes)이 표시됩니다.

  • Display 속성은 세트의 각 옵션을 식별하는 기본 제공 텍스트 필드입니다. (여기서는 State 추가)
  • Display속성의 값이 고유할 필요가 없지만 나중에 Display 값으로 옵션을 필터링해야 하는 경우에 값을 식별하려면 고유한 값인지 확인하는 것이 좋습니다. 중복 값이 있으면 원하는 결과를 얻지 못할 수 있습니다.

 

(3) 옵션 세트 생성

  1. 새 옵션 세트를 만들려면 먼저 왼쪽의 DATA > Option set으로 이동합니다.
  2. 왼쪽의 목록은 비어 있고 New option set 만 표시됩니다.
  3. 새 세트를 만들려면 이름을 입력하고 Create를 클릭합니다.
  4. 새 옵션 세트(예: State )를 만든 후 해당 세트에 속성(attribute)을 설정할 수 있습니다.

대부분의 경우 기본 내장된 Display 속성을 사용하여 각 옵션의 기본 식별자를 저장할 수 있습니다.

  • 예시로  Massachusetts와 같은 주의 이름을 지정할 수 있습니다.
  • 필요한 만큼 속성을 생성할 수 있습니다.
  • 예를 들어 주 코드(MA)를 포함하는 두 번째 텍스트 속성을 추가할 수 있습니다.

 

1. 옵션 추가

먼저 옵션 세트를 만들고 여기에 필요한 속성을 추가한 후 옵션을 추가할 수 있습니다. (혹은 기본 속성 display에 추가)

  • City와 같은 옵션 세트에서 옵션은 보스턴 및 워싱턴과 같이 나열하려는 다른 도시입니다.
  • 새 옵션을 만들려면 추가할 옵션 세트를 선택하고 New option필드에 이름을 입력한 다음 Create를 클릭합니다.
  • 입력한 이름은 해당 옵션의 Display필드에 기본적으로 저장됩니다.

기본옵션 추가
기본옵션 추가

 

2. 속성 편집

옵션 집합의 속성(attribute)을 편집하려면 목록에서 옵션 세트 옆에 있는 Modify Attribute 링크를 클릭합니다.

  • 이것은 하나 이상의 옵션을 생성할 때까지 표시되지 않습니다.
  • 위의 예시에서 우리가 만든 도시를 주에 할당할 수 있습니다.
  • 두 개를 연결하는 방법은 아래 옵션 세트 연결을 참조하세요

 

3. 옵션 세트 연결

  • 둘 중 하나 또는 둘 다에 속성(attribute)을 설정하고 하나를 다른 하나에 반영하여 데이터 유형과 마찬가지로 옵션 세트를 연결할 수 있습니다.
  • City라는 옵션 집합을 만들면 해당 도시를 State Option 집합에 연결할 수 있습니다.

attribute type (속성 유형) 고르기
attribute type (속성 유형) 고르기

위의 예시에서 다음과 같이 둘을 연결합니다.

  1. City 옵션 세트에서 Attribute Create 버튼 클릭
  2. 사용 가능한 유형 목록에서 State 옵션 세트선택

데이터 유형과 마찬가지로 속성을 List로 설정할 수도 있지만 여기 예시에서는 필요하지 않습니다.

  • 둘이 연결되면 이를 사용하여 옵션 세트 목록을 필터링하거나(예: 매사추세츠 주의 모든 도시 표시) 페이지 요소(예: Boston - Massachusetts를 표시하는 텍스트 요소)에 정보를 표시할 수 있습니다.

 

(4) 옵션 세트 사용

데이터 유형과 달리 옵션 세트는 ‘검색’으로 찾지 않습니다.
  • 옵션 세트는 모두 페이지 로드 시 로드되며 필요에 따라 element 및 워크플로우에서 참조할 수 있습니다.

 

1. element의 데이터 소스로 사용

: 아래의 예시에서는 옵션 세트를 사용하여 드롭다운 요소에 도시 목록을 표시합니다.

옵션 세트 사용법
옵션 세트 사용법

 

  1. Placeholder로 Pick a city를 드롭다운 목록으로 설정했습니다.
  2. Choice Style(선택 스타일)에서 데이터 소스를 정의할 수 있는 동적 선택(Dynamic choices)을 선택합니다.
  3. Type of choices (선택 유형)에서 옵션 세트 Cities를 선택합니다.
  4. Choices source에서 표시할 목록을 정의합니다. 데이터 유형과 옵션 세트의 차이점에 유의하십시오. 옵션을 검색하지 않고 단순히 All cities를 선택하여 Bubble이 모든 옵션을 로드하도록 지시합니다. 결과를 필터링하려면 All Cities:filtered와 같이 데이터 소스 뒤에 : Filtered 연산자를 적용할 수 있습니다. 예를 들어, 해당 필터에서 State 특성별로 도시를 필터링하는 것과 같은 제약 조건을 배치할 수 있습니다.
  5. Option caption(옵션 캡션 설정)에서 드롭다운에서 옵션의 캡션(보여줄 이름)으로 사용할 속성을 설정합니다. 이 예시에서는 Display 속성에 도시 이름을 저장했습니다. 예를 들어, 표현식을 확장하여 도시와 주를 표시하도록 확장할 수도 있습니다. 

2. 표현식에서 사용

: 표현식에서 옵션 세트를 데이터 소스로 사용한 다음, 연산자를 사용하여 결과를 필터링하거나 조작할 수도 있습니다.

표현식에서 옵션사용하기
표현식에서 옵션사용하기

 

위의 스크린숏에서는 드롭다운 요소에 조건식을 설정하고 있습니다.

 

옵션 세트를 참조하려면 다음을 수행하십시오.

  1. 드롭다운 상단에 표시되는 옵션 목록에서 Boston을 선택할 수 있습니다. Bubble은 드롭다운 값 (도시로 설정됨)을 참조하기 때문에 옵션 세트가 City(도시)라는 것을 알고 있습니다.
  2. Get an option (옵션 가져오기)을 사용하여 모든 옵션 집합에 접속하고, 연산자를 사용하여 올바른 값을 찾을 수 있습니다.

 

(5) 옵션 세트 FAQ

 

1. 옵션 세트와 데이터베이스 데이터 유형의 주요 차이점은 무엇입니까?

 Option sets ( 옵션 세트 )
 Data types ( 데이터 유형 )
 앱 코드베이스의 일부이며 사용자 기기에 저장됩니다.
 앱 데이터베이스의 일부이며 매번 Bubble의 서버에서 가져와야 합니다.
 암호화되지 않았으며 민감한 정보를 포함해서는 안 됩니다.
 암호화되어 개인 데이터를 저장할 수 있습니다.
 개인 정보 보호 규칙에 의해 보호되지 않습니다.
 개인 정보 보호 규칙에 의해 보호됩니다.
 다른 옵션 세트에 연결할 수 있습니다.
 다른 데이터베이스, 옵션 세트에도 연결할 수도 있습니다.
 데이터 유형에 연결할 수 없습니다.
 다른 데이터 유형에 연결할 수 있습니다.
 앱 사용자가 편집할 수 없습니다.
 앱 사용자가 편집할 수 있습니다.
 변경 사항을 표시하려면 배포해야 합니다.
 동적이며 모든 변경 사항을 즉시 볼 수 있습니다.
 식에서 직접 참조할 수 있습니다.(예: 검색할 필요 없이 Boston 옵션 참조).
검색 또는 다른 데이터 유형의 필드를 통해서만 참조할 수 있습니다.
요약하면 옵션 세트는 앱 개발자만 변경할 수 있는 안전하지 않은 정적인(static) 값이고 데이터 유형은 액세스 권한이 있는 모든 사용자가 변경할 수 있는 안전한 동적 값(dynamic )입니다.

 

2. Bubble은 페이지에서 사용되는 '옵션 세트'만 다운로드합니까?

모든 옵션 세트는 모든 페이지에 다운로드됩니다.

  • (또는 파일이 이미 사용자 장치에 다운로드된 경우 캐시 된 파일이 사용됨)

 

이는 다음의 두 가지를 의미합니다.

  • 많은 데이터를 다운로드하지 않으려면 옵션 세트 모음이 너무 커지면 안 됩니다.
  • 앱의 소스 코드 파일의 일부이므로 페이지에서 사용하지 않는 경우에도 옵션 세트에 민감한 정보를 저장하면 안 됩니다.

 

3. 옵션 세트는 어떻게 검색합니까?

데이터 유형과 동일한 방식으로 옵션 세트를 검색하지 않습니다.

  • 옵션 세트는 데이터베이스의 일부가 아니고 사용자의 장치에 다운로드되었기 때문입니다.
  • 옵션 집합을 나열 및 필터링하거나 검색할 필요 없이 하나의 옵션을 직접 참조할 수 있습니다.
  • 옵션의 필터링은 사용자기기에서 즉시 필터링됩니다.