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

82. Actions (중급) : 워크플로우의 실행 일반 규칙, 순착적 일관성 유지 방법, 이전 데이터 사용

by 스타트업 사업가 마르코 2023. 8. 15.
이 섹션에서는 다양한 작업을 수행하는 워크플로의 단계인 Action에 대해 설명합니다. 그리고 워크플로우의 실행 일반 규칙, 순착적인 Action 실행을 위한 일관성 유지 방법, 이전 데이터 사용방법에 대해 설명합니다.

 

(1) Action의 정의

Action은 앱에서 작업을 수행하는 것입니다. 데이터베이스 변경, 페이지에서 무언가 숨기기/표시/애니메이션 또는 다른 페이지로 이동과 같은 특정 작업을 수행하는 워크플로의 일부입니다.

 

Action은 이벤트의 결과로 발생하며 함께 workflow를 구성합니다.

Workflow = Event + Action
  • Event는 언제 할 것인지를 결정하고 Action은 무엇을 할 것인지를 결정합니다.
  • Action을 함께 연결하여 일련의 Action을 순서대로 수행할 수 있으며 각 단계는 이전 단계에서 생성된 정보에 의존할 수 있습니다. 각 단계는 특정 조건에 따라 해당 단계를 실행할지 건너뛸지를 제어하는 동적 표현식으로 제어할 수도 있습니다.

 

 

(2) Action으로 작업하기

Bubble 워크플로 편집기에서 이벤트를 클릭하여 워크플로를 만들거나 여는 즉시 Action이 표시됩니다. Action은 워크플로 내에 포함되며 이벤트를 클릭하면 표시됩니다.

 

1. Action 만들기

워크플로에 첫 번째 Action을 추가하려면 Click here to add an action 사각형을 클릭합니다. 범주로 구분된 작업 목록이 표시됩니다.

 

플러그인을 설치하거나 사용을 작업으로 설정하여 API 커넥터로 API 호출을 추가하여 앱에서 사용할 새 작업을 추가할 수 있습니다.

 

 

35. API Connector (중급) : 버블 API 커넥터 설정 및 사용, HTTP method, endpoint

이 섹션에서는 Bubble의 공식 Plugin인 API Connector(커넥터)를 다룹니다. API 커넥터는 외부 애플리케이션으로 나가는 연결(Outgoing Request)을 만들고 이를 데이터 소스로 사용하거나 작업을 트리거하는

conversion-skill.tistory.com

 

Action을 추가하거나 클릭하는 즉시 Bubble이 해당 Action에 대한 설정을 표시합니다. 다음은 데이터변경 Action의 예입니다.

Action 추가하기
Action 추가하기

위의 things to change는 변경할 데이터 소스를 지정합니다. 선택하면 풍선이 해당 데이터 유형에 사용 가능한 필드를 표시합니다. 위의 예시에서는 Static 텍스트 값을 제공하여 사용자 이름을 변경합니다.

 

2. Action의 단계를 실행하기 위한 조건 설정

워크플로는 필요한 만큼의 단계로 구성될 수 있지만 경우에 따라 이러한 단계 중 하나를 실행해야 하는지 여부를 결정하는 몇 가지 규칙을 설정해야 합니다.

 

예를 들어 사용자가 실행하려면 로그인해야 하는 워크플로가 있을 수 있습니다. 그렇지 않은 경우 오류 메시지를 표시할 수 있습니다.

 

  • 이를 위해 only when 필드를 사용합니다.
  • 이름에서 알 수 있듯이 이것은 Bubble이 조건이 참일 때만 이 작업을 실행하도록 지시합니다.
  • 조건은 주어진 조건 세트에 따라 예 또는 아니오 값을 제공하는 동적표현식입니다.

이 단계는 워크플로 또는 Action을 실행할지 여부를 결정하기 위해 동적식을 사용하여 조건을 설정하는 것에 의존합니다. 이러한 개념에 익숙하지 않은 경우 먼저 아래 문서를 읽는 것이 좋습니다.

 

23. Bubble Dynamic Expressions (중급) : 버블 동적 표현식, 버블의 핵심 표현식 알아보기, 특징 및 설정

*이 섹션에서는 Bubble에서 동적 표현식(Dynamic Expressions)을 설정하는 방법에 대해 설명합니다. (1) 동적 표현식 정의 동적 표현식(Dynamic Expressions)은 사용자 입력, 데이터베이스 업데이트 및 앱의 기

conversion-skill.tistory.com

 

3. Action이 트리거 되는 순서

참고: 워크플로는 일련의 순차적인 Action으로 만들어지지만 워크플로가 실행될 때 뒤에서 많은 일이 진행됩니다. 이로 인해 경우에 따라 일부 단계가 다른 이전 단계보다 먼저 실행될 수 있습니다.
  • 일부 워크플로는 클라이언트의 브라우저에서 실행되는 반면 다른 워크플로(예: 데이터베이스 작업)는 Bubble의 서버에서 발생해야 합니다. 일부 워크플로는 브라우저와 서버 모두에서 발생합니다.
  • 워크플로에 이러한 세 가지 범주의 작업이 혼합되어 있는 경우 브라우저와 서버에서 실행되는 항목으로 인해 트리거되는 순서가 워크플로의 순차적인 계획과 다를 수 있습니다.
  • 효율적인 처리를 위해 워크플로는 서버와 프런트 엔드 모두에서 동시에 실행됩니다. "1단계", "2단계" 등으로 레이블이 지정되어 있지만 특정 단계는 다음 단계를 시작하기 전에 이전 단계가 완료될 때까지 기다리지 않을 수 있음을 이해하는 것이 중요합니다.

 

아래 요점은 몇 가지 일반적인 권장 사항과 함께 Bubble의 워크플로 Logic에 대한 통찰력을 제공합니다.

아래 예시에서 "단계"는 순서가 중요한 경우에 사용되지만,  "단계"와 "Action"이라는 용어는 같은 의미로 사용된다는 점을 주의해야 합니다.

 

1) 워크플로 실행 방법에 대한 일반 규칙:

  • 프런트엔드 워크플로 Action은 순서대로 실행되지만 다음 Action은 트리거 전에 이전 Action이 완료될 때까지 기다리지 않습니다.
  • 백엔드 워크플로는 단계와 별개로 워크플로가 트리거 되는 즉시 시작됩니다. 예를 들어 "Schedule API Workflow'" 작업은 워크플로 작업 시퀀스에서 마지막에 배치되더라도 워크플로가 트리거되는 즉시 시작됩니다.
  • Custom event(맞춤 이벤트)는 병렬이 아닌 순차적으로 실행됩니다. 워크플로 1이 워크플로 2를 시작하는 사용자 지정 이벤트를 트리거하는 경우 워크플로 1의 나머지 작업이 실행되기 전에 워크플로 2가 완료됩니다.
  • 검색이 항상 새 데이터로 즉시 업데이트되는 것은 아닙니다. 따라서 새 항목을 만든 다음 검색을 통해 검색하려고 하면 작동할 수도 있고 작동하지 않을 수도 있습니다. 이것에 의존해서는 안됩니다.

 

2) 워크플로의 순차적 일관성을 유지하는 데 도움이 되는 방법:

  • 워크플로 트리거(예: 버튼)가 조건에 따라 여러 결과를 가질 수 있는 경우 가능한 모든 작업이 포함된 하나의 워크플로를 만들고 조건을 Action수준에 배치하는 대신 여러 워크플로를 만들고 조건을 워크플로 수준에 배치하는 것이 더 안전합니다.
  • 두 가지 Action이 있는 워크플로에서 2단계가 1단계에서 조작된 데이터에 따라 검색 기반 조건을 사용하는 경우 1단계를 사용자 지정 이벤트(Custom event)로 구현하여 2단계로 이동하기 전에 완료되었는지 확인해야 합니다.
  • 워크플로의 다른 단계 후에 백엔드 워크플로를 트리거해야 하는 경우 먼저 와야 하는 단계 뒤에 배치된 사용자 지정 이벤트(Custom event)에서 구현해야 합니다.
  • 한 단계에서 다른 단계로 데이터를 사용하는 가장 안전한 방법은 검색 대신 "Result of step X(X단계 결과)" 연산자를 사용하는 것입니다.
  • 다음 단계로 이동하기 전에 워크플로가 끝날 때까지 Action이 대기하는 명시적인 기능을 제공하지 않습니다. 그러나 "add a pause before next action" Action을 사용하는 것이 일반적으로 효과적인 해결 방법입니다.

 

(3) 이전 단계의 데이터 사용 : Result of step 명령어

Action이 동일한 워크플로의 이전 단계를 참조해야 하는 경우가 있습니다.

직접적이지 않은 방법으로 참조하여 이 작업을 수행하면 변경 사항이 아직 업데이트할 시간이 없었고 이후 단계에 반영되지 않을 위험이 있습니다. 이를 설명하기 위해 다음 예시를 살펴보겠습니다.

 

  • Product라는 데이터 type에 일부 정보를 저장하기 위해 Make changes to a thing을 사용하고 있다고 가정해 보겠습니다.
  • 이후 단계에서 Do a search for를 사용하고 첫 번째 항목 연산자로 범위를 좁혀 동일한 product를 참조합니다.

이전 단계 데이터 사용하기 예시
이전 단계 데이터 사용하기 예시

 

  1. 이 예시에서는 먼저 product 이름을 변경합니다.
  2. 그런 다음 Set state of an element를 사용하여 해당 이름을 name state에 저장합니다.

 

  • 이 경우 Do a search for가 데이터를 찾고 반환할 때까지 첫 번째 Action(데이터 변경)이 완료될 시간이 아직 없을 위험이 있습니다. 따라서 name state는 변경되기 전에 product의 이름을 저장할 수 있습니다.
이를 방지하기 위해 Result of step(1단계 결과) 명령어와 그것의 데이터 소스를 사용할 수 있습니다. 
검색을 수행할 필요가 없을 뿐만 아니라 이 단계를 사용할 때 Bubble은 정보에 의존하는 이후 단계가 실행되기 전에 1단계에서 수행된 작업이 완료되도록 합니다.