SPORTSEE

React dashboard analytics with ExpressJs micro API

---

https://sportsee.herokuapp.com/

---

---

Class-based React architecture

---

STACK

• HTML5/CSS3/Javascript
• React
• Recharts library
• Styled Components

---

Prerequisites

• NodeJS
• Yarn

[ If you are working with several versions of NodeJS, we recommend you install nvm. This tool will allow you to easily manage your NodeJS versions. ]

---

Launching the project

• Fork the repository
• Clone it on your computer.
• The npm i command will allow you to install the dependencies.
• The npm run start command will allow you to run the micro API.

---

SPORTSEE DATA FLOW

┌─────────────┐     ┌─────────────────┐
│ LOCAL DATA  ├────►│SERVED by Express│
└─────────────┘     │on 5000          │
                    └─────────┬───────┘
                              │
      ┌───────────────────────▼────────────────────────┐
      │API routes  : 5000/api/user/:id                 │
      │              5000/api/user/:id/activity        │
      │              5000/api/user/:id/average-session │
      │              5000/api/user/:id/performance     │
      └───────────────────────┬────────────────────────┘
                              │
                              │
                              │
                  ┌───────────┴───────────┐
                  │                       │
                  │  React client fetch   │
                  │                       │
                  └───────────────────────┘