• 

  the class dashboard

• 

  adding a new class

• 

  homepage classes view

• 

  class settings

• 

  loaf logo

loaf

the minimalistic school stuff planner

inspiration

My main inspiration for making Loaf was the struggle of planning my projects and assignments. I've used calendar apps and todo list apps together, but I've never found a tool that lets you do everything together. I sometimes forget to do an assignment, and I just wished there was an easier, and more aesthetic way to plan.

what it does

Essentially, it is a minimalistic and aesthetic way to plan your school stuff. You can organize assignments, write down notes, and also keep track of your grade.

how i built it

I built this web app with SvelteKit, TailwindCSS, and Supabase. I have really been enjoying Svelte recently, with it's easy-to-use syntax, and because it feels like native HTML. I used TailwindCSS because it is a really nice tool for blazing fast styling on projects and prototypes. I used Supabase as my database of choice simply because of it's easy to use interface for editing tables as well as the easy integration into my project.

challenges

One of the main challenges I ran into when making this app was what idea to make! One of my biggest weaknesses of projects is switching ideas midway, then again, then again. For this hackathon, I first started making a project organization tool that had an unique physics spin to it. After I realized that putting HTML elements on physics objects is actually kinda hard, I moved on to the next idea: "Math Notes". This was the concept of a online notepad where you could type math equations, and it would automatically calculate them and store them in your account. After realizing math equations are pretty hard to evaluate, I moved on to Loaf. Yes, I am not the most productive person. After going through so many ideas, I eventually ended up with only ~5 hours to create this project.

accomplishments

This was my first time using foreign keys in Supabase, and I am also proud of the style of the web app.

what i learned

This is my first time going to a hackathon, and I have learned something: COME UP WITH AN IDEA BEFORE YOU MAKE IT

what's next

I do want to expand Loaf to more than just a prototype, and possible actually fetch grades from students, and also add some grade calculation tools. I don't think the theme of the web app really fits with the idea, so I might change the styling a bit. I also want to color code the different classes, so it's clear which class is which.

Built With

• css3
• html5
• supabase
• svelte
• sveltekit
• tailwindcss
• typescript