이 섹션에서는 Custom Event(사용자 정의) 이벤트에 대해 다룹니다. 이 문서에서는 프런트엔드 사용자 지정 이벤트를 다룹니다. 백엔드에서 사용할 수 있는 사용자 지정 이벤트도 있습니다.
- 워크플로 중복을 방지하기 위해 다른 워크플로에서 트리거할 수 있는 이벤트일 뿐만 아니라 재사용 가능한 element 내에서 트리거 될 수 있습니다.
- Custom Event(사용자 지정 이벤트)는 Custom Event 트리거 작업을 통해서만 트리거할 수 있는 이벤트입니다.
- 즉, 다른 워크플로에 의해 트리거되어야 합니다. 워크플로 내부의 Action단계에서 참조할 수 있는 매개 변수를 수락할 수 있습니다.
- Resuable element(재사용 가능한 요소)에서 Custom Event트리거 Action을 사용하여 동일한 페이지 또는 현재 작업 중인 페이지에 직접 배치된 Resuable element(재사용 가능한 요소) 내부에 있는 Custom Event를 트리거할 수 있습니다.
(1) Custom Event란?
Custom Event (사용자 정의 이벤트)는 몇 가지 유용한 특징이 있습니다.
1. 반복 작업 피하기
Cusotm event(사용자 지정 이벤트)는 페이지의 어디에서나 호출할 수 있으므로 워크플로를 복제할 필요가 없습니다.
- 예를 들어 문서를 처리하는 애플리케이션이 있다고 가정해 보겠습니다. 같은 기능을 하는 두 개의 '저장'버튼이 다른 곳에 있습니다.
- 파일 > 저장 >에 하나의 저장 메뉴가 있고, 다른 하나는 도구 모음의 아이콘에 저장 아이콘이 있습니다. 둘은 정확히 같은 일을 합니다. 입력 필드의 내용을 데이터베이스에 저장합니다.
각각 다른 두 개의 워크플로를 만들어서 문서를 저장하는 대신, 문서를 저장하는 데 필요한 Action을 Cusotm event(사용자 지정 이벤트)에 배치하고 두 위치에서 해당 워크플로를 트리거할 수 있습니다.
2. 일관성 유지 및 미래 변화에 대비
Cusotm event는 애플리케이션에서 발생하는 일을 표준화하는 데 도움이 됩니다.
- 예를 들어 팝업창을 사용하여 “변경 사항이 저장되었습니다.” 와 같은 메시지를 사용자에게 표시한다고 가정해 보겠습니다.
- Cusotm event를 사용하여 해당 팝업을 표시하면 메시지가 무엇이든 상관없이 동일한 형태, 동작을 보장할 수 있습니다.
- 나중에 팝업에서 벗어나고 대신 Alert 요소를 사용하기로 결정한 경우 단 하나의 워크플로우에서 해당 변경을 수행할 수 있으며 페이지 전체에서 적용, 대체됩니다.
3. Resuable element에서 워크플로 트리거
Resuable element(재사용 가능한 요소) 내부에 Custom event를 배치하면 해당 Resuable element의 부모에서 해당 워크플로를 트리거할 수 있습니다.
- 예를 들어 index 라는 페이지가 있고 해당 페이지에 popup-message라는 Resuable element를 배치한 경우 index 페이지에서 popup-message 내부의 Custom event를 트리거할 수 있습니다.
참고: Custom event의 워크플로우 트리거는 상위 페이지에서 Resuable element(재사용 가능 요소)의 하위 요소까지 한 방향으로만 작동합니다.
(2) Cusotm event 만들기
- Cusotm event를 만들려면 먼저 워크플로 편집기로 이동하고 이벤트를 추가하려면 “Click here to add an event”를 클릭합니다. (하단 사진 참고)
- 하단의 드롭다운 메뉴에서 Cusotm 를 선택하고 Create a Cusotm event…를 선택합니다.
- 일부 매개변수(parameter)를 할당할 수 있는 워크플로우 속성으로 이동합니다.
이 예시에서는 워크플로우를 사용하여 사용자 와 이름을 매개변수로 사용하여 특정 사용자의 이름을 변경합니다.
- 먼저 이벤트에 이름을 지정합니다. 이름은 작동 방식에 영향을 미치지 않지만 쉽게 알아볼 수 있도록 하는 데 유용합니다.
- 그런 다음 Add a new parameter 버튼을 클릭하여 두 개의 매개변수를 설정합니다.
- 매개변수를 사용하면 모든 종류의 데이터를 워크플로에 전달하고 해당 정보를 해당 워크플로 내부의 작업에 사용할 수 있습니다.
- 먼저 user(사용자)를 전달합니다. 이름을 변경하려는 사용자입니다.
- 그런 다음 text(텍스트)를 전달합니다. 이것은 사용자에게 부여될 새 이름입니다.
이제 user와 text라는 두 가지 Parameter를 허용하는 Custom event가 만들어졌습니다.
다음으로 Action에 있는 항목을 참조해 보겠습니다.
- 이벤트 박스 하단의 Click here to add an Action을 클릭하고 Make changes to a thing action을 추가합니다.
- 변경할 항목 에서 첫 번째 매개변수에 지정한 이름인 user를 선택합니다.
- 그런 다음 사용자의 이름 필드를 선택하고 두 번째 매개변수의 이름인 text로 설정합니다.
- 이러한 방식으로 사용자 이름을 매개 변수로 요청하여 사용자 이름을 변경할 수 있는 Custom event를 설정했습니다.
앱의 주요 워크플로에 대한 Custom event를 설정하면 일관되게 작동하고 앱 전체에서 중복되지 않도록 할 수 있습니다.
(3) Cusotm event 예약
Cusotm event 예약 작업을 사용하고 이벤트가 트리거되기 전에 몇 초의 지연 시간을 제공하여 특정 시간에 실행되도록 예약할 수도 있습니다.
- Cusotm event 예약은 클라이언트측 작업이므로 페이지가 닫히면 실행되지 않습니다.
- 사용자가 앱을 닫은 경우에도 실행되도록 워크플로를 예약하려면 서버 측 API 워크플로를 사용할 수 있습니다.
- 서버 측 API 스케쥴은 하단의 글 참고
29. API Workflow Scheduler (중급) : API워크플로우 스케쥴러 설정 주의사항, 버블의 자동수행 일정, API
이 글에서는 워크플로를 보고, 일시 중지하고, 삭제할 수 있는 스케줄러에 대해 설명합니다. 예약된 워크플로( API 워크플로라고도 함 )는 특정 시간에 Bubble 서버에서 실행되도록 예약된 워크플
conversion-skill.tistory.com
(4) FAQ: Cusotm event
1. triggering a custom event와 scheduling a custom event 차이 (워크플로우 비동기 설정)
1) 질문: Cusotm event를 그냥 트리거하는 것과 0초 지연으로 Cusotm event가 발생하도록 예약하는 것 사이에 차이가 있습니까?
2) 답변: 예, 있습니다.
3) 설명
triggering a custom event 작업이 실행될 때, 몇 가지 추가 작업이 있는 상위 워크플로가 있다고 가정해 보겠습니다. 부모가 해당 트리거 작업을 실행하면 부모는 일시 중지하고 Cusotm event가 완료될 때까지 기다렸다가 이후에 설정되어 있는 작업을 실행합니다. 이것은 일정 부분 편리한 부분이 있습니다. Cusotm event가 상위 워크플로에서 이전 작업에서 발생한 작업들을 볼 수 있기 때문입니다.
반대로 Cusotm event가 지연 0초로 scheduling a custom event로 예약하면 해당 Cusotm event가 상위 워크플로의 나머지 부분과는 별도로 병렬로 실행될 수 있습니다.
2. Cusotm event는 어떻게 실행되나요?
- 위에 1번 질문에서 설명했듯이 다른 워크플로 내에서 Cusotm event가 트리거될 때마다 워크플로는 해당 지점에서 중지되고 완료될 때까지 Cusotm event를 실행한 다음 "상위" 워크플로의 다음 작업으로 이동합니다.
- 이를 살펴보면 Cusotm event가 트리거되는 방식의 일부를 제어할 수 있습니다.
- 아래 링크에서 워크플로가 트리거되는 방식에 대해 자세히 알아볼 수 있습니다.
Actions (중급) : 워크플로우의 실행 일반 규칙, 순착적 일관성 유지 방법, 이전 데이터 사용
