Class Master

• 

  Main Menu

Inspiration

Our team members' current solutions for keeping track of open assignments usually took place on Notion, and while it works, it's a bit clunky and slow for quick entry, especially on mobile. We sought to streamline the ideas used from Notion as a task manager into a simple, quick, and intuitive interface that was equally easy to enter tasks into on both mobile and desktop.

What it does

Due to our limited time and general newness to the hackathon process (we are all first-years), we knew we would have to limit our scope to deliver a decent MVP. For now, all tasks are stored locally per session, but new ones can be created or destroyed in-browser and are stored in an object-oriented structure.

How we built it

We wanted to explore new technologies at the forefront of web development, so we chose to write our project in SvelteKit, a combined front-and-backend web framework in conjunction with TypeScript. We first started by creating a basic web page with elements that could be created and destroyed. Then, we split into 2 teams - one half worked on the UI/UX, while the other half worked on implementing the actual task management logic.

Challenges we ran into

We faced a large variety of challenges from only having 2 power outlets to share between 4 team members all the way to trying to figure out how to get the task objects defined in one component to be available in another. Many of these challenges boiled down to inexperience, and in surmounting them, we added numerous tools to our development toolbelts.

One of our ideas for the project was to have an interactive navbar, but given time constraints and the amount of planning and coding that would have to go into it, we had to table it for future developments, instead creating a more simplified version of it.

Some of it also came down to time management: we spent much of Friday and Saturday at workshops, and while they were beneficial to our knowledge, they took away time from our project, shortening our already-tight development timeframe.

The final, unfortunately unsolved, challenge lied in being able to enter task values through a series of sequential popups. We managed to find an existing package, but the documentation was somewhat lacking and we struggled with the unfamiliar syntax and conventions. We still had the ability to create and delete tasks, but in a slower manner.

Accomplishments that we're proud of

Despite being our first hackathon (during our first year of college), we were able to create a functional site using modern web technology. While the project was unfortunately all that we had envisioned by the end, we still achieved a sleek UI and solid underlying code.

What we learned

1. Decide on and learn tooling before showing up
2. Be more intentional in coding time and preliminary planning
3. Establish good version control practices before starting work
4. Debug and test often! We'd end up coding for 30 minutes at a time only to realize that somewhere in the process we broke the site
5. Be ok with things not always going your way! We faced a lot of setbacks and still perservered

What's next for Class Master

There's a lot of work left to be done for Class Master, and we firmly believe that it can reach our vision of a sleek, fast class management system as we continue to skill up in our education (and hacking!) to come.

Built With

• css
• html
• svelte
• typescript