Semester Tracker

A lightweight browser-based dashboard for organizing classes, assignments, deadlines, and grades throughout the semester.

Open the live app

Why I built it

As a student balancing a full course load, part time work, projects, and many overlapping deadlines, I needed one simple place to see what was due and understand how I was doing in each class. I built Semester Tracker to organize that information without requiring another account, subscription, or complicated setup.

The app is intentionally simple: open it in a browser, add your classes and assignments, and return to the same dashboard whenever you need it.

Features

• Create and color-code classes.
• Add assignments with due dates, point values, and grades.
• Mark assignments as completed.
• Flag assignments by priority or status.
• Reorder assignments within a class.
• Calculate points earned and total points possible automatically.
• Save the dashboard between visits using browser-local storage.
• Adapt the layout for desktop and mobile screens.

Why the data is stored locally

Semester Tracker uses the browser's localStorage instead of a database. This keeps the project fast and lightweight while avoiding accounts, passwords, and a backend server. A student's academic information remains in the browser where it was entered rather than being transmitted to an external service.

Because the data is device-specific, it does not automatically synchronize across browsers or devices. Clearing the browser's site data will also remove the saved semester information.

How it works

1. The user creates a class and chooses a color.
2. Assignments, deadlines, completion status, points, and grades are added to that class.
3. JavaScript recalculates earned and possible points whenever information changes.
4. The current dashboard is serialized as JSON and saved in localStorage.
5. The saved dashboard is restored when the user returns using the same browser.

Run locally

No installation or build step is required.

1. Clone the repository:

   git clone https://github.com/EmmyAbella444/SemesterTracker.git
   cd SemesterTracker

2. Open index.html in a browser.

For a local development server, you can also run:

python -m http.server 8000

Then visit http://localhost:8000.

Project structure

SemesterTracker/
├── index.html    # Page structure and controls
├── styles.css    # Responsive layout and visual design
├── script.js     # State, calculations, rendering, and local storage
├── .gitignore
└── README.md

Tech stack

HTML · CSS · JavaScript · Web Storage API · Netlify

Privacy

The app has no user accounts and does not send class or assignment data to a server. All information entered into the dashboard is stored only in that browser's local storage.