사용자 탐색
React SDK 11.13.0 이상 버전에서만 지원합니다.
디버깅 용도로만 사용하는 것을 권장합니다.
사용자 식별자를 확인하고 A/B 테스트, 기능플래그에 강제할당 하는 방법을 설명합니다.
아래의 의존성을 추가합니다.
// [email protected] 이상일 경우
npm install @hackler/[email protected]
// [email protected] 미만일 경우
npm install @hackler/[email protected]
// [email protected] 이상일 경우
yarn add @hackler/[email protected]
// [email protected] 미만일 경우
yarn add @hackler/[email protected]
react-sdk 버전 | javascript-devtools 버전 |
---|---|
11.13.0 <= version < 11.21.0 | 1.0.1 |
11.21.0 <= version | 1.0.2 |
사용자 탐색 설정
키 | 기능 | 기본값 | 지원 |
---|---|---|---|
devTool | 사용자 탐색을 사용할 수 있도록 합니다. | undefined | 11.13.0+ |
autoOpenDevTool | 사용자 탐색 버튼이 자동으로 나타나도록 하는 옵션입니다. | false | 11.13.0+ |
devTool
에"@hackler/javascript-devtools"
에서 import한HackleDevTools
를 넣어주세요. (필수 *)autoOpenDevTool
을true
로 설정할 경우showUserExplorer
을 호출하지 않아도 자동으로 사용자 탐색 창이 나타납니다. (기본 값은false
입니다.)
기존 Hackle Client를 초기화하는 코드에 아래와 같이 옵션을 추가합니다.
import { createInstance } from "@hackler/react-sdk";
import HackleDevTools from "@hackler/javascript-devtools"
const config = {
devTool: HackleDevTools,
autoOpenDevTool: false,
};
// YOUR_BROWSER_SDK_KEY로 초기화
const hackleClient = createInstance(YOUR_BROWSER_SDK_KEY, config);
// 사용자 탐색을 나타내고 싶은 시점에 Trigger 되도록 해주세요.
hackleClient.showUserExplorer()
// 사용자 탐색 창을 닫고 싶을 경우에 Trigger 되도록 해주세요.
hackleClient.hideUserExplorer()
Production에서는
autoOpenDevTool
옵션을false
로 설정하세요.autoOpenDevTool을 true로 설정할 경우 자동으로 사용자 탐색 창이 나타납니다.
사용자 탐색 창을 나타내고 싶은 시점에
hackleClient.showUserExplorer
을 호출하는 식으로 사용하시는 것을 권장합니다.
사용자 탐색 창
화면 하단에 핵클 로고 버튼이 표시됩니다. 버튼 클릭시 설정 화면으로 진입 할 수 있습니다.
사용자 식별자 확인하기
화면 상단에서 사용자 식별자를 확인 및 복사 할 수 있습니다.
사용자 강제할당
- 화면하단에서 A/B 테스트, 기능플래그의 분배 결과를 확인할 수 있습니다.
- SelectBox 클릭 시 특정 그룹으로 강제할당 할 수 있습니다.
Reset
버튼 클릭 시 강제할당이 해제됩니다.Reset all
버튼 클릭시 모든 강제할당이 해제됩니다.- 브라우저에서 강제할당한 경우 해당 브라우저에서 분배하는 경우에만 적용됩니다. (대시보드 테스트기기에 등록되지 않습니다)
- 강제할당이 적용되지 않는경우 브라우저를 새로고침 해주세요.
![](https://files.readme.io/0ce2231-user-explorer.png)
Updated 9 months ago