calculator-frontend is a website (https://nhsgrader.com) developed in React for students to calculate their grades with.
The grade calculator website looks like this:
Close down this repository. You will need node and npm installed globally on your machine.
To Start Server:
npm run dev
To Open Local Server:
https://localhost:xxxx
-
Enter grades into the input fields in either the standard mode or advanced mode (note that the assignment name is optional).
-
Choose the weight category for each assignment.
-
Press the = Calculate button
- What was the context for this project?
A number of students at my high school including myself found it hard to understand the grading system of the school. I decided to set the goal of using modern technologies to solve the problem of this lack of knowledge amongst students and familiarize myself with the information necessary to create this application.
- What did I end up building?
My final product ended up as a fully hosted frontend site. This site is not only functional and efficient with TypeScript, but it also includes an elegant and fully mobile responsive UI.
- What tools did I use?
My main development tool was React started with Vite. I used Chakra UI for my design work after developing mockups in Figma. Further into the codebase, most of the logic is implemented with TypeScript