https://github.com/onaio/gisida-react
React Dashboard library for Gisida.
https://github.com/onaio/gisida-react
dashboard data gisida map react visualization
Last synced: about 1 year ago
JSON representation
React Dashboard library for Gisida.
- Host: GitHub
- URL: https://github.com/onaio/gisida-react
- Owner: onaio
- License: apache-2.0
- Created: 2017-10-16T16:45:49.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2021-10-15T09:45:11.000Z (over 4 years ago)
- Last Synced: 2025-04-28T15:02:24.018Z (about 1 year ago)
- Topics: dashboard, data, gisida, map, react, visualization
- Language: JavaScript
- Homepage: http://gisida.onalabs.org/
- Size: 51.1 MB
- Stars: 3
- Watchers: 31
- Forks: 2
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## gisida-react
React Dashboard library for [gisida](https://github.com/onaio/gisida). Includes a collection of standard componets used to build a Map Dashboard and provides functionality to also render custom components.
## Installation
```
$ npm install gisida-react
```
**NOTE:** You can alternetively use [`yarn`](https://yarnpkg.com/en/docs/getting-started) to manage your node packages.
## Usage
```javascript
import React from 'react'
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { initStore } from 'gisida';
import { App, TitleBar, Map, Menu, StyleSelector, Legend } from 'gisida-react';
const store = initStore();
ReactDOM.render((
App>
), document.getElementById('root'));
```
- To render a custom react component just add it as a child under the `` component.
Example:
```javascript
class CustomComponent extends React.Component {
render() {
return (
A Simple React Component Example
);
}
}
```
- To have your compoent use the gisida state as props use [redux connect](https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options). Gisida-react componets also provide a good example of how to achieve this.
## Development
### Local development
- Clone repo:
```
$ git clone git@github.com:onaio/gisida-react.git
```
#### Run development server:
```
$ npm start
```
#### Run development build without server:
```
$ npm develop
```
### Prodcution build
- Build production distribution
```
$ npm build
```
- Publish to npm
```
$ npm publish
```
## Local development
1. Check https://github.com/onaio/gisida-react/releases to see what the next release version number should be, i.e. if the last release is `0.0.7` the next should be `0.0.8` depending on the Semantic Versioning guide, refer to (https://semver.org/).
2. Create branch for new version being released, `git checkout -b `
```
$ git checkout -b 0.0.8
```
3. Run `npm version `. This creates a commit and updates version number in package.json.
```
$ npm version 0.0.8
```
4. Push release branch to Github and tag `git push -u --follow-tags origin ` e.g
```
$ git push -u --follow-tags origin 0.0.8
```
5. Merge release to master once it passes review