Homework Calendar banner

Homework Calendar

21 devlogs
53h 31m 49s

Trouble keeping track of tests and homework due dates? Introducing the Homework Calendar 9000! In one place, you can add tests and assignments and it will remind you and help you prioritize your next assignment :D

Repository

Loading README...

Eternal

New features

Multiple accounts are available yeaaaaaa!
oh yeah! you can also sort by due date and time to complete now to better prioritize homework assignments

Bug fixes

February was showing up as “January” on the big calendar because of an off-by-one error so I fixed that :D

Attachment
Attachment
Attachment
Attachment
0
Eternal

UI Changes

I went around and added/removed padding and made the layouts better by using display: flex; and sprinkled in 2 icons (replacing Due date: and Estimated time to complete for assignments with icons) and a adding tiles to modals and a whole host of other changes to the UI

Functionality

  • the classes.vue page uses the store now so it reads from one central place so that edits and changes are synced
  • deleting a class now prompts the user on what to do with the assignments (delete them, reassign then to a new class or reassign them to no class)
Attachment
Attachment
Attachment
Attachment
Attachment
Attachment
0
Eternal

Did some refactoring and minor changes

Attachment
Attachment
Attachment
0
Eternal

Fixed that bug where the wrong amount of assignments and the wrong assignments were removed. Turns out, I was using .splice(1, index) instead of .splice(index, 1) to remove assignments from the array

I a QoL improvement too, using v-auto-animate so that assignments that are deleted have a smooth transition out

Attachment
0
Eternal

You can now delete assignments :D

there is a bug where the 2nd row of “Unfinished assignments from previous months” disappears and all the assignments in the current month disappear after deleting 1 assignment, so I have to fix that

Attachment
0
Eternal

I had to redo how I store assignments on the frontend :(
if I want the “edit assignment” component to be able to edit data in that is shown on the main page, I have to use a store so that its easier for the main page to know what to show when the edit component changes the title of the assignment. I have to change where the main page fetches data from and make the store ask the server for data instead of the main page

After 2 hours of work, Its done :D

Attachment
Attachment
Attachment
0
Eternal

You can see your classes now :D
Official release of this feature whooo

Attachment
0
Eternal

There was a weird issue where using <UMain> in the app.vue file caused the page to overflow a tiny bit if I didn’t use <UHeader>. I removed <UMain> and then I also restricted the height of the assignments sidebar so that it couldn’t overflow the page, and made it scroll instead.

Attachment
Attachment
0
Eternal

Made the calendar page (index.vue) and the classes (classes.vue) page and the [id].vue page prettier :D

Everything is better looking now :D

Some behind the scenes stuff: I moved classes.vue over from classic CSS to tailwind. I’m thinking about making everything tailwind (including the index.vue page) but that’ll be a lot of work and I don’t know if I like tailwind that much. Its just an experiment right now :p

Attachment
Attachment
Attachment
Attachment
0
Eternal

I have just been informed that the limit for a dev log is 10 hours. I have 10 hours and 16 minutes, so I’ll lose 16 minutes :(

Lets see. What have I been working on…

Oh! I’ve been working on polishing things by adding a navbar and a layout. And then I moved onto adding page that lists all classes and that lets you edit the class name and archive classes. I spend a little while messing around with the layout of the classes and the buttons. I also added v-auto-animate so that when people archived classes, they’d get visual feedback and see it sliding to the end of the list. And I also spent 2 hours moving the “edit class” modal into its own component file so that it could be reused across the “view all classes” page and the “view individual class” page and refactoring things. I haven’t commited the “view all classes” page yet. I want to wait until its done before I push a massive feature update.

I had to fix some things in the backend too, like deleting classes not working because I was actually trying to delete assignments instead of classes (Whoops; silly me :p). The frontend also wasn’t displaying only the assignments for that day in the sidebar that pops up when you click on that day in the calendar so I had to debug that. The fix was actually really simple (I was iterating over all the assignments instead of the assignments just for that day) but it took forever to debug.

This doesn’t sound like it would take a lot of time but gestures at devlog it did. Development is really slow haha

Attachment
Attachment
Attachment
Attachment
Attachment
0
Eternal

Hello again. I lost motivation for a bit, and got caught up in other projects and such but I’m back now :D

I added mobile support. But it wasn’t as straight-forward as making things smaller and moving them around. I had to use Nuxt UI’s calendar component because the desktop calendar I built would’ve been too big and clunk for mobile, even if I made it smaller. And I had to change the sidebar that shows up-coming assignments that are due that month so that its toggle-able and fills up the entire mobile page. I thought about changing the desktop code so that I wouldn’t have to duplicate code for mobile, but that didn’t work out, so I just duplicated code specially for mobile.

Oh! And the part of the page that shows past assignments that weren’t completed also had to be changed into a popup-dropdown-like thing. I attached screenshots.

Its coming together but there’s still work to do. Next up: archiving classes, filtering assignments by class, and color coding assignments based on the class its for

Attachment
Attachment
Attachment
0
Eternal

I’m so tired. Do I have to write this devlog?

Features

  • A sidebar that pops up that shows assignments due on that day when you click the day on the calendar

And a whole buncha other misc changes relating to styling and refactoring by moving things to separate files

Attachment
0
Eternal

Alright, you’re probably thinking, “did it really take you 1 hour and 41 minutes to make it show old uncompleted assignments?” and to that I say “it took me 40 minutes to make it and 1 hour to debug why it was showing each assignment/date twice”

It was because I was iterating on it twice :(((
I thought it was SSR, and I tried debugging things manually by stepping through the code with my head and I tested it in the browser console. Augh. I think I’ll become Amish

Attachment
Attachment
1

Comments

regonold520
regonold520 3 months ago

I bet the struggle of debugging was worth it, project seems very cool so far :3

Eternal

A bit tired -w-
Didn’t make any big changes
Just refactored the backend so that the API to fetch assignments was more flexable by letting the frontend set a start and end date to fetch assignments for and so that it could show old uncompleted assignments

And I also made it so that the completed assignments would be ordered by completion date
And I also did some cleanup (better readme, added license, made assignments look better by adding a <br>)
You can also see the date you completed it now

Attachment
Attachment
0
Eternal

Features

  • You can set an estimated completion time now :DDD
  • Fixed assignments marked as complet being unable to be unmarked as complete
  • Strikethrough for assignments that have been completed in the calendar
  • Long assignment titles are now cut off in the calendar
  • Other stuff I’m too lazy to write
Attachment
Attachment
Attachment
0
Eternal

You can create classes now and give assignments classes so you can filter things better now :D

Misc changes

  • Prettier calendar dates :D
  • Show assignments that are due that day
  • Moved related routes to their own file in the backend
  • Fixed a few areas TypeScript was complaining about
Attachment
Attachment
0
Eternal

I should become Amish, with all my struggling with coding :(

Struggles

  • The backend wasn’t filtering assignments properly and showing assignments that are due within the month. But turns out the frontend was creating assignments for November and I was checking for assignments for December
  • Drizzle was complaining about a SQL query not working. Turns out, I was querying for a nonexistant column by accident :(
    Nothing was showing in the tabs on the frontend for the assignments sidebar because the HTML was looking for a nonexistant slot name :(

But now you can see a calendar and a list of assignments you completed and stuff you still need to complete :DDD

Attachment
0
Eternal

Took me wayyy too long for these commits
I wanted to add creating assignments in the db, but I wanted to use the “offical” way.
So I look at the Nuxt UI docs and see that they provide a date picker
But that date picker uses a custom thing (new CalendarDate()) so it doesn’t work with the UForm and Zod
So I had to go figure out a way to get around that
I settled on using 2 separate variables instead of putting it in the Zod schema the UForm uses

And I also got this “SQLITE_ERROR: no such column: users.id” error with Drizzle that took forever to fix
Turns out I was referencing the “users” table when I shouldn’t have

There was also this “RangeError: The status provided (0) must be 101 or in the range of [200, 599]” error that I had to fix
But the status I was trying to return was 201 so that made no sense
I eventually narrowed it down to my authentication middleware
I forgot to use await when I called next() but now I fixed it

Added features:
You can created assignments in the frontend now :D

Attachment
0
Eternal

Added login and register
Frontend now logs in automatically :D

Editor changes (indent 2 spaces -> indent 4 spaces)
Ignore the sqlite db when pushing to git
Changed ‘name’ in the schema to ‘username’

Next up: creating assignments and viewing assignments

Attachment
0
Eternal

Added authentication (no way to log in atm)
And creating assignments
And cleaned up some stuff

Attachment
0
Eternal

Initialize db

  • Created schema for user and assignments
  • Installed packages

Baby steps :p

Attachment
0