https://github.com/dennisxzx/react-dashboard

A dashboard app powered by React
https://github.com/dennisxzx/react-dashboard

Last synced: about 1 month ago
JSON representation

A dashboard app powered by React

• Host: GitHub
• URL: https://github.com/dennisxzx/react-dashboard
• Owner: dennisXZX
• Created: 2020-07-28T09:58:39.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2022-12-13T09:59:16.000Z (about 2 years ago)
• Last Synced: 2024-10-31T04:04:16.877Z (3 months ago)
• Language: TypeScript
• Size: 1.28 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 12
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Dashboard App

The aim of this project is to build an app to display data in a dashboard.

This project is deployed [here](https://test-dashboard-dennis.herokuapp.com).

## Functionality

This is a web application that contains the following main features:

- Users can view data in table or pie view

## Technology

- Libraries: `React, Redux, axios`

- Styling: `styled-components`

- Linting: `Eslint`

- Testing: `Jest, react-testing-library`

- Build: `Create-React-App`

- Deployment: `Heroku`

## Development

This project is using `npm` for dependency management.  Make sure `npm` is installed on your machine.

- `npm install` 

Install project dependencies.

- `npm run dev`

Run the app in development mode on `http://localhost:3000/`.

- `npm run test`

Launch test runner and run all the tests.

## Future Improvements

- Reduce wasted rendering by memorising (potential candidates: PieView, but have to profile and benchmark first to see how beneficial is the memorisation)

- Handle data loading and error states. Currently data loading and error states are handled in reducer and saved to Redux store, but it's not reflected in the UI

- Implement lazy loading. Add routing for table view and pie view so we can take advantage of lazy loading

- Use `Redux Toolkit` to reduce boilerplate code

- Extract some common code into custom hook (potential candidates: network call)

- Type everything correctly, remove all `any` type