The React library for Configly: the modern config/static data key/value store.
Configly is the place software developers put their static / config data—like copy, styling, and minor configuration values. They can then update that data directly from https://www.config.ly without having to wait for a deploy process / app store review. Their app or webapp receives the data near instantly. Non-technical folks themselves can publish changes freeing developers to focus on hard software problems and not copy tweaks.
On the backend, Configly provides a read-optimized static-data key/value store built with the aim of being low-latency, and high-availability. The client libraries are made to be dead-simple, lean, and efficient (via enhancements like caching). There is a fancy web UI called the Configulator for setting and updating the configs as well as seeing things like change history. Configly is built for modern software development.
There are a host of other benefits to using Configly ( such as ensuring you do not have data duplicated across clients, reducing load on your primary DB, and better tolerance for traffic spikes), read more about the benefits at Configly.
- API to fetch Strings, JSON Blobs (arrays and objects), Booleans, and Numbers from the Configly backend
- Web interface for modifying these values without having to deploy code (we call our beloved web interface the Configulator).
- High availability, high-throughput, low-latency backend.
- Smart caching on the client libraries to minimize server requests.
- Client libraries available in an expanding amount of languages.
You'll need a Configly account. Registration is lightning quick—you can register via visiting https://www.config.ly/signup.
After signing up, you can grab your API Key from https://www.config.ly/register. You'll need your API Key to setup the API below.
npm install configly-react
You will need to specify your API key using a ConfiglyContext Provider. This should be done at the root of your app.
import {ConfiglyText, ConfiglyDropdown, ConfiglyContext} from 'configly-react';
<ConfiglyContext.Provider value={{apiKey: 'MY_API_KEY'}}>
<div className="App"></div>
</ConfiglyContext.Provider>
You can then use the predefined components to display text or dropdowns
<ConfiglyText prop="hello"/></ConfiglyText>
<ConfiglyDropdown prop="hello-dropdown"/>
If you want to provide a default value that will display before the value is loaded, use the default
parameter. The default value will be run through the component's render function.
To render a custom component, you will pass a render function to the ConfiglyComponent. It takes a single argument, which is the value returned by Configly.
function renderCustom(value) {
return(<span>
<input type="checkbox" checked={value} />
</span>);
}
<ConfiglyComponent prop="hello-custom" render={renderCustom} />
You can run the sample app located in the demo
folder for a working example.
This repository is published under the MIT license.