https://github.com/hackafro/ionic-graph-app
Realtime data visualisation using Pusher and Ionic
https://github.com/hackafro/ionic-graph-app
Last synced: 8 months ago
JSON representation
Realtime data visualisation using Pusher and Ionic
- Host: GitHub
- URL: https://github.com/hackafro/ionic-graph-app
- Owner: HackAfro
- Created: 2018-06-20T10:31:46.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-07-05T07:34:46.000Z (almost 8 years ago)
- Last Synced: 2025-01-14T14:12:03.052Z (over 1 year ago)
- Language: CSS
- Size: 1.38 MB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Ionic-Realtime-Data-Visualization
Realtime data visualisation using Pusher and Ionic
You can find the article [here](https://pusher.com/tutorials/live-graph-ionic)
## Prerequisites
- [Ionic](https://ionicframework.com/)
- [Express](https://expressjs.com/)
- [Pusher](https://pusher.com)
- [ChartJs](http://www.chartjs.org/)
- A [Pusher account](https://pusher.com/signup) and [Pusher app credentials](http://dashboard.pusher.com/)
## Getting started
- Clone the project and install dependencies:
- Create a file named `.env`. Update the `.env` file with the content below:
```
PUSHER_APP_ID=app-id
PUSHER_APP_KEY=app-key
PUSHER_APP_SECRET=app-secret
PUSHER_CLUSTER=cluster
```
- Update the `pusher.ts` file with your pusher key
> **Note**: ensure to replace the placeholder values with your pusher `appId`, `key` and `secret`.
- Clone the repo
- Run npm install
- Start server by running `node server`
- Run `ionic serve` to start the Ionic dev server
## Built With
* [Pusher](https://pusher.com/)
* [Ionic](https://ionicframework.com/)
* [Express](https://expressjs.com/)
* [Pusher](https://pusher.com)
* [ng2-charts](https://valor-software.com/ng2-charts/)