Inspiration
Our inspiration came from GradeWay, an app for checking grades, schedules, classes, and other school-related information. We liked the idea of having one place to manage everything related to school, but we felt there was a lot more that could be done.
Students often have important academic information spread across grades, assignments, schedules, transcripts, credits, and standardized tests. We wanted to bring all of that information together while going beyond simply showing students what has already happened.
That led us to GradeIt: a platform designed not only to show students their academic information, but also to help them understand their progress, identify changes, predict outcomes, and work toward their goals.
What it does
GradeIt is a free, more complete alternative to traditional student grade apps. It allows students to check their grades, predict future grades using a What-If Calculator, and view their GPA using three different types of weighting.
GradeIt also puts a huge focus on customization. Users can create their own themes with essentially unlimited combinations of colors, while also having a collection of preset themes and iconic fonts to choose from.
Beyond grades, GradeIt provides large-scale graphs to visualize how grades change over time, grade-change monitoring, predicted grades, class and schedule management, calendar planning, reminders for classes and homework, test score tracking, academic goals, analytics, transcripts and credits, and even support for SAT, ACT, FAST, and EOC scores.
Our goal was to make GradeIt feel less like a basic gradebook and more like a complete academic dashboard that students can actually make their own to check what class they have 3rd period or check what grade to aim for to meet expectations.
How we built it
We built GradeIt as a full-stack web application, with one of us focusing on the backend and the other focusing on the frontend.
The frontend was built with React, TypeScript, Vite, and Tailwind CSS, allowing us to create a responsive interface with reusable components and a large amount of customization.
The backend was built with Python and FastAPI, with a database used to store student information such as courses, assignments, grades, schedules, goals, and test scores. The frontend communicates with the backend through REST API endpoints.
For analytics and grade predictions, we chose to use our own calculations rather than relying on an external AI service. This keeps GradeIt completely free and makes the results predictable and transparent.
We also built the project with a strong focus on making the interface responsive and usable across different screen sizes.
Challenges we ran into
One of our biggest challenges was building a full-stack application in only two days. Neither of us had unlimited time to learn every technology we were using, so we had to learn and implement things at the same time.
Connecting the React frontend to our FastAPI backend was another major challenge. We had to make sure that the frontend and backend agreed on how data was structured, while also handling authentication and keeping the application state synchronized.
We also spent a lot of time working on the UI and customization system. We wanted users to have a huge amount of freedom without making the interface confusing or difficult to use.
Finally, getting all of our features to work together while still keeping the application responsive and polished was difficult. We had to prioritize features, debug quickly, and make decisions about what was actually possible within the two-day deadline.
Accomplishments that we're proud of
We're especially proud that we were able to build a complete, working full-stack application in just two days.
Rather than making a small proof-of-concept, we were able to implement a large number of features, including:
Grade and assignment tracking GPA calculations with multiple weighting systems What-If grade calculations Grade trend graphs Class and teacher management Scheduling and calendar planning Test score tracking Academic goals Analytics and predictions Transcript information Reminders Custom themes and fonts Dark/light themes Language customization Responsive mobile navigation User authentication
We're also proud of the amount of customization we were able to give users. GradeIt isn't just designed around one visual style, users can make it feel like their own application.
Most importantly, we managed to turn an idea into a functional product within the extremely limited timeframe of the hackathon.
What we learned
We learned a lot about full-stack development and working as a team under a deadline.
On the technical side, we learned how to build a React application with TypeScript and Vite, use Tailwind CSS to create a responsive interface, build APIs with FastAPI, connect a frontend to a backend, and work with persistent database data.
We also learned how important it is to establish clear communication between the frontend and backend. Even a small difference in how data is structured can cause problems across the entire application.
Beyond the technical side, the biggest lesson was scope management. There are always more features we wanted to add, but with only two days, we had to decide what was actually worth spending our time on.
We learned that building a good project is about both writing code and about planning, communicating, debugging, and knowing when to move on from a feature.
What's next for GradeIt
We want GradeIt to eventually become a fully-featured academic platform rather than just a hackathon project.
Some of the things we'd like to add in the future include better notification and reminder systems, more advanced academic analytics, additional customization options, improved calendar functionality, integrations with existing school systems, and more ways for students to understand how their current grades affect their future performance.
We'd also like to improve the experience on mobile devices and continue expanding the theme and customization system.
Most importantly, we'd like to continue developing GradeIt beyond the hackathon and turn it into something that students could actually use throughout their entire school career.
Built With
- css
- fastapi
- python
- react
- sqlite
- tailwind
- typescript
- vite
Log in or sign up for Devpost to join the conversation.