CSCI 5117, Fall 2024, assignment description
-
Team Name: 20245117
-
App Name: Running Tracker
- Qinghong Fan, fan00123@umn.edu
- Linghe Wang, wang9257@umn.edu
- Zhiyuan Lin, lin00905@umn.edu
- Abdullahi Nor, nor00003@umn.edu
Describe the most challenging features you implemented (one sentence per bullet, maximum 4 bullets):
- We used a calendar API to connect to our database and display user plans.
- We fetched the plan's stats from the database and made charts based on user running stats.
- We embedded Google Maps and Geolocation functionality and created markers (stored locally and remotely) in the map to indicate the plan's location.
Which (if any) device integration(s) does your app support?
- Google Maps and Geolocation are integrated into the app.
Which (if any) progressive web app feature(s) does your app support?
- N/A
Add images/photos that show your mockup along with a very brief caption:
This is the default page when unlogged-in users browse the website.

This is the home page after users log in. A calendar is displayed, where the user can select any date to view past running stats or make a new plan. A notification will pop up to remind the user of the running plan.

When the user clicks on a colored date, this page will show up to display the user's running stats on that day.

This page displays the user's weekly or monthly running stats.

The user can make a new running plan on this page if the user selects an uncolored date on the calendar.

The user can enter the desired destination and save this route for future running.

The user can view the saved running route.

The user can view, edit, and delete the created plan.

This is the default page when unlogged-in users browse the website.

This is the home page after users log in. A calendar is displayed, where the user can select any date to view past running stats or make a new plan. A notification will pop up to remind the user of the running plan.

When the user clicks on a colored date, this page will show up to display the user's running stats on that day.

This page displays the user's weekly or monthly running stats.

The user can make a new running plan on this page if the user selects an uncolored date on the calendar.

The user can enter the desired destination and choose either to save this route for future running or start running right away.

The user can view the saved running route. The user can also apply this route to start running right away with this route.

The user can view, edit, and delete the created plan.

Is there anything special we need to know in order to effectively test your app? (optional):
- The user stats page only shows the stats for completed plans, while absent plan or scheduled plan stats are not recorded. When testing the user stats page, sometimes, if the stats for completed plans are not shown in the chart, please refresh the page; then, the stats should be displayed there.
Add a screenshot of each key page along with a very brief caption:
After the user login, auto redirect to this page. The calendar will display all user plans in this month.

The user can create new plan on this page.

The user can edit existing plan on this page.

The user can view all plans on this page, including edit and delete any plans.

The user can use search bar to search for a location and create a marker, and associate the marker with a plan as the plan location.

The user can view all completed running plans' stats within this week or this month.

Document integrations with 3rd Party code or services here. Please do not document required libraries (e.g., React, Azure serverless functions, Azure nosql).
- Calendar from Toast UI: We used this calendar to display user plans in current month.
If there's anything else you would like to disclose about how your project relied on external code, expertise, or anything else, please disclose that here:
- N/A

