I finally have a hero section that you can look at!

I added betterauth-ui with the hopes that
it would solve my auth ui problems, but it turned out to be a problem
itself so i nuked it.
The hero section now features stickers that you can drag around and do
fun stuff with.
I still need to add more sections under the Hero explaining the app, and
I do not know how i will style that yet.

how the hero stickers work

So it’s very simple. I call the db with an array of sticker IDs for the
ones that I want displayed. I have picked 12 IDs but only 8 are shown so
the effect seems kind of random but also not rrly random at the same
time. Then the db is called, and CDN links are fetched and cached so
reloading is quick. The stickers also deviate positions a little bit
every time.

I am planning on using this “sticker” concept design on a couple more
pages just maybe with different stickers, or for example on the users
sticker page the stickers that they own.

I completely forgot to devlog… this app is made for hack clubbers to be able to track the stickers that they receive and compete with other hack clubbers on who has the most stickers. i currently have authentication handled by betterauth and it was relatively easy to set up with hack club auth. i created /stickers that users can use to see all the stickers they can collect, and since i’m using https://stickers.hackclub.com/api/stickers to get all the available stickers, so are missing since the creators haven’t added them into the external db i don’t have access to. I pull the contents of the API into my own db table so that I wouldn’t fully depend on that api/db if one went down. i had to create multiple components to have the state of authentication show up and change the “log in” button to the pfp of the user for example.