mirror of
https://github.com/Unleash/unleash.git
synced 2025-09-05 17:53:12 +02:00
fix: update description
This commit is contained in:
parent
343887de5c
commit
716090a659
92
websitev2/docs/sdks/proxy-react.md
Normal file
92
websitev2/docs/sdks/proxy-react.md
Normal file
@ -0,0 +1,92 @@
|
||||
---
|
||||
id: proxy-react
|
||||
title: React proxy client
|
||||
---
|
||||
|
||||
> This library is meant to be used with the [unleash-proxy](https://github.com/Unleash/unleash-proxy). The proxy application layer will sit between your unleash instance and your client applications, and provides performance and security benefits. DO NOT TRY to connect this library directly to the unleash instance, as the datasets follow different formats because the proxy only returns evaluated toggle information.
|
||||
|
||||
# Installation
|
||||
|
||||
```
|
||||
npm install @unleash/unleash-proxy-react
|
||||
// or
|
||||
yarn add @unleash/unleash-proxy-react
|
||||
```
|
||||
|
||||
Import the provider like this in your entrypoint file (typically index.js/ts):
|
||||
|
||||
```
|
||||
import FlagProvider from '@unleash/unleash-proxy-react';
|
||||
|
||||
const config = {
|
||||
url: 'https://HOSTNAME/api/proxy',
|
||||
clientKey: 'PROXYKEY',
|
||||
refreshInterval: 15,
|
||||
appName: 'your-app-name',
|
||||
environment: 'dev',
|
||||
};
|
||||
|
||||
ReactDOM.render(
|
||||
<React.StrictMode>
|
||||
<FlagProvider config={config}>
|
||||
<App />
|
||||
</FlagProvider>
|
||||
</React.StrictMode>,
|
||||
document.getElementById('root')
|
||||
);
|
||||
```
|
||||
|
||||
To check if a feature is enabled:
|
||||
|
||||
```
|
||||
import { useFlag } from '@unleash/unleash-proxy-react';
|
||||
|
||||
const TestComponent = () => {
|
||||
const enabled = useFlag('travel.landing');
|
||||
|
||||
if (enabled) {
|
||||
return <SomeComponent />
|
||||
}
|
||||
return <AnotherComponent />
|
||||
};
|
||||
|
||||
export default TestComponent;
|
||||
```
|
||||
|
||||
To check variants:
|
||||
|
||||
```
|
||||
import { useVariant } from '@unleash/unleash-proxy-react';
|
||||
|
||||
const TestComponent = () => {
|
||||
const variant = useVariant('travel.landing');
|
||||
|
||||
if (variant.enabled && variant.name === "SomeComponent") {
|
||||
return <SomeComponent />
|
||||
} else if (variant.enabled && variant.name === "AnotherComponent") {
|
||||
return <AnotherComponent />
|
||||
}
|
||||
return <DefaultComponent />
|
||||
};
|
||||
|
||||
export default TestComponent;
|
||||
```
|
||||
|
||||
## Updating context
|
||||
|
||||
Follow the following steps in order to update the unleash context:
|
||||
|
||||
```
|
||||
import { useUnleashContext, useFlag } from '@unleash/unleash-proxy-react'
|
||||
|
||||
const MyComponent = ({ userId }) => {
|
||||
const variant = useFlag("my-toggle");
|
||||
const updateContext = useUnleashContext();
|
||||
|
||||
useEffect(() => {
|
||||
// context is updated with userId
|
||||
updateContext({ userId })
|
||||
}, [])
|
||||
}
|
||||
|
||||
```
|
28
websitev2/docs/user_guide/important-concepts.md
Normal file
28
websitev2/docs/user_guide/important-concepts.md
Normal file
@ -0,0 +1,28 @@
|
||||
---
|
||||
id: important-concepts
|
||||
title: Important Concepts
|
||||
---
|
||||
|
||||
There are some concepts it's important to understand in order to work effectively with Unleash:
|
||||
|
||||
## Activation strategies
|
||||
|
||||
Feature toggles can have multiple activation strategies. An activation strategy will only run when a feature toggle is enabled and provides a way to control WHO will get access to the feature.
|
||||
|
||||
Activation strategies compound, and every single strategy will be evaluated. If any one of them returns true, the user will receive access to the feature.
|
||||
|
||||
> Unless you add activation strategies on toggle creation, the toggle will be created with the default strategy. The default strategy says that the toggle is either 100% off or 100% on for all users. This means that any other strategies you add will have no effect. If you want to use strategies to control rollout you need to remove the default strategy.
|
||||
|
||||
[You can read more about activation strategies here.](./activation_strategy)
|
||||
|
||||
## Local evaluation
|
||||
|
||||
All our SDKs perform local evaluation of feature toggles, which means that they download the configuration from unleash and cache the configuration in memory in your application. This is done in order to avoid adding network latency to user interactions, making it unnoticable for users that you are using feature flagging, in addition to the added benefit that none of your data leaves your application - enforcing privacy by design.
|
||||
|
||||
[Read more about our unique architecture here](https://www.getunleash.io/blog/our-unique-architecture)
|
||||
|
||||
## Unleash Context
|
||||
|
||||
Since the SDKs perform local evaluation, some of the parameters needed for evaluation must be supplied through the Unleash Context. The unleash context allows you to pass in userIds, sessionIds or other relevant information that is needed in order to perform the evaluation. If, for example, you want to enable a feature for a set of specific userIds, you would need to provide the userIds in the unleash context in order for the evaluation to enable the feature.
|
||||
|
||||
[You can read more about the unleash context here.](./unleash_context)
|
@ -13,7 +13,7 @@ NOTE: This is a demo instance set up with the enterprise version. Some of the fu
|
||||
|
||||
### I want to test toggles in a client side environment
|
||||
|
||||
In order to use feature toggles on the client side you need to connect through [the unleash proxy](../sdks/unleash_proxy). The unleash proxy will provide a security and performance layer between your client application and the unleash instance. For now, you can use the proxy we have set up on the demo instance.
|
||||
In order to use feature toggles on the client side you need to connect through [the unleash proxy](../sdks/unleash-proxy). The unleash proxy will provide a security and performance layer between your client application and the unleash instance. For now, you can use the proxy we have set up on the demo instance.
|
||||
|
||||
#### Create your first toggle
|
||||
|
||||
@ -33,7 +33,7 @@ Now you can open your application code and connect through one of the proxy SDKs
|
||||
- [Javascript Proxy SDK](../sdks/proxy-javascript)
|
||||
- [iOS Proxy SDK](../sdks/proxy-ios)
|
||||
- [Android Proxy SDK](../sdks/android_proxy_sdk)
|
||||
- React
|
||||
- [React](../sdks/proxy-react)
|
||||
|
||||
Here is a connection example using the javascript proxy SDK:
|
||||
|
||||
|
@ -14,6 +14,7 @@ module.exports = {
|
||||
'Getting started': [
|
||||
'user_guide/index',
|
||||
'user_guide/quickstart',
|
||||
'user_guide/important-concepts',
|
||||
'user_guide/v4-whats-new',
|
||||
'user_guide/create_feature_toggle',
|
||||
'user_guide/activation_strategy',
|
||||
@ -36,6 +37,7 @@ module.exports = {
|
||||
'sdks/unleash-proxy',
|
||||
'sdks/android_proxy_sdk',
|
||||
'sdks/proxy-javascript',
|
||||
'sdks/proxy-react',
|
||||
'sdks/proxy-ios',
|
||||
'sdks/community',
|
||||
],
|
||||
|
Loading…
Reference in New Issue
Block a user