Code Monkey home page Code Monkey logo

dashborad's Introduction

Dashboard

React-dashboard is a dashboarding application that enables building dashboard and templates. It mainly supports Application Insights but data sources and visual components are easily extendable.

Changes

Version 1.3

Version 1.3 contains the following changes:

  • Moving application insights queries from client to server
  • Updated tests to answer some security risks presented by GitHub
  • Updated tests to accommodate the new approach
  • Added masking/unmasking of connection parameters (so that client side can only update API KEY but not see what it is)
  • Fixed small bugs with Firefox rendering

Version 1.2

Version 1.2 breaks the persitency paths of dashboard files and custom templates. If you are upgrading to this version, copy your private dashboards from /dashboards into /dashboards/persistent/ as follows:

Private Files: Move files from /dashboards/*.private.js to /dashboards/persistent/private.

Custom Templates: Move files from /dashboards/customTemplates/*.private.ts to /dashboards/persistent/customTemplates.

Preview

Preview Preview Preview

Installation

npm install yarn -g

git clone https://github.com/webdevstar/React-dashboard
cd React-dashboard
yarn
yarn start

Using Bot Analytics Instrumented Dashboard

  1. Open http://localhost:4000
  2. Create a new template from Bot Analytics Instrumented 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.

Installation on Ubuntu

Use the following to install yarn on Ubuntu:

curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn

Development

yarn start:dev

Open http://localhost:3000

For contribution and code documentation follow: DEVELOPMENT & CONTRIBUTION.

Build

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 commands as the CI server.

yarn build

Or

.travis/build.sh

Resources

Technologies In Use

Design and Patterns

This project is built using:

The server approach was added using:

Thinking about integrating with:

Engines

  • Running node version 6.11 or above.

License

MIT © webdevstar

dashborad's People

Contributors

softdeveloper123 avatar topdeveloper739 avatar webdevstar avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

dashborad's Issues

Make Scorecards clickable

Error count -> dialog detail

First view:

Grouped by message text & type & count eg. http status code
Second view:

List of errors grouped by message type / count (for selected group)
Third view:

Error details

REACT_APP_APP_INSIGHTS_APIKEY not working

Seems that react-scripts does not pick up the key for REACT_APP_APP_INSIGHTS_APIKEY in the right way.

Everything was set correctly but react-scripts didn't pick up the updated value. It kept using the default value set with the ARM deployment.

Application Insights query count improvements

Since App Insights has a limit on queries in one API access, think of a way to leverage "forking" as a mechanism to run several queries in one API call:

customEvents
| where timestamp > ago(60d)
| fork(
extend successful=customDimensions.successful
| where name startswith 'message.convert'
| summarize event_count=count() by name, tostring(successful)
) (extend cslen = customDimensions.callstack_length, intent=customDimensions.intent
| where name startswith "message.intent" and (cslen == 0 or strlen(cslen) == 0) and strlen(intent) > 0
| summarize event_count=count() by tostring(intent))

customEvents
| where timestamp > ago(60d)
| extend cslen = customDimensions.callstack_length, intent=customDimensions.intent
| where name startswith "message.intent" and (cslen == 0 or strlen(cslen) == 0) and strlen(intent) > 0
| summarize event_count=count() by tostring(intent)

Make Scorecards clickable

Error count -> dialog detail

First view:

Grouped by message text & type & count eg. http status code
Second view:

List of errors grouped by message type / count (for selected group)
Third view:

Error details

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.