> ## Documentation Index
> Fetch the complete documentation index at: https://statsig-4b2ff144-serverless-cloudflare.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# Build Your First Feature
> Walk through creating a feature gate, targeting audiences, and rolling out your first feature with the JavaScript SDK.
Statsig refers to feature flags as feature gates across the console and SDKs. The terms are interchangeable throughout this guide.
Once your Statsig account is ready, follow the steps below to create and test-drive a new feature gate.
Navigate to the [Feature Gates page](https://console.statsig.com/gates) and click Get Started (or Create if you already have gates).
Give the gate a clear name and description—for example, Mobile Registration with a note about the new mobile sign-up flow.
New gates default to returning false until you add targeting. Click Add New Rule, choose Operating System → Any of, and select Android and iOS. Set the pass percentage to 100% and click Add Rule, then Save.
Layer on a second rule for your team—for example Email → Contains any of with your company domain—so employees can exercise the feature regardless of device.
Head to [Project Settings → API Keys](https://console.statsig.com/api_keys) and copy the Client API key. Keep server secret keys on backends only, and use console API keys for programmatic configuration work.
Statsig supports many platforms—see [Client SDK options](/) for alternatives. This walkthrough uses the browser SDK so you can experiment directly in DevTools.
Paste the snippet below into the browser console on any site to fetch the SDK from jsDelivr:
```js theme={null}
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/@statsig/js-client@3/build/statsig-js-client+session-replay+web-analytics.min.js';
document.head.appendChild(script);
```
Replace YOUR\_SDK\_KEY with the client key from Step 4 and run:
```js theme={null}
const client = new window.Statsig.StatsigClient('YOUR_SDK_KEY', {});
await client.initializeAsync();
```
Then call:
```js theme={null}
client.checkGate('mobile_registration');
```
You should see false because the current session is not mobile and doesn’t use the employee email domain.
Enable the mobile device toolbar in Chrome DevTools.
Re-evaluate the user to pick up the new environment and re-check the gate:
```js theme={null}
await client.updateUserAsync({});
client.checkGate('mobile_registration');
```
The gate should now return true for the mobile profile.
Switch DevTools back to the desktop view and update the user with a company email:
```js theme={null}
await client.updateUserAsync({ email: 'teammate@statsig.com' });
client.checkGate('mobile_registration');
```
The gate passes again thanks to the email rule.
```js theme={null}
client.flush();
```
Open the gate’s Diagnostics tab to confirm each exposure, including the failing desktop check, mobile pass, and employee pass.
## Use the gate in production
Wrap feature logic in a gate check so only targeted users see the experience:
```js theme={null}
if (client.checkGate('mobile_registration')) {
show(mobileRegistrationPage);
} else {
show(oldRegistrationPage);
}
```
Happy feature gating!