文件列表:

.env (54, 2023-12-05)
package-lock.json (1222020, 2023-12-05)
package.json (1309, 2023-12-05)
public/ (0, 2023-12-05)
public/favicon.ico (67646, 2023-12-05)
public/index.html (610, 2023-12-05)
public/logo180.png (5757, 2023-12-05)
public/manifest.json (492, 2023-12-05)
public/robots.txt (67, 2023-12-05)
public/screenshots/ (0, 2023-12-05)
public/screenshots/Calendar.jpg (133461, 2023-12-05)
public/screenshots/Customers.jpg (126709, 2023-12-05)
public/screenshots/Statistics.jpg (64645, 2023-12-05)
public/screenshots/Trainings.jpg (72276, 2023-12-05)
src/ (0, 2023-12-05)
src/App.js (1100, 2023-12-05)
src/Components/ (0, 2023-12-05)
src/Components/Addcustomer.js (2125, 2023-12-05)
src/Components/Addtraining.js (3546, 2023-12-05)
src/Components/AppbarComponents/ (0, 2023-12-05)
src/Components/AppbarComponents/CustomAppBar.js (1581, 2023-12-05)
src/Components/AppbarComponents/CustomDrawer.js (2229, 2023-12-05)
src/Components/AppbarComponents/MainContent.js (1346, 2023-12-05)
src/Components/Calendar.js (2016, 2023-12-05)
src/Components/Customerlist.js (7378, 2023-12-05)
src/Components/Editcustomer.js (2297, 2023-12-05)
src/Components/Statistics.js (1816, 2023-12-05)
src/Components/TrainingList.js (3214, 2023-12-05)
src/index.js (265, 2023-12-05)
src/reportWebVitals.js (362, 2023-12-05)

# Personal trainer > Created as my final project for a university Front-end Programming course, the 'Personal Trainer' web app, built with React.js, simplifies customer and training management. It includes a Customer List for easy info access, Trainings List for quick removal of sessions, a Calendar for scheduling, and Statistics with clear diagrams showing total training durations. > > You can find the final version of the application [_here_](https://personal-trainer-alex.netlify.app). ## Table of Contents * [Usage Guied](#usage-guide) * [Features](#features) * [Technologies Used](#technologies-used) * [Dependencies](#dependencies) * [Screenshots](#screenshots) ## Usage Guide 1. Clone the project
```git clone https://github.com/alexonthespot7/personalTrainer.git```
2. run the following command in a terminal window (in the complete) directory:
```npm install```
3. run the following command in a terminal window (in the complete) directory:
```npm start```
4. Navigate to localhost:3000 ## Features - Customer List: - Displays a comprehensive list of customers. - Allows viewing and editing of customer details. - Supports the deletion of customer profiles. - Facilitates the addition of new training sessions for specific customers. - Trainings List: - Presents a detailed overview of all training sessions. - Provides information about each training session. - Enables the removal of individual training sessions. - Calendar: - Exhibits a visual representation of scheduled training sessions. - Integrates seamlessly with a calendar view for a holistic overview. - Statistics: - Offers a visual summary of training statistics across all customers. - User-Friendly Interface: - Features an intuitive and easy-to-navigate interface. ## Technologies Used - React.js - css ## Dependencies - [@date-io/date-fns](https://www.npmjs.com/package/@date-io/date-fns) (^1.3.13): Date management library supporting Date-Fns, facilitating date operations for UI components. - [date-fns](https://www.npmjs.com/package/date-fns) (^2.28.0): Versatile JavaScript date utility library for parsing, manipulating, and formatting dates. - [fullcalendar](https://fullcalendar.io/docs/react) (^5.11.*): FullCalendar package components for building interactive, customizable calendars in React. - [@mui/icons-material](https://www.npmjs.com/package/@mui/icons-material): Material-UI Icons library for customizable icons following Material Design guidelines. - [@mui/material](https://www.npmjs.com/package/@mui/material): Material-UI framework providing pre-designed React components. - [@mui/x-data-grid](https://www.npmjs.com/package/@mui/x-data-grid) (^5.10.0): Advanced data grid component library based on Material-UI. - [@mui/x-date-pickers](https://www.npmjs.com/package/@mui/x-date-pickers) (^5.0.0-alpha.2): Experimental date picker components from Material-UI. - [ag-grid-react](https://www.npmjs.com/package/ag-grid-react): React wrapper for AG-Grid to seamlessly integrate its functionalities. - [recharts](https://www.npmjs.com/package/recharts) (^2.1.9): React charting library for building responsive and customizable charts. - [lodash](https://www.npmjs.com/package/lodash) (^4.17.21): A comprehensive JavaScript utility library offering functions for common programming tasks. ## Screenshots

近期下载者：

相关文件：

评论：[我要评论] [举报此文件]

收藏者：