This commit is contained in:
morsh 2017-07-30 11:06:07 +03:00
Родитель 0110843806
Коммит 007fcc8a93
9 изменённых файлов: 75 добавлений и 1065 удалений

21
LICENSE Normal file
Просмотреть файл

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2017 Elad Iwanir
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

Просмотреть файл

@ -1,33 +1,47 @@
# Ibex Dashboard [![Build Status](https://travis-ci.org/CatalystCode/ibex-dashboard.png?branch=master)](https://travis-ci.org/CatalystCode/ibex-dashboard) # Ibex Dashboard [![Build Status](https://travis-ci.org/CatalystCode/ibex-dashboard.png?branch=master)](https://travis-ci.org/CatalystCode/ibex-dashboard)
Ibex is a dashboarding application that enables building dashboard and templates.
This is an application insights based project that displays a bots analytics dashboard. It mainly supports **Application Insights** but data sources and visual components are easily extendable.
# Preview # Preview
[![Preview](/docs/bot-framedash.png)](/docs/bot-framedash.png) [![Preview](/docs/images/bot-fmk-dashboard.png)](/docs/images/bot-fmk-dashboard.png)
[![Preview](/docs/bot-framedash-msgs.png)](/docs/bot-framedash-msgs.png) [![Preview](/docs/images/bot-fmk-dashboard-msgs.png)](/docs/images/bot-fmk-dashboard-msgs.png)
[![Preview](/docs/images/bot-fmk-dashboard-intent.png)](/docs/images/bot-fmk-dashboard-intent.png)
### Show With Your Own Data ## Display your Bot Analytics Dashboard
1. Clone ```bash
2. [Get an Application Insights App ID and Api Key](https://dev.applicationinsights.io/documentation/Authorization/API-key-and-App-ID) npm install yarn -g
4. Run `cd server; yarn start` git clone https://github.com/CatalystCode/ibex-dashboard
5. Run `cd client; yarn start` cd ibex-dashboard
6. Open **http://localhost:3000/** yarn
7. Run through setup and afterwards, fill in **API Key** and **Application ID** yarn start
```
1. Open **http://localhost:4000**
2. Create a new template from **Bot Analytics Basic Dashboard**
3. Run through the **Application Insights** setup and fill in **API Key** and **Application ID** according to the application insights account associated with your registered bot.
### Development
```bash
yarn start:dev
```
1. Open **http://localhost:3000**
(For more information on development environment, see https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/)
## Deploy To Azure ## Deploy To Azure
There are 3 ways to deploy to Azure: There are 3 ways to deploy to Azure:
**1. Web App - Automated** **1. Web App - Automated**
1. Fork this repo (to be able to automatically create github deployment key) 1. Fork this repo (to be able to automatically create github deployment key)
2. After fork, copy the fork url and use it with the following deployment button: 2. Copy the fork url and use it with the following deployment button:
<a href="https://portal.azure.com/#create/Microsoft.Template/uri/https%3A%2F%2Fraw.githubusercontent.com%2Ftorosent%2Fibex-dashboard%2Fmaster%2Fscripts%2Fdeployment%2Fwebapp%2Fazuredeploy.json" target="_blank"> <a href="https://portal.azure.com/#create/Microsoft.Template/uri/https%3A%2F%2Fraw.githubusercontent.com%2Ftorosent%2Fibex-dashboard%2Fmaster%2Fscripts%2Fdeployment%2Fwebapp%2Fazuredeploy.json" target="_blank">
<img src="http://azuredeploy.net/deploybutton.png"/> <img src="http://azuredeploy.net/deploybutton.png"/>
@ -45,17 +59,19 @@ There are 3 ways to deploy to Azure:
2. Clone & Deploy: 2. Clone & Deploy:
3. [Create a new Web App in Azure](https://docs.microsoft.com/en-us/azure/app-service-web/app-service-continuous-deployment) 3. [Create a new Web App in Azure](https://docs.microsoft.com/en-us/azure/app-service-web/app-service-continuous-deployment)
**Important Note**
Since application insights API doesn't support ARM yet, we need to manually [create an API Key](https://dev.applicationinsights.io/documentation/Authorization/API-key-and-App-ID) for the application insights service.
Once you created the api key, copy and paste it into the **Dashboard settings screen**.
## Deploy With Docker ## Deploy With Docker
1. `docker build -t **image name** .` 1. `docker build -t **image name** .`
2. `docker run -d -e PORT=80 **image name** ` 2. `docker run -d -e PORT=80 **image name** `
3. Docker image is also available at Docker Hub - `docker pull catalystcode/ibex-dashboard` 3. Docker image is also available at Docker Hub - `docker pull catalystcode/ibex-dashboard`
## Application Insights Integration
Since application insights API doesn't support ARM yet, we need to manually [create an API Key](https://dev.applicationinsights.io/documentation/Authorization/API-key-and-App-ID) for the application insights service.
The full instructions are also available when you create a new dashboard.
You can also follow the next headline.
## Create new API Key and Application ID ## Create new API Key and Application ID
The following steps explain how to connect **Application Insights** bot with your bot and your dashboard: The following steps explain how to connect **Application Insights** bot with your bot and your dashboard:
@ -73,10 +89,12 @@ The following steps explain how to connect **Application Insights** bot with you
### Technologies In Use ### Technologies In Use
* https://facebook.github.io/react/
* https://github.com/facebookincubator/create-react-app
* http://recharts.org/ * http://recharts.org/
* http://www.material-ui.com/ * https://react-md.mlaursen.com/
### Resources ### Design and Patterns
This project is built using: This project is built using:
* https://github.com/facebookincubator/create-react-app * https://github.com/facebookincubator/create-react-app
@ -84,7 +102,6 @@ This project is built using:
The server approach was added using: The server approach was added using:
* https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/ * https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/
* https://github.com/fullstackreact/food-lookup-demo
* https://medium.com/@patriciolpezjuri/using-create-react-app-with-react-router-express-js-8fa658bf892d#.14dex6478 * https://medium.com/@patriciolpezjuri/using-create-react-app-with-react-router-express-js-8fa658bf892d#.14dex6478
Thinking about integrating with: Thinking about integrating with:
@ -92,27 +109,14 @@ Thinking about integrating with:
* https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md * https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md
### Assumptions ### Engines
1. Running node version 6.11 or above.
### Installation * Running node version 6.11 or above.
```bash
git clone https://github.com/CatalystCode/ibex-dashboard.git
cd ibex-dashboard
(cd client; npm install -g yarn; yarn)
(cd server; npm install -g yarn; yarn)
```
### Dev
```bash
(cd server; yarn start:dev)
(cd client; yarn start:dev)
```
### Test Watcher ### Test Watcher
Runs the test watcher in an interactive mode. The test watcher is integrated into the create-react-app mechanism and runs tests related to files changes since the last commit.
By default, runs tests related to files changes since the last commit.
To run the test watcher in an interactive mode:
```bash ```bash
cd client cd client
@ -131,14 +135,15 @@ Our CI server Travis creates new production builds automatically for changes
to master. If you need to create a build locally, you can execute the same to master. If you need to create a build locally, you can execute the same
commands as the CI server. commands as the CI server.
```bash
yarn build
```
Or
```bash ```bash
.travis/build.sh .travis/build.sh
``` ```
## Whats Inside? # Lisence
MIT
* [webpack](https://webpack.github.io/) with [webpack-dev-server](https://github.com/webpack/webpack-dev-server), [html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin) and [style-loader](https://github.com/webpack/style-loader)
* [Babel](http://babeljs.io/) with ES6 and extensions used by Facebook (JSX, [object spread](https://github.com/sebmarkbage/ecmascript-rest-spread/commits/master), [class properties](https://github.com/jeffmo/es-class-public-fields))
* [Autoprefixer](https://github.com/postcss/autoprefixer)
* [ESLint](http://eslint.org/)
* [Jest](http://facebook.github.io/jest)

Двоичные данные
docs/bot-framedash-msgs.png

Двоичный файл не отображается.

До

Ширина:  |  Высота:  |  Размер: 152 KiB

Двоичные данные
docs/bot-framedash.png

Двоичный файл не отображается.

До

Ширина:  |  Высота:  |  Размер: 121 KiB

Двоичные данные
docs/images/bot-fmk-dashboard-intent.png Normal file

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 275 KiB

Двоичные данные
docs/images/bot-fmk-dashboard-msgs.png Normal file

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 301 KiB

Двоичные данные
docs/images/bot-fmk-dashboard.png Normal file

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 349 KiB

Просмотреть файл

@ -12,5 +12,6 @@
"start:server": "cd server && yarn start", "start:server": "cd server && yarn start",
"start:dev": "npm-run-all -p start:client start:server", "start:dev": "npm-run-all -p start:client start:server",
"postinstall": "cd client && yarn && cd ../server && yarn" "postinstall": "cd client && yarn && cd ../server && yarn"
} },
"license": "MIT"
} }

Разница между файлами не показана из-за своего большого размера Загрузить разницу