Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kemi-oluwadahunsi/health-tracker-dashboard
A Patient's dashboard for viewing health reports and user profile.
https://github.com/kemi-oluwadahunsi/health-tracker-dashboard
Last synced: 11 days ago
JSON representation
A Patient's dashboard for viewing health reports and user profile.
- Host: GitHub
- URL: https://github.com/kemi-oluwadahunsi/health-tracker-dashboard
- Owner: Kemi-Oluwadahunsi
- Created: 2024-05-25T17:13:04.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-07-21T17:07:55.000Z (4 months ago)
- Last Synced: 2024-07-21T18:42:04.015Z (4 months ago)
- Language: JavaScript
- Homepage: https://health-tracker-dashboard-five.vercel.app
- Size: 139 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Patient Dashboard Application
## Overview
The Patient Dashboard Application is a React-based web application built using Next.js, Vite, and Tailwind CSS. It provides a comprehensive dashboard to view and manage patient data, including a blood pressure chart and detailed diagnosis history. The application leverages various libraries such as Chart.js, @headlessui/react, and Redux Toolkit for state management.
## Features
- **Patient List**: View a list of patients with their basic details.
- **Patient Details**: Click on a patient to view detailed diagnosis history and blood pressure charts.
- **Blood Pressure Chart**: Visualize the blood pressure trends of the selected patient over the last six months.
- **Responsive Design**: The application is fully responsive and works well on all devices.
## Technologies Used
- **React**
- **Next.js**
- **Vite**
- **Tailwind CSS**
- **Chart.js**
- **@headlessui/react**
- **Redux Toolkit**
- **Express**
- **MongoDB**
## Installation
1. Clone the repository:
```bash
git clone https://github.com/yourusername/patient-dashboard.git
```
2. Navigate to the project directory:
```bash
cd patient-dashboard
```
3. Install the dependencies:
```bash
npm install
```
4. Start the development server and open it in the browser:
```bash
npm run dev
http://localhost:3000
```
## Usage
### Viewing Patients
- The sidebar lists all patients fetched from the backend.
- Click on a patient to view their details, including diagnosis history and blood pressure charts.
## Viewing Blood Pressure Chart
- When a patient is selected, their blood pressure data over the last six months is displayed in a line chart.
- The chart is rendered using Chart.js.
## Contributing
- Fork the repository.
- Create a new branch (git checkout -b feature/your-feature-name).
- Commit your changes (git commit -am 'Add some feature').
- Push to the branch (git push origin feature/your-feature-name).
- Create a new Pull Request.
## License
This project is licensed under the MIT License. See the LICENSE file for details.
Contact
For any inquiries or issues, please contact [Me]([email protected]).