Skip to content

Commit

Permalink
update readme to v2 based on documentaion (#31)
Browse files Browse the repository at this point in the history
* update readme to v2 based on documentaion

* Grammarly update

* Update based on docs review

* update gifs
  • Loading branch information
novalisdenahi authored Dec 10, 2024
1 parent 9861aa9 commit e272c55
Show file tree
Hide file tree
Showing 4 changed files with 39 additions and 29 deletions.
68 changes: 39 additions & 29 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
# ConfigCat Feature Flags extension for Visual Studio Code
ConfigCat Visual Studio Code extension to manage feature flags from Visual Studio Code.
ConfigCat Visual Studio Code extension to manage feature flags from Visual Studio Code.

Connect your ConfigCat Product and Config to your Visual Studio Code Workspace. Find your Feature Flag's usages in your code easily.
Turn features On / Off right from VSCode. You can also easily modify the linked flags to edit or add new Targeting or Percentage Rules.

## About ConfigCat
ConfigCat is a hosted feature flag service: https://configcat.com. Manage feature toggles across frontend, backend, mobile, desktop apps. Alternative to LaunchDarkly. Management app + feature flag SDKs.
ConfigCat is a hosted feature flag service: https://configcat.com. Manage feature toggles across frontend, backend, mobile, and desktop apps. Alternative to LaunchDarkly. Management app + feature flag SDKs.

## Feature overview

<img src="resources/help/usage.gif" alt="Usage of ConfigCat Feature Flags Visual Studio Code Extension" width="100%"/>

### List of Features
- Turn features On / Off right from Visual Studio Code.
- Add Targeting or Percentage Rules from Visual Studio Code.
- Find Feature Flag usages in your code.
Expand All @@ -19,60 +19,70 @@ ConfigCat is a hosted feature flag service: https://configcat.com. Manage featur
- Connect a Config to your Workspace.
- Open a Config on ConfigCat Dashboard.

<img src="resources/help/ff_setting_view.gif" alt="Usage of ConfigCat Feature Flags Visual Studio Code Extension" width="100%"/>  

## Install extension
### Visual Studio Code Marketplace
1. Open [ConfigCat Feature Flags Extension](https://marketplace.visualstudio.com/items?itemName=ConfigCat.configcat-feature-flags) at Visual Studio Marketplace.
### Install from Visual Studio Code Marketplace
1. In the Visual Studio Marketplace, open the [ConfigCat Feature Flags Extension](https://marketplace.visualstudio.com/items?itemName=ConfigCat.configcat-feature-flags).
1. Click on the Install button.
1. Configure extension (see below)

### or within Visual Studio Code
1. Search for ConfigCat Feature Flags at the Extensions page.
### Install within Visual Studio Code
1. In Visual Studio Code, open the Extensions page, and search for ConfigCat Feature Flags.
1. Click on the Install button.
1. Configure extension (see below).

### or install from VSIX file
1. Open [ConfigCat Feature Flags Extension](https://marketplace.visualstudio.com/items?itemName=ConfigCat.configcat-feature-flags) at Visual Studio Marketplace.
### Install from VSIX file
1. Visual Studio Marketplace, open the [ConfigCat Feature Flags Extension](https://marketplace.visualstudio.com/items?itemName=ConfigCat.configcat-feature-flags).
1. Click on the Download Extension link.
1. Click on the More Actions icon on the Extensions page in Visual Studio Code and select Install from VSIX...
1. Configure extension (see below).

## Configure extension
### Authentication

<img src="resources/help/auth.gif" alt="Installation of ConfigCat Feature Flags Visual Studio Code Extension" width="100%"/>

1. Get your ConfigCat Public API credentials from [ConfigCat Dashboard/Public Management API credentials](https://app.configcat.com/my-account/public-api-credentials).
1. Authenticate ConfigCat in Visual Studio Code by
- clicking on the ConfigCat Feature Flags icon on the Activity Bar and clicking on any of the Authenticate buttons.
- or running the `ConfigCat - Log In` command from the Command Palette.
    - clicking on the ConfigCat Feature Flags icon on the Activity Bar and clicking on any of the Authenticate buttons.
    - or running the `ConfigCat - Log In` command from the Command Palette.

<img src="resources/help/auth.gif" alt="Installation of ConfigCat Feature Flags Visual Studio Code Extension"  width="100%"/>  


### Advanced
If you are trying to use the ConfigCat Feature Flags extension for Visual Studio Code with a `dedicated hosted`/[on-premise](https://configcat.com/on-premise/) ConfigCat instance, you can specify your custom urls by executing the `Preferences: Open Workspace Settings` command from the Command Palette and search for `Extensions/ConfigCat` or clicking the manage button on the ConfigCat Feature Flags extension's page. Important settings:
- `Public Api Base URL`: the base url for the ConfigCat Public Management Api. Defaults to: https://api.configcat.com.
- `Dashboard Base URL`: the base url for ConfigCat Dashboard. Defaults to: https://app.configcat.com.

## Usage
### ConfigCat Feature Flags Views
The ConfigCat Feature Flags Views can be opened by clicking on the ConfigCat Feature Flags icon on the Activity Bar. It consists of 3 different view:
#### Products & Configs View
On the Products & Configs View you can:
This section is for you if you use a `dedicated hosted`/[on-premise](https://configcat.com/on-premise/) ConfigCat instance. In that case, you can specify your custom ConfigCat URLs in Visual Studio Code. You can do that by executing the `Preferences: Open Workspace Settings` command from the Command Palette and searching for `Extensions/ConfigCat` or clicking the manage button on the ConfigCat Feature Flags extension's page. Important settings:
   - `Public Api Base URL`: the base URL for the ConfigCat Public Management API. Defaults to: https://api.configcat.com.
   - `Dashboard Base URL`: the base URL for ConfigCat Dashboard. Defaults to: https://app.configcat.com.

## Usage of ConfigCat Feature Flags Views
The ConfigCat Feature Flags Views can be opened by clicking the ConfigCat Feature Flags icon on the Visual Studio Code's Activity Bar. There are three different views.

Check out the [documentation] (https://configcat.com/docs/integrations/vscode/) to learn more about the Views and the ConfigCat Visual Studio Code extension.


### Products & Configs View
Manage your products and configs on the Products & Configs View by performing the following actions:
- View all of your Products & Configs.
- Create Configs under a Product.
- Connect a Config to your current Workspace.
- Open your Configs on the ConfigCat Dashboard.

#### Feature Flags & Settings View
After you successfully connected a Config to your Workspace, from the Feature Flags & Settings View you can:
<img src="resources/help/prod_config_view.gif" alt="Usage of ConfigCat Products & Configs View"  width="100%"/>  

### Feature Flags & Settings View
After you successfully connect your ConfigCat Config to your Visual Studio Code Workspace, open the Feature Flags & Settings View and:
- Turn features On / Off right from Visual Studio Code.
- Add Targeting or Percentage Rules from Visual Studio Code.
- View or Update your Feature Flag's value.
- View the connected Config's Feature Flags.
- Create new Feature Flags.
- Copy a Feature Flag's key to clipboard.
- Copy a Feature Flag's key to the clipboard.
- Find your Feature Flag's usages in your code.

#### Help & Feedback View
The Help & Feedback view provides you some quick links to open ConfigCat's Documentation, ConfigCat's Dashboard and gives you the opportunity to report any issues.
<img src="resources/help/ff_setting_view.gif" alt="Usage of ConfigCat Feature Flags and Settings View"  width="100%"/>  

### Help & Feedback View
The Help & Feedback view provides quick links to open ConfigCat's Documentation and Dashboard and allows you to report issues.

## License
[MIT](https://raw.githubusercontent.com/configcat/vscode-extension-configcat/main/LICENSE)
Expand Down
Binary file added resources/help/ff_setting_view.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added resources/help/prod_config_view.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed resources/help/usage.gif
Binary file not shown.

0 comments on commit e272c55

Please sign in to comment.