|
4737
|
SlackOS by @akcodex | Stardance
|
akcodex
|
1
|
10.8
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-09T18:56:31Z", "hours": 10.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "SlackOS is a Slack bot that does what you say instead of what you click. You type /ask remind Divine to finish the UI by Friday and it saves the task. You type /ask what did we decide about the logo? and it answers from something the team told it weeks ago. You say /ask when someone joins #design DM them the handbook and it builds the rule, then runs it by itself when a real person joins. That last part took me the longest. My member_joined_channel listener never fired. No logs, no error, nothing. I checked my scopes about six times before I worked out the bot could post into the channel without being in it, which is what chat:write.public does, so it looked present when it wasn’t. Slack only sends you join events for channels the bot has joined. Fixed it with one /invite. The other headache was the AI never returning the same shape twice. Same sentence, different JSON. Sometimes task1/deadline1, sometimes a tasks array. One time I asked it to DM someone and it gave me send_direct_message while my code was looking for “direct message” with a space, so a private handbook went out to the whole channel. Everything gets flattened now before I match on it. My network blocks Hugging Face, so no embeddings. Instead I hand the stored memories to Groq and let it pick the relevant one. Good enough at this size. What I’m proud of: it runs on my own Nest box under systemd with Postgres in Docker, and the memory search answers questions I asked it weeks earlier. To test it, the demo link is a simulation of the real bot, so you don’t need a Slack account. Press the lightning button. It fires a fake channel join and the bot DMs the new person the handbook on its own, without anyone typing a command. The panel on the right is the bot’s state, and it changes while you type. Try /tasks, then /done 10, then /ask what time is standup? I used Claude Code for a good part of this, mostly debugging and cleanup. A few notes on why it’s built this way: The bug story is the strongest part. Reviewers see a lot of “I built a Slack bot.” Almost nobody explains that chat:write.public made their bot look present in a channel it had never joined. That detail proves you did the work. The send_direct_message bug is worth keeping even though it’s unflattering. A private handbook going out publicly is a real, specific failure with a real fix. It reads as honest in a way that “I learned a lot about APIs” never does.", "repo": "https://github.com/divinefavourak/jesutobi_bot-slack", "demo": "https://hackclub.enterprise.slack.com/archives/C0P5NE354"}]...
|
[{"post_id": 44225, "ts": "202 [{"post_id": 44225, "ts": "2026-08-09T20:51:34Z", "hours": 0.8, "text": "Spent tonight making the bot fun instead of only useful. It does memes, trivia, a magic 8ball and roasts now. The bigger piece is XP: you get points for finishing tasks, saving memories and building automations. 100 points is a level and every level has a title. You start as a Lurker. Stick around long enough and you become a Certified Menace. There’s a leaderboard, and you can shout someone out which hands them 25 XP. Three things fought me. The meme API defaults to r/dankmemes. This is going into a Slack full of teenagers so that was never happening. Locked it to ProgrammerHumor, wholesomememes and softwaregore, and I check the nsfw flag on every post too. The trivia API rate limits to one request every 5 seconds and 429’d me in the middle of testing my own feature. So I wrote 15 questions myself as a backup. Trivia never just dies now. Then the first meme it posted came through titled “partialContent”. Turns out r/ProgrammerHumor writes every title in camelCase, so I had to split them back into real words before posting. Also caught myself farming XP by spamming /sos-done on the same task. It only pays out now if the task wasn’t already finished. If you want it shorter, this version keeps the two best details: Made the bot fun tonight. Memes, trivia, roasts, and an XP system where you level up for finishing tasks and building automations. You start as a Lurker and work your way to Certified Menace. Two things I didn’t expect. The meme API defaults to r/dankmemes, which is not what you want in a Slack full of teenagers, so I locked it to a safe list and check the nsfw flag. And the first meme posted with the title “partialContent” because r/ProgrammerHumor writes everything in camelCase. Had to split the titles back into words. Also had to stop myself farming XP by spamming /sos-done on the same task."}, {"post_id": 44154, "ts": "2026-08-09T18:43:43Z", "hours": 0.3444, "text": "deployed it on my nest server. It is now 24/7 online"}, {"post_id": 44107, "ts": "2026-08-09T17:33:46Z", "hours": 8.5281, "text": "Changed the name to SlackOs(more sleek ig). Also designed the logo and finished it up. Time to deploy"}, {"post_id": 1104, "ts": "2026-06-02T22:40:12Z", "hours": 1.1075, "text": "I just learnt how to map out the commands, Ps: this is my first time working on a slack bot"}]...
|
Title: SlackOS by @akcodex | Stardance
Devlogs:
I Title: SlackOS by @akcodex | Stardance
Devlogs:
I just learnt how to map out the commands, Ps: this is my first time working on a slack bot
Changed the name to SlackOs(more sleek ig). Also designed the logo and finished it up. Time to deploy
deployed it on my nest server. It is now 24/7 online
Spent tonight making the bot fun instead of only useful. It does memes, trivia, a magic 8ball and roasts now. The bigger piece is XP: you get points for finishing tasks, saving memories and building automations. 100 points is a level and every level has a title. You start as a Lurker. Stick around long enough and you become a Certified Menace. There’s a leaderboard, and you can shout someone out which hands them 25 XP. Three things fought me. The meme API defaults to r/dankmemes. This is going into a Slack full of teenagers so that was never happening. Locked it to ProgrammerHumor, wholesomememes and softwaregore, and I check the nsfw flag on every post too. The trivia API rate limits to one request every 5 seconds and 429’d me in the middle of testing my own feature. So I wrote 15 questions myself as a backup. Trivia never just dies now. Then the first meme it posted came through titled “partialContent”. Turns out r/ProgrammerHumor writes every title in camelCase, so I had to split them back into real words before posting. Also caught myself farming XP by spamming /sos-done on the same task. It only pays out now if the task wasn’t already finished. If you want it shorter, this version keeps the two best details: Made the bot fun tonight. Memes, trivia, roasts, and an XP system where you level up for finishing tasks and building automations. You start as a Lurker and work your way to Certified Menace. Two things I didn’t expect. The meme API defaults to r/dankmemes, which is not what you want in a Slack full of teenagers, so I locked it to a safe list and check the nsfw flag. And the first meme posted with the title “partialContent” because r/ProgrammerHumor writes everything in camelCase. Had to split the titles back into words. Also had to stop myself farming XP by spamming /sos-done on the same task.
Ships:
SlackOS is a Slack bot that does what you say instead of what you click. You type /ask remind Divine to finish the UI by Friday and it saves the task. You type /ask what did we decide about the logo? and it answers from something the team told it weeks ago. You say /ask when someone joins #design DM them the handbook and it builds the rule, then runs it by itself when a real person joins. That last part took me the longest. My member_joined_channel listener never fired. No logs, no error, nothing. I checked my scopes about six times before I worked out the bot could post into the channel without being in it, which is what chat:write.public does, so it looked present when it wasn’t. Slack only sends you join events for channels the bot has joined. Fixed it with one /invite. The other headache was the AI never returning the same shape twice. Same sentence, different JSON. Sometimes task1/deadline1, sometimes a tasks array. One time I asked it to DM someone and it gave me send_direct_message while my code was looking for “direct message” with a space, so a private handbook went out to the whole channel. Everything gets flattened now before I match on it. My network blocks Hugging Face, so no embeddings. Instead I hand the stored memories to Groq and let it pick the relevant one. Good enough at this size. What I’m proud of: it runs on my own Nest box under systemd with Postgres in Docker, and the memory search answers questions I asked it weeks earlier. To test it, the demo link is a simulation of the real bot, so you don’t need a Slack account. Press the lightning button. It fires a fake channel join and the bot DMs the new person the handbook on its own, without anyone typing a command. The panel on the right is the bot’s state, and it changes while you type. Try /tasks, then /done 10, then /ask what time is standup? I used Claude Code for a good part of this, mostly debugging and cleanup. A few notes on why it’s built this way: The bug story is the strongest part. Reviewers see a lot of “I built a Slack bot.” Almost nobody explains that chat:write.public made their bot look present in a channel it had never joined. That detail proves you did the work. The send_direct_message bug is worth keeping even though it’s unflattering. A private handbook going out publicly is a real, specific failure with a real fix. It reads as honest in a way that “I learned a lot about APIs” never does....
|
1792976095.5468872
|
1793062495.5468872
|
|
4738
|
PICOLATOR V2 by @fedi41 | Stardance
|
fedi41
|
1
|
71.72
|
702
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-27T09:01:35Z", "hours": 51.0, "multiplier": 13.73, "payout": 702, "blessing": "neutral", "text": "PICOLATOR v2.1 Beta This is the first ship of my big project: Picolator . Picolator is a handheld device powered by a Raspberry Pi Pico, running a custom operating system that I wrote from scratch in C++. 🧩 Features At this stage, Picolator includes: 🎮 PicoDino A simple remake of the classic dinosaur runner game. 🖥️ Custom UI Engine A lightweight interface system with different blend modes and a modular structure. 🧭 Main Menu System An app launcher for navigating between installed applications. ⚙️ Settings App A basic settings interface for system configuration. 🎨 Theming Support Custom themes based on Tailwind-style color palettes. 🚀 Status This is an early beta release. More features, apps, and improvements are planned for future updates.", "repo": "https://github.com/fedi41/picolator2", "demo": "https://fedi41.github.io/picolator/"}]...
|
[{"post_id": 70207, "ts": "202 [{"post_id": 70207, "ts": "2026-09-18T18:17:53Z", "hours": 2.8942, "text": "Simple taskbar! Added a simple status bar to the picolator! At the time its very minimal, but later it will show more stuff. How it works The status bat shows the currently running app by accessing the Navigator class. It is displayed over the current app, but before the all the features. Why I did it I thought that it would be nice to always know which app you are in, and because I dont want to put a header in each app, a status bar is the best solution. Also, I can later use it to show other stuff so its just nice to have :D Whats about the AI chat app I never finished? well… its still not finished idk if it ever will be finished. Conclusion I actually did varios stuff, but the most major change I made was the status bar so I post it here. Thanks for reading btw XD"}, {"post_id": 65203, "ts": "2026-09-10T05:18:26Z", "hours": 5.0075, "text": "5 Hours for almost nothing xD well its been very long time, I’ve been working on the AI app all this time… I almost made it so you can enter your own api key, but like always it isnt saving properly and is just not working. I also improved the AI chat a bit, made so it shows the errors, only for it to always show “UNKNOWN ERROR”. It kinda looks that the project is a bit dead a the time, I dont know if I will be posting so often. Other things that are not related to the project I switched to arch btw And I am finally comfortable with neovim :D"}, {"post_id": 46720, "ts": "2026-08-14T05:11:48Z", "hours": 2.1681, "text": "AI on the pico!! AI chat app is working!! What I did: Made the ui (pretty simple) Added a keyboard for input made some placehgolder functions to send promt and receive them What AI did for me all the api connection logic (The Mistral.h file) It was too complicated for me XD… How I did it: I used the mistral API made a simle app on the picolator for it thats it ) What I will do next -> make so you can enter your own api key (without recompiling) make so u can scroll through long responses Next ideas for the project… redisign some parts of the ui (I dont like that headings take up so much space) make a paint app ?"}, {"post_id": 44438, "ts": "2026-08-10T05:58:36Z", "hours": 0.2722, "text": "Serial logging works! I just replaced me custom logger with the Serial one ) Now I can work on the AI chat app !"}, {"post_id": 44423, "ts": "2026-08-10T05:36:44Z", "hours": 2.4386, "text": "Devlog ig Well this two hours I been trying to make an AI chat app. Meanwhile, I realized, that my custom log system kinda sucks, so I will be just using the classic Serial output for logging, and completly remove my custom logger. Problems with the logger logs are hard to read (very small) if u enable the log display feature, the rendering gets slower gives no errors, I only know at witch step the program stopped uses much RAM with serial logging, all of this issues will be fixed. And I can finally see what error it throws! although it doesnt tell much in the error… terminate called after throwing an instance of 'std::out_of_range' what(): And sorry for the long break… I will try to code more now!"}, {"post_id": 33077, "ts": "2026-07-22T17:38:04Z", "hours": 1.1644, "text": "pico-Stardance :P Tried rendering the stardance logo on the Picolator ) I actually wanted to work on the AI chat app, but instead of locking in, I just procrastineted and made this :3 But a least it looks cool XD Btw it took me so long, because I am trying to learn vim, and I am not really good at it ) Well ig see u next devlog"}, {"post_id": 31835, "ts": "2026-07-20T15:06:50Z", "hours": 0.7833, "text": "picoFETCH ig its working ) I added a simple fetch app, simmular to neofetch ) It displays: the board name (on compilation) chip name clock speed free RAM (not prezise) SDK version chip id WiFi connection status btw this all runs on a simple rpi pico 2w with a diplay ) check out my other devlogs to see what this thing can do"}, {"post_id": 31737, "ts": "2026-07-20T11:37:26Z", "hours": 0.7644, "text": "WiFi on the Picolator I managed to connect WiFi to the pico! The password and the SSID are saved in the flash! I will update the wifi settings UI someday, It looks horrible XD. And guess what? I will do a PICOFETCH app next, So follow along!"}, {"post_id": 31111, "ts": "2026-07-19T07:50:49Z", "hours": 3.6431, "text": "Its been very long time… But , I made some progress on the WiFi -settings! By progress I mean only the working ui XD. (and keyboard ) EVERYTHING ELSE JUST DOESNT WORK a list of things, that need to be fixed: storage sucks wifi sucks ui sucks (it just looks bad) I will bet trying to fix all of these things in future devlogs so follow along )"}, {"post_id": 17489, "ts": "2026-06-28T09:17:14Z", "hours": 1.5889, "text": "Pico-keyboard ?! So i coded the first simple version of a keyboard for the Picolator … for now, I will use it for the AI chat app (also in development), and for the Wifi configuration. Its currently in development, but in the next devlog I am planning to finish the wifi connection! btw credits to @eceWire , I was inspired by the keyboard in his project. ))"}, {"post_id": 16800, "ts": "2026-06-27T08:49:16Z", "hours": 2.6928, "text": "The first release ) I finished the demo version of the project! Now I am ready to ship ) features in this release UI system (with theming support) first game (picodino) Settings menu (with modular feature support) custom renderer (built on top of the waveshare library, supports blendmodes) custom input system the release: https://github.com/fedi41-prog/picolator2/releases"}, {"post_id": 16306, "ts": "2026-06-26T15:13:42Z", "hours": 7.0764, "text": "7 HOURS GONE. WEBSITE DONE (almost). Well time flies much faster when making websites… finished the feature menu I added a feature menu to control the feature manager and toggle features on and off ) I also kinda broke the display of the picolator… and thats why - new displays are coming soon (well I think so) - I am building a second Picolator! (And repairing the old one) almost forgot the website link 😅: https://fedi41-prog.github.io/picolator2/"}, {"post_id": 15041, "ts": "2026-06-24T12:55:31Z", "hours": 0.8667, "text": "Demo website working on the demo website for my PICOLATOR project . SHIPPING SOON . PICOLATOR v2.1 is ready for ship! I just need to finish this small website, and I’m done! I’ll also continue working at this after the ship :) Btw here is the link: https://fedi41-prog.github.io/picolator2/"}, {"post_id": 14643, "ts": "2026-06-23T20:33:16Z", "hours": 1.8336, "text": "Finished the PICODINO! Ig I finished the game ) Now I can finally work on something else . 🦖🌵 . It’s a copy of the iconic game, running on a pi pico. Features added… score counter high score saved in flash sneaking different cactus types restart after losing dark mode"}, {"post_id": 14363, "ts": "2026-06-23T13:57:16Z", "hours": 1.1458, "text": "PICO-DINO just jumped on a cactus 😭😭 …the PicoDino tries to jump over the EVIL CACTUS , but he lands perfectly on it! RIP PicoDino 🪦🦖 . . . But… Cactus collision is working! 😎 Finally, the dino can’t go through cacti anymore! Today, I implemented the mask collision ) P.S. - I finally figured out how to add multiple photos 😅"}, {"post_id": 14187, "ts": "2026-06-23T05:41:04Z", "hours": 1.6097, "text": "A cactus appears! 🌵 This morning, I added the first cactus, and a moing floor, along with some animations ) These are all original textures! Next up cactus collisions (mask collisions) more cactus types score counter"}, {"post_id": 13786, "ts": "2026-06-22T16:25:57Z", "hours": 1.0808, "text": "Meet the PICO-DINO!! 🦖 I finally made a real dinosaur for the game ) Further plans Next, I will add some cacti )"}, {"post_id": 13697, "ts": "2026-06-22T13:35:19Z", "hours": 0.9733, "text": "RAM Optimization The pico was sometimes crashing, after I spammed the log, so I got into optimising ) Before, i had 2 screen buffers, and even a third one for blending them (no wonder it crashed XD) So I just removed all the unnesecary buffers ) btw blend modes are still working! the first game! I just started working on the first game for the picolator!"}, {"post_id": 13323, "ts": "2026-06-21T20:19:58Z", "hours": 0.5889, "text": "DISPLAY TIMEOUT ADDED Now the display wont burn out XD Here is a reaaaally interesting photo of a black screen XD Tomorrow I will start coding the dino runner!"}, {"post_id": 13290, "ts": "2026-06-21T19:14:45Z", "hours": 2.5306, "text": "MIX BLEND MODE Added a brand new blend mode to my renderer! It was actually just procrastination, because I was too lazy to make the Dino Runner. About the project The Picolator is a custom OS for the raspberry pi pico. Next I will implement the chrome dino app (:"}, {"post_id": 12663, "ts": "2026-06-20T18:06:20Z", "hours": 0.7731, "text": "Display overclock 🥳 Got my display running on 65hz! (and coded this spinny thing) This can definitly run chrome dino XD"}, {"post_id": 12615, "ts": "2026-06-20T16:41:15Z", "hours": 1.7439, "text": "Feature system ready! The Picolator can now run different feature modules for debugging and trolling! Next up …. Dino runner! Btw my rng number is crazy (3) : stardance rng day 6 🎲 3 · ranked #500 so far https://stardance.hackclub.com/rng"}, {"post_id": 12536, "ts": "2026-06-20T14:08:54Z", "hours": 1.2269, "text": "Input system fixed Today I fixed the input system, so it responds faster, and supports more features. One important function I added is the justPressed function, it only returns true, when thw button was pressed exactly in this tick I also started working on the feature manager , it will have different featues like on screen log display, and other useful stuff."}, {"post_id": 12112, "ts": "2026-06-19T19:39:26Z", "hours": 0.7036, "text": "Theme change works!"}, {"post_id": 12083, "ts": "2026-06-19T18:35:30Z", "hours": 0.4331, "text": "C++ compiler exploding because of one missing semicolon 💀"}, {"post_id": 12054, "ts": "2026-06-19T17:42:16Z", "hours": 1.2925, "text": "Working on settings Changed some core logic, and started to work on the settings menu!"}, {"post_id": 11943, "ts": "2026-06-19T14:07:08Z", "hours": 1.9542, "text": "minor changes Input debug Main menu working! new Theme Next, I will work on the Settings app. Then you can change and create themes! wow"}, {"post_id": 11259, "ts": "2026-06-18T12:44:33Z", "hours": 1.5231, "text": "Display update! Many different display features : blend modes overlays new color format better image rendering And I also added some new themes ! PS the display looks too bright on the photo"}, {"post_id": 11203, "ts": "2026-06-18T10:28:37Z", "hours": 3.7581, "text": "Hugeee update!! Themes fixed Main menu working new App managment system Theme view screen ready I hope you like it )"}, {"post_id": 10078, "ts": "2026-06-16T17:36:28Z", "hours": 0.9575, "text": "The Tailwind theme is working!!! Currently each theme has 3 Tailwind pallets - surface, primary, and secondary. P.S. - It looks much better irl"}, {"post_id": 9943, "ts": "2026-06-16T13:56:56Z", "hours": 1.5231, "text": "coded a buggy tailwind theme generator (some colors are to bright, others to dark 😭😭😭)"}, {"post_id": 9751, "ts": "2026-06-16T05:36:53Z", "hours": 3.2739, "text": "The Main screen is ready! And themes are working. (this is just a test theme ik it looks terrible)"}, {"post_id": 8819, "ts": "2026-06-14T17:37:03Z", "hours": 1.4308, "text": "Remaking the font System Today, I was remaking the entire font system. I created my own FONT class, and used it to load new fonts. Now The Picolator has nicer fonts )"}, {"post_id": 8737, "ts": "2026-06-14T15:12:28Z", "hours": 0.3678, "text": "Fixed the Font rendering! New features -> font scaling -> now you can scale fonts! Coming up -> rethinking the Font system changing the ugly Waveshare font to something different (:"}, {"post_id": 7986, "ts": "2026-06-13T10:04:34Z", "hours": 1.5319, "text": "Remaking the font rendering (and failing)"}, {"post_id": 7692, "ts": "2026-06-12T21:01:25Z", "hours": 2.0769, "text": "Ahhh why did I spent some mucb time on this…. (added a UiDraw class, and redisigned the structure)"}, {"post_id": 7596, "ts": "2026-06-12T18:21:32Z", "hours": 1.1856, "text": "Alpha support added! (And other technical changes)"}, {"post_id": 6261, "ts": "2026-06-10T14:55:17Z", "hours": 1.7136, "text": "Building the basic app structure! And a quick display demo. Created a TestApp for different tests )"}, {"post_id": 5849, "ts": "2026-06-09T19:55:52Z", "hours": 1.1669, "text": "Created a Display class for rendering and drawing. (just a wrapper for a C library). Next I am going to work on the UI logic."}, {"post_id": 5771, "ts": "2026-06-09T17:57:21Z", "hours": 1.1364, "text": "Finally got it running on cpp! (Yes i gave up on learning c)"}, {"post_id": 5603, "ts": "2026-06-09T13:40:31Z", "hours": 0.8697, "text": "So I somehow got the display test working… I already hate C (edit - no! C is cool [: )"}, {"post_id": 5570, "ts": "2026-06-09T12:15:42Z", "hours": 0.4519, "text": "setting up the project!"}]...
|
Title: PICOLATOR V2 by @fedi41 | Stardance
Devlog Title: PICOLATOR V2 by @fedi41 | Stardance
Devlogs:
setting up the project!
So I somehow got the display test working… I already hate C (edit - no! C is cool [: )
Finally got it running on cpp! (Yes i gave up on learning c)
Created a Display class for rendering and drawing. (just a wrapper for a C library). Next I am going to work on the UI logic.
Building the basic app structure! And a quick display demo. Created a TestApp for different tests )
Alpha support added! (And other technical changes)
Ahhh why did I spent some mucb time on this…. (added a UiDraw class, and redisigned the structure)
Remaking the font rendering (and failing)
Fixed the Font rendering! New features -> font scaling -> now you can scale fonts! Coming up -> rethinking the Font system changing the ugly Waveshare font to something different (:
Remaking the font System Today, I was remaking the entire font system. I created my own FONT class, and used it to load new fonts. Now The Picolator has nicer fonts )
The Main screen is ready! And themes are working. (this is just a test theme ik it looks terrible)
coded a buggy tailwind theme generator (some colors are to bright, others to dark 😭😭😭)
The Tailwind theme is working!!! Currently each theme has 3 Tailwind pallets - surface, primary, and secondary. P.S. - It looks much better irl
Hugeee update!! Themes fixed Main menu working new App managment system Theme view screen ready I hope you like it )
Display update! Many different display features : blend modes overlays new color format better image rendering And I also added some new themes ! PS the display looks too bright on the photo
minor changes Input debug Main menu working! new Theme Next, I will work on the Settings app. Then you can change and create themes! wow
Working on settings Changed some core logic, and started to work on the settings menu!
C++ compiler exploding because of one missing semicolon 💀
Theme change works!
Input system fixed Today I fixed the input system, so it responds faster, and supports more features. One important function I added is the justPressed function, it only returns true, when thw button was pressed exactly in this tick I also started working on the feature manager , it will have different featues like on screen log display, and other useful stuff.
Feature system ready! The Picolator can now run different feature modules for debugging and trolling! Next up …. Dino runner! Btw my rng number is crazy (3) : stardance rng day 6 🎲 3 · ranked #500 so far https://stardance.hackclub.com/rng
Display overclock 🥳 Got my display running on 65hz! (and coded this spinny thing) This can definitly run chrome dino XD
MIX BLEND MODE Added a brand new blend mode to my renderer! It was actually just procrastination, because I was too lazy to make the Dino Runner. About the project The Picolator is a custom OS for the raspberry pi pico. Next I will implement the chrome dino app (:
DISPLAY TIMEOUT ADDED Now the display wont burn out XD Here is a reaaaally interesting photo of a black screen XD Tomorrow I will start coding the dino runner!
RAM Optimization The pico was sometimes crashing, after I spammed the log, so I got into optimising ) Before, i had 2 screen buffers, and even a third one for blending them (no wonder it crashed XD) So I just removed all the unnesecary buffers ) btw blend modes are still working! the first game! I just started working on the first game for the picolator!
Meet the PICO-DINO!! 🦖 I finally made a real dinosaur for the game ) Further plans Next, I will add some cacti )
A cactus appears! 🌵 This morning, I added the first cactus, and a moing floor, along with some animations ) These are all original textures! Next up cactus collisions (mask collisions) more cactus types score counter
PICO-DINO just jumped on a cactus 😭😭 …the PicoDino tries to jump over the EVIL CACTUS , but he lands perfectly on it! RIP PicoDino 🪦🦖 . . . But… Cactus collision is working! 😎 Finally, the dino can’t go through cacti anymore! Today, I implemented the mask collision ) P.S. - I finally figured out how to add multiple photos 😅
Finished the PICODINO! Ig I finished the game ) Now I can finally work on something else . 🦖🌵 . It’s a copy of the iconic game, running on a pi pico. Features added… score counter high score saved in flash sneaking different cactus types restart after losing dark mode
Demo website working on the demo website for my PICOLATOR project . SHIPPING SOON . PICOLATOR v2.1 is ready for ship! I just need to finish this small website, and I’m done! I’ll also continue working at this after the ship :) Btw here is the link: https://fedi41-prog.github.io/picolator2/
7 HOURS GONE. WEBSITE DONE (almost). Well time flies much faster when making websites… finished the feature menu I added a feature menu to control the feature manager and toggle features on and off ) I also kinda broke the display of the picolator… and thats why - new displays are coming soon (well I think so) - I am building a second Picolator! (And repairing the old one) almost forgot the website link 😅: https://fedi41-prog.github.io/picolator2/
The first release ) I finished the demo version of the project! Now I am ready to ship ) features in this release UI system (with theming support) first game (picodino) Settings menu (with modular feature support) custom renderer (built on top of the waveshare library, supports blendmodes) custom input system the release: https://github.com/fedi41-prog/picolator2/releases
Pico-keyboard ?! So i coded the first simple version of a keyboard for the Picolator … for now, I will use it for the AI chat app (also in development), and for the Wifi configuration. Its currently in development, but in the next devlog I am planning to finish the wifi connection! btw credits to @eceWire , I was inspired by the keyboard in his project. ))
Its been very long time… But , I made some progress on the WiFi -settings! By progress I mean only the working ui XD. (and keyboard ) EVERYTHING ELSE JUST DOESNT WORK a list of things, that need to be fixed: storage sucks wifi sucks ui sucks (it just looks bad) I will bet trying to fix all of these things in future devlogs so follow along )
WiFi on the Picolator I managed to connect WiFi to the pico! The password and the SSID are saved in the flash! I will update the wifi settings UI someday, It looks horrible XD. And guess what? I will do a PICOFETCH app next, So follow along!
picoFETCH ig its working ) I added a simple fetch app, simmular to neofetch ) It displays: the board name (on compilation) chip name clock speed free RAM (not prezise) SDK version chip id WiFi connection status btw this all runs on a simple rpi pico 2w with a diplay ) check out my other devlogs to see what this thing can do
pico-Stardance :P Tried rendering the stardance logo on the Picolator ) I actually wanted to work on the AI chat app, but instead of locking in, I just procrastineted and made this :3 But a least it looks cool XD Btw it took me so long, because I am trying to learn vim, and I am not really good at it ) Well ig see u next devlog
Devlog ig Well this two hours I been trying to make an AI chat app. Meanwhile, I realized, that my custom log system kinda sucks, so I will be just using the classic Serial output for logging, and completly remove my custom logger. Problems with the logger logs are hard to read (very small) if u enable the log display feature, the rendering gets slower gives no errors, I only know at witch step the program stopped uses much RAM with serial logging, all of this issues will be fixed. And I can finally see what error it throws! although it doesnt tell much in the error… terminate called after throwing an instance of 'std::out_of_range' what(): And sorry for the long break… I will try to code more now!
Serial logging works! I just replaced me custom logger with the Serial one ) Now I can work on the AI chat app !
AI on the pico!! AI chat app is working!! What I did: Made the ui (pretty simple) Added a keyboard for input made some placehgolder functions to send promt and receive them What AI did for me all the api connection logic (The Mistral.h file) It was too complicated for me XD… How I did it: I used the mistral API made a simle app on the picolator for it thats it ) What I will do next -> make so you can enter your own api key (without recompiling) make so u can scroll through long responses Next ideas for the project… redisign some parts of the ui (I dont like that headings take up so much space) make a paint app ?
5 Hours for almost nothing xD well its been very long time, I’ve been working on the AI app all this time… I almost made it so you can enter your own api key, but like always it isnt saving properly and is just not working. I also improved the AI chat a bit, made so it shows the errors, only for it to always show “UNKNOWN ERROR”. It kinda looks that the project is a bit dead a the time, I dont know if I will be posting so often. Other things that are not related to the project I switched to arch btw And I am finally comfortable with neovim :D
Simple taskbar! Added a simple status bar to the picolator! At the time its very minimal, but later it will show more stuff. How it works The status bat shows the currently running app by accessing the Navigator class. It is displayed over the current app, but before the all the features. Why I did it I thought that it would be nice to always know which app you are in, and because I dont want to put a header in each app, a status bar is the best solution. Also, I can later use it to show other stuff so its just nice to have :D Whats about the AI chat app I never finished? well… its still not finished idk if it ever will be finished. Conclusion I actually did varios stuff, but the most major change I made was the status bar so I post it here. Thanks for reading btw XD
Ships:
PICOLATOR v2.1 Beta This is the first ship of my big project: Picolator . Picolator is a handheld device powered by a Raspberry Pi Pico, running a custom operating system that I wrote from scratch in C++. 🧩 Features At this stage, Picolator includes: 🎮 PicoDino A simple remake of the classic dinosaur runner game. 🖥️ Custom UI Engine A lightweight interface system with different blend modes and a modular structure. 🧭 Main Menu System An app launcher for navigating between installed applications. ⚙️ Settings App A basic settings interface for system configuration. 🎨 Theming Support Custom themes based on Tailwind-style color palettes. 🚀 Status This is an early beta release. More features, apps, and improvements are planned for future updates....
|
1792983409.2320743
|
1793069809.2320743
|
|
4740
|
HiveMind by @Dorapakoda | Stardance
|
Dorapakoda
|
1
|
9.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-07T07:08:29Z", "hours": 9.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "verview HiveMind is a modular swarm intelligence platform designed around interconnected ESP32-based nodes that can operate as a coordinated autonomous system. Rather than relying on a single powerful controller, HiveMind distributes tasks, communication, and decision-making across multiple low-cost nodes, creating a resilient and scalable network capable of adapting to changing environments and mission requirements. The project explores how large numbers of simple devices can work together to achieve complex objectives such as area mapping, search operations, environmental monitoring, surveillance, and autonomous exploration. Vision Traditional robotic systems often depend on centralized control, making them vulnerable to single points of failure. HiveMind aims to demonstrate a different approach: a decentralized network where individual nodes cooperate, share information, and dynamically allocate tasks based on the current state of the mission. Inspired by natural swarm systems such as ant colonies and bee hives, HiveMind focuses on collective intelligence emerging from many simple units working together.", "repo": "https://github.com/EnigmaGaming03/HiveMind", "demo": "https://hive-mind-simulator--menot58157.replit.app/"}]...
|
[{"post_id": 2665, "ts": "2026 [{"post_id": 2665, "ts": "2026-06-05T10:34:38Z", "hours": 2.0442, "text": "Finished with drone frame and component placement.Next is setting up of the O2O communication system and control system for the drone as well as other safety/ smart features"}, {"post_id": 1469, "ts": "2026-06-03T14:57:30Z", "hours": 3.3953, "text": "In this session i worked on making the full driver board and fixing all the shorts on the schematic. due to certain crashes of KiCad there was a lot of component unsyncing happening so i had to force sync the schematic a few times to fix the errors , i also made the board to size based on the previously designed CAD model of the drone frame. a few issues were faced while wiring the board, causing the routes to no snap on to the place , although after some trouble shooting it was fixed by changing the settings in the interactice routing tab and selecting allow DRC violations. Though this caused more trouble shooting steps in the end it allowed me to be able to quickly build the initial board. i also had to redo the board J1 socket as seen in image attached as i had forgotten to add voltage in from the ESP32 cam to this additional board to run the motors"}, {"post_id": 1270, "ts": "2026-06-03T04:46:05Z", "hours": 2.0492, "text": "In this session, i worked on the driver board for the drone, which the ESP32 will connect to and be able to controll the motors, its a unidirectional 4 channel controller, it uses a Q_NMOS, 10K resistors and a 1N4148 Diode. Faced a few issues because most of the schematics needed to be found using different names Q_NMOS was known as SI2300 N-channel but that name doesnt work in the kicad library. furthermore when switching to the schematics to the PCB editor most of the components didnt have a footprint assigned so i had to work on assigning footprints to each component again."}, {"post_id": 787, "ts": "2026-06-02T13:40:47Z", "hours": 1.1478, "text": "Working on a Drone swarming system that uses ESP32 with camera module for o2o( Object to object ) communication In this first session I made the drone frame and decided the placement of various components on the frame. As well as a bit of research about the components that may be necessary for the motor driver pcb that has to fabricated / designed at a later session"}]...
|
Title: HiveMind by @Dorapakoda | Stardance
Devlog Title: HiveMind by @Dorapakoda | Stardance
Devlogs:
Working on a Drone swarming system that uses ESP32 with camera module for o2o( Object to object ) communication In this first session I made the drone frame and decided the placement of various components on the frame. As well as a bit of research about the components that may be necessary for the motor driver pcb that has to fabricated / designed at a later session
In this session, i worked on the driver board for the drone, which the ESP32 will connect to and be able to controll the motors, its a unidirectional 4 channel controller, it uses a Q_NMOS, 10K resistors and a 1N4148 Diode. Faced a few issues because most of the schematics needed to be found using different names Q_NMOS was known as SI2300 N-channel but that name doesnt work in the kicad library. furthermore when switching to the schematics to the PCB editor most of the components didnt have a footprint assigned so i had to work on assigning footprints to each component again.
In this session i worked on making the full driver board and fixing all the shorts on the schematic. due to certain crashes of KiCad there was a lot of component unsyncing happening so i had to force sync the schematic a few times to fix the errors , i also made the board to size based on the previously designed CAD model of the drone frame. a few issues were faced while wiring the board, causing the routes to no snap on to the place , although after some trouble shooting it was fixed by changing the settings in the interactice routing tab and selecting allow DRC violations. Though this caused more trouble shooting steps in the end it allowed me to be able to quickly build the initial board. i also had to redo the board J1 socket as seen in image attached as i had forgotten to add voltage in from the ESP32 cam to this additional board to run the motors
Finished with drone frame and component placement.Next is setting up of the O2O communication system and control system for the drone as well as other safety/ smart features
Ships:
verview HiveMind is a modular swarm intelligence platform designed around interconnected ESP32-based nodes that can operate as a coordinated autonomous system. Rather than relying on a single powerful controller, HiveMind distributes tasks, communication, and decision-making across multiple low-cost nodes, creating a resilient and scalable network capable of adapting to changing environments and mission requirements. The project explores how large numbers of simple devices can work together to achieve complex objectives such as area mapping, search operations, environmental monitoring, surveillance, and autonomous exploration. Vision Traditional robotic systems often depend on centralized control, making them vulnerable to single points of failure. HiveMind aims to demonstrate a different approach: a decentralized network where individual nodes cooperate, share information, and dynamically allocate tasks based on the current state of the mission. Inspired by natural swarm systems such as ant colonies and bee hives, HiveMind focuses on collective intelligence emerging from many simple units working together....
|
1792972554.7249331
|
1793058954.7249331
|
|
4741
|
speedMath Training by @viivi | Stardance
|
viivi
|
1
|
17.0
|
128
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-02T14:50:02Z", "hours": 17.0, "multiplier": 7.43, "payout": 128, "blessing": "neutral", "text": "speedMath Training is a website for training mental math. It’s super simple to use and you can adjust how hard questions do you want. I built this site using React and typescript. I’m aware that similar sites exists already, but none of them was exactly what I wanted so I developed my own. Before this project I had done courses that taught me developing websites with React and those courses included coding simple projects. But speedMath Training is my first own frontend project with React. The site is quite simple, but it wasn’t super easy for me to build it. I had never used Zustand state management solution, but I learned to use it to make state management easier. Other new thing I learned was publishing a site with github pages. It was kind of complicated, because i have separated folders for frontend (this project) and back end (almost empty). But now I get a new site builded and deployed every time i push to the repository. Project README includes more details if someone is interested.", "repo": "https://github.com/ViLP357/speedMathTraining", "demo": "https://vilp357.github.io/speedMathTraining"}]...
|
[{"post_id": 39499, "ts": "202 [{"post_id": 39499, "ts": "2026-08-02T14:30:01Z", "hours": 1.0094, "text": "#11 devlog The final devlog, I guess. I fixed responsive issues and finished readme and now I’m about to ship this project. (Sorry for short devlog, I just wanted to this 1 hour to be counted.)"}, {"post_id": 35369, "ts": "2026-07-26T18:31:08Z", "hours": 1.7008, "text": "#10 devlog It’s (almost) a ready project! I fighted for over an hour to publish it in github pages. But it was worth it because it’s now liveee https://vilp357.github.io/speedMathTraining (pls test). Before shipping I still need to fix some responsive issues and finish readme, but we’re almost there."}, {"post_id": 13709, "ts": "2026-06-22T14:07:19Z", "hours": 3.0169, "text": "#9 devlog, days 10-12 (maybe?) It’s been a while since last devlog, mostly because I haven’t had time to work with this, but also because hasn’t been any big updates. But now it’s time for you… to meet Calc, the mascot of the speedMath Training. I still need to add Calc to the site. I’m also planning to make a buddy for them and together they will cheer you on."}, {"post_id": 8841, "ts": "2026-06-14T18:20:07Z", "hours": 1.3214, "text": "#8 devlog, day 9 The UI is starting to look good and is much better than few days ago. Today I spent most of my time working on the main screen and a significant amount of it was used to do styles for the checkboxes. I don’t know yet much time I want to use for this project, because it has already all the core features I have thought. I have been planning other new projects and I need time for those and I don’t have as much motivation as before for this project. Anyways, things I will do before shipping: -Make it more mobile friendly -Finish styles for components -Fix component placing"}, {"post_id": 7454, "ts": "2026-06-12T12:52:05Z", "hours": 1.5856, "text": "#7 devlog, day 8 Today I finally managed to create a color palette that works with both light and dark mode. This is only beginning of the UI upgrade so more coming later. the most critical things to do next: -move the timer (why is it even there???) -scale content"}, {"post_id": 6317, "ts": "2026-06-10T17:07:57Z", "hours": 1.3153, "text": "#6 devlog day 7 Today I continued working by starting to design UI. The image shows color palettes I have thought. The upper is for light mode and lower is for dark mode. I still have to figure out contrast things. I thought I’d use the green for buttons with either white or black text, but I barely could see the white text so something has to be done? Maybe other color or shadows for text."}, {"post_id": 6224, "ts": "2026-06-10T13:46:13Z", "hours": 1.9433, "text": "#5 devlog, days 5-7 New updates: choose number of questions number generating fixed Daily challenge page How I fixed number generating How I tried before Math.floor(Math.random()*(Math.pow(10,digits[0]))*Math.pow(10, digits[1]-digits[0])) and Math.floor((Math.random() * 10)*(Math.pow(10, digits[0]-1))*Math.pow(10, Math.ceil(Math.random() * digits[1]-digits[0]))) Where digits[0] is minimum number of digits and digits[1] is maximum number of digits How it works now: A function randomNumber gets number of decimals as paramater and the function is called randomNumber(Math.round(Math.random() * (digits[1]-digits[0])) + digits[0]) Problems this fixes: Generating numbers with less digits that minimum generating different number of digits unequally (more digits was much more common) Next thing to do: UI upgrade"}, {"post_id": 2711, "ts": "2026-06-05T13:02:02Z", "hours": 1.4031, "text": "#4 devlog, day 4 Today’s main progress happened with giving players more options to customize questions. Now it’s possible to choose how many digits they want their questions to have. Next thing to do is add question number chooser. There is only one little (big) problem with digits adjuster logic: numbers with more digits tend to be much more common because of the number generating logic. I hope I can find the solution to fix that soon. As you can see from the picture, I added some color to the website, but just to be able to see different component better. Hopefully the final design will be much more better."}, {"post_id": 2275, "ts": "2026-06-04T17:50:25Z", "hours": 1.7203, "text": "#3 devlog, day 3 Today I finally made the timer and now this project could be actually called a “game”. It wasn’t easy to code the timer and make it work as it’s supposed. For some reason updating the timer updated the questions (which happened every second), but it was easy to fix when I figured out why it happened. (Why: the state timer component uses belonged to its parent component, where the questions are created. But when I updated time in timer component, it caused parent component to rerender again too. The way to fix that was to move question creating inside its own state and that way quesions are created only once.) When the timer finally worked, I quickly added simple navigation structure using react router library. Adding that structure required some refactoring, but I will thank myself later for doing it so early. I was also a bit surprised but happy because nothing broke when I moved some components from one to another."}, {"post_id": 1432, "ts": "2026-06-03T13:50:21Z", "hours": 0.9961, "text": "#2 devlog, day2 Now I have worked on this project for 2hr during Stardance. The new feature works now: it is possible to choose which operators you want to be used (and it actually works!). I also realized that division is more tricky to implement, so that’s why I just deleted it. I’m coding this in typescript, because I wanted to challenge myself, but it takes sometimes so long to figure right types even for simple objects. At least I learned a lot of new things, hehe. Tomorrow -Timer"}, {"post_id": 1400, "ts": "2026-06-03T12:34:36Z", "hours": 1.1967, "text": "speedMath training -The first devlog- Starting this project This project is a website where you can practice your mental math skills. The image shows how the site looked before Stardance. Before Stardance, I had only created this project(done set up, configured git) and coded < 5hr. Then I decided to continue working on this later. I feel like Stardance is a great opportunity for me to continue working on this. I’m aware that similar projects already exist, but I feel like none of them are exactly what I want and need. For example, they have bad UI, require users to log in, or are way too complicated. So this is going to be (hopefully) different. Next things I will do: -add timer -add a difficulty adjuster Other things I will/might do later: -improve the UI -add a leaderboard -add cute characters that cheer for you"}]...
|
Title: speedMath Training by @viivi | Stardance
D Title: speedMath Training by @viivi | Stardance
Devlogs:
speedMath training -The first devlog- Starting this project This project is a website where you can practice your mental math skills. The image shows how the site looked before Stardance. Before Stardance, I had only created this project(done set up, configured git) and coded < 5hr. Then I decided to continue working on this later. I feel like Stardance is a great opportunity for me to continue working on this. I’m aware that similar projects already exist, but I feel like none of them are exactly what I want and need. For example, they have bad UI, require users to log in, or are way too complicated. So this is going to be (hopefully) different. Next things I will do: -add timer -add a difficulty adjuster Other things I will/might do later: -improve the UI -add a leaderboard -add cute characters that cheer for you
#2 devlog, day2 Now I have worked on this project for 2hr during Stardance. The new feature works now: it is possible to choose which operators you want to be used (and it actually works!). I also realized that division is more tricky to implement, so that’s why I just deleted it. I’m coding this in typescript, because I wanted to challenge myself, but it takes sometimes so long to figure right types even for simple objects. At least I learned a lot of new things, hehe. Tomorrow -Timer
#3 devlog, day 3 Today I finally made the timer and now this project could be actually called a “game”. It wasn’t easy to code the timer and make it work as it’s supposed. For some reason updating the timer updated the questions (which happened every second), but it was easy to fix when I figured out why it happened. (Why: the state timer component uses belonged to its parent component, where the questions are created. But when I updated time in timer component, it caused parent component to rerender again too. The way to fix that was to move question creating inside its own state and that way quesions are created only once.) When the timer finally worked, I quickly added simple navigation structure using react router library. Adding that structure required some refactoring, but I will thank myself later for doing it so early. I was also a bit surprised but happy because nothing broke when I moved some components from one to another.
#4 devlog, day 4 Today’s main progress happened with giving players more options to customize questions. Now it’s possible to choose how many digits they want their questions to have. Next thing to do is add question number chooser. There is only one little (big) problem with digits adjuster logic: numbers with more digits tend to be much more common because of the number generating logic. I hope I can find the solution to fix that soon. As you can see from the picture, I added some color to the website, but just to be able to see different component better. Hopefully the final design will be much more better.
#5 devlog, days 5-7 New updates: choose number of questions number generating fixed Daily challenge page How I fixed number generating How I tried before Math.floor(Math.random()*(Math.pow(10,digits[0]))*Math.pow(10, digits[1]-digits[0])) and Math.floor((Math.random() * 10)*(Math.pow(10, digits[0]-1))*Math.pow(10, Math.ceil(Math.random() * digits[1]-digits[0]))) Where digits[0] is minimum number of digits and digits[1] is maximum number of digits How it works now: A function randomNumber gets number of decimals as paramater and the function is called randomNumber(Math.round(Math.random() * (digits[1]-digits[0])) + digits[0]) Problems this fixes: Generating numbers with less digits that minimum generating different number of digits unequally (more digits was much more common) Next thing to do: UI upgrade
#6 devlog day 7 Today I continued working by starting to design UI. The image shows color palettes I have thought. The upper is for light mode and lower is for dark mode. I still have to figure out contrast things. I thought I’d use the green for buttons with either white or black text, but I barely could see the white text so something has to be done? Maybe other color or shadows for text.
#7 devlog, day 8 Today I finally managed to create a color palette that works with both light and dark mode. This is only beginning of the UI upgrade so more coming later. the most critical things to do next: -move the timer (why is it even there???) -scale content
#8 devlog, day 9 The UI is starting to look good and is much better than few days ago. Today I spent most of my time working on the main screen and a significant amount of it was used to do styles for the checkboxes. I don’t know yet much time I want to use for this project, because it has already all the core features I have thought. I have been planning other new projects and I need time for those and I don’t have as much motivation as before for this project. Anyways, things I will do before shipping: -Make it more mobile friendly -Finish styles for components -Fix component placing
#9 devlog, days 10-12 (maybe?) It’s been a while since last devlog, mostly because I haven’t had time to work with this, but also because hasn’t been any big updates. But now it’s time for you… to meet Calc, the mascot of the speedMath Training. I still need to add Calc to the site. I’m also planning to make a buddy for them and together they will cheer you on.
#10 devlog It’s (almost) a ready project! I fighted for over an hour to publish it in github pages. But it was worth it because it’s now liveee https://vilp357.github.io/speedMathTraining (pls test). Before shipping I still need to fix some responsive issues and finish readme, but we’re almost there.
#11 devlog The final devlog, I guess. I fixed responsive issues and finished readme and now I’m about to ship this project. (Sorry for short devlog, I just wanted to this 1 hour to be counted.)
Ships:
speedMath Training is a website for training mental math. It’s super simple to use and you can adjust how hard questions do you want. I built this site using React and typescript. I’m aware that similar sites exists already, but none of them was exactly what I wanted so I developed my own. Before this project I had done courses that taught me developing websites with React and those courses included coding simple projects. But speedMath Training is my first own frontend project with React. The site is quite simple, but it wasn’t super easy for me to build it. I had never used Zustand state management solution, but I learned to use it to make state management easier. Other new thing I learned was publishing a site with github pages. It was kind of complicated, because i have separated folders for frontend (this project) and back end (almost empty). But now I get a new site builded and deployed every time i push to the repository. Project README includes more details if someone is interested....
|
1792968892.8717685
|
1793055292.8717685
|
|
4742
|
Rustic Pride by @hackclub_nutrient623 | Stardance
|
hackclub_nutrient623
|
1
|
18.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-11T21:24:45Z", "hours": 18.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Rustic Pride - A Rust based CLI application that provides information on different LGBTQIAS+ orientations and their flags. It does exactly what the name says currently. It provides information and flags of different LGBTQIAS+ orientations and terms. All from the MediaWiki powered site https://lgbtqia.wiki/ . Currently Rust is needed to be able to install the program, as crates.io is the only distribution method. I debated about how I wanted to distribute this for a while. For one of my other projects, I had used GitHub actions. But I am no-longer using GitHub. Forgejo has actions, though I don’t seem to have access to the necessary runners from Git.Gay. Granted I didn’t try very hard to figure out how that actually worked. I diffident want to switch back to Windows just for compiling an exe (I switched to my Linux install for the final bit of coding as a celebration of the first release. Don’t question my logic or what I find honorable.) and cross-compiling didn’t want to work. OS Error 2. Ratatui is kinda weird to work with. I’m starting to get the hang of it kinda though. After building three programs with it. Slint was a lot easier. But that’s not in the terminal. Slint was even pre-ai coding. Ratatui I get to use Claude and Mistral and Gemini (and the amazing documentation Rust crates have) to figure things out. Most of this project’s UI I was able to yoink from one of my other projects though. The only entirely custom to this project UI element is the query response page.", "repo": "https://git.gay/nova-shadowtail/Rustic-Pride", "demo": "https://crates.io/crates/rustic-pride"}]...
|
[{"post_id": 7060, "ts": "2026 [{"post_id": 7060, "ts": "2026-06-11T20:37:37Z", "hours": 3.0467, "text": "The first release is here. . . I made the UI look more like I originally wanted, which I am now realizing that I never shared the drawing of. It originally didn’t work very well. The issue was that I am apparently bad at typing numbers. I put the wrong indexing location for some of the widgets / layouts in render_page. That was an easy fix though. The images in this post will show that issue. , , Because of what happened last devlog, I am anticipating that the images will not display very well and have pre-uploaded them to Dropbox for your viewing enjoyment. https://www.dropbox.com/scl/fo/1jxnglincmsw2ji6hybp9/ABBOiI6-PvWQRNzOfEsT32A?rlkey=jh4r8jwidm8mqgjxkxey5xm2z&st=4yolviyf&dl=0 , , I debated about how I wanted to distribute this for a while. For one of my other projects (PRTGN, https://git.gay/PRTGN-Development-Team/.prtgn ), I had used GitHub actions. But I am no-longer using GitHub. Forgejo has actions, though I don’t seem to have access to the necessary runners from Git.Gay. Granted I didn’t try very hard to figure out how that actually worked. I diffident want to switch back to Windows just for compiling an exe (I switched to my Linux install for the final bit of coding as a celebration of the first release. Don’t question my logic or what I find honorable.) and cross-compiling didn’t want to work. OS Error 2. So I ended up at crates.io. Only downside is one needs Rust to install the program. , , There is still much that can be done, but this application now fully fits its original intent. A Rust based CLI application that provides information on different LGBTQIAS+ orientations and their flags. , . https://git.gay/nova-shadowtail/Rustic-Pride . https://crates.io/crates/rustic-pride"}, {"post_id": 6504, "ts": "2026-06-10T22:39:35Z", "hours": 2.6558, "text": "I got the new screen to work! I am close to a first release. At first the screen was a bit wonk but after changing a couple of numbers, I fixed it. Enby is without the fix, trans is with the fix. Now all that’s left to get a first release, is adding render engine selection so that halfblocks isn’t used for everything, adding a few more user instructions, and making install files. At least as of typing this that’s all that is left. Next version may see a fancy in-terminal web browser for the link. And maybe some UI cleanups."}, {"post_id": 5121, "ts": "2026-06-08T20:12:46Z", "hours": 1.8358, "text": "I abandoned that version of image displaying. Reverted to the working just text from earlier. Though at least there is text wrapping now. And error handling."}, {"post_id": 4541, "ts": "2026-06-07T21:43:30Z", "hours": 3.8003, "text": "Spent this three hours trying to get images to work. I am worse off than I was before starting this segment. Now nothing displays on the output. Codestral was no help in debugging. It just told me to add more logs, which I did because they are useful. Still doesn’t work because nothing was actually changed, still says to add more logs. The cycle repeats. Tried multiple different terminals with and without WSL. Nothing. I know Konsole should work, and Windows’s terminal, as they work fine in my other programs. But no. Apparently they don’t want to. I know halfblocks works. I have used it before. It is not at all good quality, but it should at least display. Need to figure that out."}, {"post_id": 3799, "ts": "2026-06-06T21:03:18Z", "hours": 2.4303, "text": "There is a fully functional JSON API and some formatting now. I was able to get the header image URL as well. Now the main thing I need to do is figure out the UI for displaying the information. I was originally going to use Ratatui-Image for the images, however discovered it doesn’t work very well in Windows. Normally I am using either WSL or my install of Fedora, so for all my other projects this isn’t particularly an issue. However, I am developing on Windows currently due to some of my other projects. And I want people to be able to use this program in Windows. So I will need to investigate that further. Though enjoy this video which may or may not work of the current standing of the program."}, {"post_id": 2963, "ts": "2026-06-05T21:33:34Z", "hours": 1.7844, "text": "I almost have Serde working with JSON. I still need to figure out how to get the information out of the message sent by the mediawiki api. The problem there is how the API sends information verse how I know how to parse it with Serde. I am currently using a method for parcing which requires telling the program what each level of JSON is. The mediawiki api puts the page ID number in a level above all the information I need. The ID number would change with every diffrent search. You may be able to see how that would be a problem. Need to figure that one out. And I need to then make the TUI that displays the text. And I should figure out what to do if the program comes back with more than one page. And I need to figure out how I want to display the flags. Probably with ratatui-image, its just a matter of getting it to work with everything else. The only working instance of it I have is in a sub command of PRTGN dedicated to displaying an image (PRTGN_Fox)."}, {"post_id": 1064, "ts": "2026-06-02T21:31:41Z", "hours": 2.2286, "text": "I started work today. I was able to get the program to a stage where it technically works. It sends an API call to a mediawiki powered site, and gets a response. All through a TUI. I stole the base of the code from one of my other projects in which I am attempting to accomplish quite a similar thing. The project is called PRTGN if you want to check it out. The command that I stole from is PRTGN_Wiki. https://git.gay/PRTGN-Development-Team I still need to format the response nicely, and get the other wiki working. And I may add flag support. But like I said, it technically works."}]...
|
Title: Rustic Pride by @hackclub_nutrient623 | Sta Title: Rustic Pride by @hackclub_nutrient623 | Stardance
Devlogs:
I started work today. I was able to get the program to a stage where it technically works. It sends an API call to a mediawiki powered site, and gets a response. All through a TUI. I stole the base of the code from one of my other projects in which I am attempting to accomplish quite a similar thing. The project is called PRTGN if you want to check it out. The command that I stole from is PRTGN_Wiki. https://git.gay/PRTGN-Development-Team I still need to format the response nicely, and get the other wiki working. And I may add flag support. But like I said, it technically works.
I almost have Serde working with JSON. I still need to figure out how to get the information out of the message sent by the mediawiki api. The problem there is how the API sends information verse how I know how to parse it with Serde. I am currently using a method for parcing which requires telling the program what each level of JSON is. The mediawiki api puts the page ID number in a level above all the information I need. The ID number would change with every diffrent search. You may be able to see how that would be a problem. Need to figure that one out. And I need to then make the TUI that displays the text. And I should figure out what to do if the program comes back with more than one page. And I need to figure out how I want to display the flags. Probably with ratatui-image, its just a matter of getting it to work with everything else. The only working instance of it I have is in a sub command of PRTGN dedicated to displaying an image (PRTGN_Fox).
There is a fully functional JSON API and some formatting now. I was able to get the header image URL as well. Now the main thing I need to do is figure out the UI for displaying the information. I was originally going to use Ratatui-Image for the images, however discovered it doesn’t work very well in Windows. Normally I am using either WSL or my install of Fedora, so for all my other projects this isn’t particularly an issue. However, I am developing on Windows currently due to some of my other projects. And I want people to be able to use this program in Windows. So I will need to investigate that further. Though enjoy this video which may or may not work of the current standing of the program.
Spent this three hours trying to get images to work. I am worse off than I was before starting this segment. Now nothing displays on the output. Codestral was no help in debugging. It just told me to add more logs, which I did because they are useful. Still doesn’t work because nothing was actually changed, still says to add more logs. The cycle repeats. Tried multiple different terminals with and without WSL. Nothing. I know Konsole should work, and Windows’s terminal, as they work fine in my other programs. But no. Apparently they don’t want to. I know halfblocks works. I have used it before. It is not at all good quality, but it should at least display. Need to figure that out.
I abandoned that version of image displaying. Reverted to the working just text from earlier. Though at least there is text wrapping now. And error handling.
I got the new screen to work! I am close to a first release. At first the screen was a bit wonk but after changing a couple of numbers, I fixed it. Enby is without the fix, trans is with the fix. Now all that’s left to get a first release, is adding render engine selection so that halfblocks isn’t used for everything, adding a few more user instructions, and making install files. At least as of typing this that’s all that is left. Next version may see a fancy in-terminal web browser for the link. And maybe some UI cleanups.
The first release is here. . . I made the UI look more like I originally wanted, which I am now realizing that I never shared the drawing of. It originally didn’t work very well. The issue was that I am apparently bad at typing numbers. I put the wrong indexing location for some of the widgets / layouts in render_page. That was an easy fix though. The images in this post will show that issue. , , Because of what happened last devlog, I am anticipating that the images will not display very well and have pre-uploaded them to Dropbox for your viewing enjoyment. https://www.dropbox.com/scl/fo/1jxnglincmsw2ji6hybp9/ABBOiI6-PvWQRNzOfEsT32A?rlkey=jh4r8jwidm8mqgjxkxey5xm2z&st=4yolviyf&dl=0 , , I debated about how I wanted to distribute this for a while. For one of my other projects (PRTGN, https://git.gay/PRTGN-Development-Team/.prtgn ), I had used GitHub actions. But I am no-longer using GitHub. Forgejo has actions, though I don’t seem to have access to the necessary runners from Git.Gay. Granted I didn’t try very hard to figure out how that actually worked. I diffident want to switch back to Windows just for compiling an exe (I switched to my Linux install for the final bit of coding as a celebration of the first release. Don’t question my logic or what I find honorable.) and cross-compiling didn’t want to work. OS Error 2. So I ended up at crates.io. Only downside is one needs Rust to install the program. , , There is still much that can be done, but this application now fully fits its original intent. A Rust based CLI application that provides information on different LGBTQIAS+ orientations and their flags. , . https://git.gay/nova-shadowtail/Rustic-Pride . https://crates.io/crates/rustic-pride
Ships:
Rustic Pride - A Rust based CLI application that provides information on different LGBTQIAS+ orientations and their flags. It does exactly what the name says currently. It provides information and flags of different LGBTQIAS+ orientations and terms. All from the MediaWiki powered site https://lgbtqia.wiki/ . Currently Rust is needed to be able to install the program, as crates.io is the only distribution method. I debated about how I wanted to distribute this for a while. For one of my other projects, I had used GitHub actions. But I am no-longer using GitHub. Forgejo has actions, though I don’t seem to have access to the necessary runners from Git.Gay. Granted I didn’t try very hard to figure out how that actually worked. I diffident want to switch back to Windows just for compiling an exe (I switched to my Linux install for the final bit of coding as a celebration of the first release. Don’t question my logic or what I find honorable.) and cross-compiling didn’t want to work. OS Error 2. Ratatui is kinda weird to work with. I’m starting to get the hang of it kinda though. After building three programs with it. Slint was a lot easier. But that’s not in the terminal. Slint was even pre-ai coding. Ratatui I get to use Claude and Mistral and Gemini (and the amazing documentation Rust crates have) to figure things out. Most of this project’s UI I was able to yoink from one of my other projects though. The only entirely custom to this project UI element is the query response page....
|
1792983271.1393385
|
1793069671.1393385
|
|
4745
|
Astropass-Smart Rfid Crew access system by @Ashish Astropass-Smart Rfid Crew access system by @AshishPatel | Stardance...
|
AshishPatel
|
1
|
11.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-16T09:40:05Z", "hours": 11.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I built AstroPass, a physical RFID-based security clearance terminal using an Arduino micro-controller and an I2C LCD display. What was challenging: The biggest challenge was structuring the core logic loops and troubleshooting the liquid crystal libraries to handle hardware states smoothly. Managing the active input buffer to read passcodes and RFID badge IDs in real-time through the terminal required a lot of precise code refining. What I’m proud of: I am incredibly proud of building a custom switch-case state machine to handle all user interface transitions flawlessly. I also successfully implemented a 3-strike security lockout system that triggers an automatic 8-second cooldown with a warning triangle icon on screen if an invalid card is scanned three times, alongside an active success chime on a physical hardware buzzer. What people should know to test it: The entire project code is completely open-sourced on my GitHub repository. The system prints the full live access and scan history cleanly straight to the Serial Monitor for instant logging!", "repo": "https://github.com/ashish030810/AstroPass", "demo": ""}]...
|
[{"post_id": 4374, "ts": "2026 [{"post_id": 4374, "ts": "2026-06-07T18:04:30Z", "hours": 1.5883, "text": "I finally finished Astropass and hit my 11 hours! I cleaned up the whole codebase and got everything running smoothly. I ended up adding custom graphics to the LCD screen like a padlock, checkmark, and warning triangle, and I used a clean switch-case state machine to handle all the terminal transitions without any bugs. I also built in a 3-strike security lockout that triggers an automatic 8-second cooldown if an invalid badge is scanned three times, and I set up a circular log system that prints the full access history straight to the Serial Monitor. Everything is fully pushed to GitHub and ready, so I’m officially moving on to my new Astro-Flora greenhouse project now!"}, {"post_id": 4219, "ts": "2026-06-07T13:32:42Z", "hours": 8.8172, "text": "Devlog #2 : Bringing the Astropass Core to Life! 📡🛸 What I did today: Successfully laid down the foundation for the Astropass security terminal and got the I2C LCD display fully integrated with the system logic! New Features: * Fixed up the primary input buffer to read passcodes and badge IDs in real-time through the terminal lines. Programmed the LCD to show live system updates (SCAN PASSPORT…) instead of just hiding the data in the background. Added a dynamic fast-pass check that immediately flips the screen to > ACCESS GRANTED and triggers a high-frequency success chime on the buzzer when a valid badge is detected. Progress: Spent a solid block of hours structuring the basic logic loops and troubleshooting the liquid crystal libraries. Ready to start scaling this up into a multi-user security system! 💎"}, {"post_id": 1959, "ts": "2026-06-04T06:28:06Z", "hours": 0.8683, "text": "Project Name:AstroPass Today’s Progress: Successfully created and initialized a brand new GitHub repository for this second project. Uploaded all the initial core project files to the repository. Set up the demo link to showcase the current state of the project. What I’m working on next: Continuing to build out the next set of features and refining the code."}]...
|
Title: Astropass-Smart Rfid Crew access system by Title: Astropass-Smart Rfid Crew access system by @AshishPatel | Stardance
Devlogs:
Project Name:AstroPass Today’s Progress: Successfully created and initialized a brand new GitHub repository for this second project. Uploaded all the initial core project files to the repository. Set up the demo link to showcase the current state of the project. What I’m working on next: Continuing to build out the next set of features and refining the code.
Devlog #2 : Bringing the Astropass Core to Life! 📡🛸 What I did today: Successfully laid down the foundation for the Astropass security terminal and got the I2C LCD display fully integrated with the system logic! New Features: * Fixed up the primary input buffer to read passcodes and badge IDs in real-time through the terminal lines. Programmed the LCD to show live system updates (SCAN PASSPORT…) instead of just hiding the data in the background. Added a dynamic fast-pass check that immediately flips the screen to > ACCESS GRANTED and triggers a high-frequency success chime on the buzzer when a valid badge is detected. Progress: Spent a solid block of hours structuring the basic logic loops and troubleshooting the liquid crystal libraries. Ready to start scaling this up into a multi-user security system! 💎
I finally finished Astropass and hit my 11 hours! I cleaned up the whole codebase and got everything running smoothly. I ended up adding custom graphics to the LCD screen like a padlock, checkmark, and warning triangle, and I used a clean switch-case state machine to handle all the terminal transitions without any bugs. I also built in a 3-strike security lockout that triggers an automatic 8-second cooldown if an invalid badge is scanned three times, and I set up a circular log system that prints the full access history straight to the Serial Monitor. Everything is fully pushed to GitHub and ready, so I’m officially moving on to my new Astro-Flora greenhouse project now!
Ships:
I built AstroPass, a physical RFID-based security clearance terminal using an Arduino micro-controller and an I2C LCD display. What was challenging: The biggest challenge was structuring the core logic loops and troubleshooting the liquid crystal libraries to handle hardware states smoothly. Managing the active input buffer to read passcodes and RFID badge IDs in real-time through the terminal required a lot of precise code refining. What I’m proud of: I am incredibly proud of building a custom switch-case state machine to handle all user interface transitions flawlessly. I also successfully implemented a 3-strike security lockout system that triggers an automatic 8-second cooldown with a warning triangle icon on screen if an invalid card is scanned three times, alongside an active success chime on a physical hardware buzzer. What people should know to test it: The entire project code is completely open-sourced on my GitHub repository. The system prints the full live access and scan history cleanly straight to the Serial Monitor for instant logging!...
|
1792979376.931659
|
1793065776.931659
|
|
4772
|
Pandapad by @panda | Stardance
|
panda
|
1
|
14.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-15T18:44:21Z", "hours": 14.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a custom macropad built from scratch and assembled in a neat, presentable manner. I made the PCB, Case, etc. from scratch, and used the tutorial from the #hackpad mission !", "repo": "https://github.com/mail2adnanyazik-bit/pandaPad", "demo": ""}]...
|
[{"post_id": 5874, "ts": "2026 [{"post_id": 5874, "ts": "2026-06-09T20:35:09Z", "hours": 1.5886, "text": "Finished firmware with QMK - needed deepseek to carry me through this part t-t Also made README.md for entire project"}, {"post_id": 4510, "ts": "2026-06-07T21:00:07Z", "hours": 6.1131, "text": "Finished 3D model for PandaPad ! Added all 3D models - for Components, PCB, body, case, plate, and switch matrix plate."}, {"post_id": 4185, "ts": "2026-06-07T12:27:36Z", "hours": 2.5642, "text": "Decided on mounting method (sandwich mount), imported PCB, and created Plate for Switch Matrix"}, {"post_id": 3762, "ts": "2026-06-06T20:14:19Z", "hours": 0.4222, "text": "FIXED : Stupid mistake on my part - forgot to expose Microcontroller USB Port and had to move, rotate and rewire"}, {"post_id": 3670, "ts": "2026-06-06T18:33:38Z", "hours": 1.7714, "text": "Finished wiring and arranging PCB for PandaPad !"}, {"post_id": 3612, "ts": "2026-06-06T16:45:07Z", "hours": 1.5708, "text": "Finished Schematic for the PandaPad !"}]...
|
Title: Pandapad by @panda | Stardance
Devlogs:
Fi Title: Pandapad by @panda | Stardance
Devlogs:
Finished Schematic for the PandaPad !
Finished wiring and arranging PCB for PandaPad !
FIXED : Stupid mistake on my part - forgot to expose Microcontroller USB Port and had to move, rotate and rewire
Decided on mounting method (sandwich mount), imported PCB, and created Plate for Switch Matrix
Finished 3D model for PandaPad ! Added all 3D models - for Components, PCB, body, case, plate, and switch matrix plate.
Finished firmware with QMK - needed deepseek to carry me through this part t-t Also made README.md for entire project
Ships:
I made a custom macropad built from scratch and assembled in a neat, presentable manner. I made the PCB, Case, etc. from scratch, and used the tutorial from the #hackpad mission !...
|
1792990558.5189233
|
1793076958.5189233
|
|
4774
|
YPT Pc Client by @world | Stardance
|
world
|
1
|
14.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-03T13:32:19Z", "hours": 14.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I reverse-engineered an existing Android app called YPT using mitmproxy and developed an unofficial PC client using Flutter. It is currently available for web, Windows, Linux, and macOS.", "repo": "https://github.com/deveworld/ypt_client/", "demo": "https://deveworld.github.io/ypt_client/"}]...
|
[{"post_id": 1417, "ts": "2026 [{"post_id": 1417, "ts": "2026-06-03T13:26:26Z", "hours": 12.3597, "text": "We supports social logins in Windows, Linux, MacOS with Pre-Built executable program! Use YPT in your PC"}, {"post_id": 896, "ts": "2026-06-02T16:55:56Z", "hours": 0.4028, "text": "Fully Working YPT Flutter App!"}, {"post_id": 872, "ts": "2026-06-02T16:23:02Z", "hours": 1.2361, "text": "API Spec Reverse Engineering via WayDroid And I made Flutter App for PC!"}]...
|
Title: YPT Pc Client by @world | Stardance
Devlog Title: YPT Pc Client by @world | Stardance
Devlogs:
API Spec Reverse Engineering via WayDroid And I made Flutter App for PC!
Fully Working YPT Flutter App!
We supports social logins in Windows, Linux, MacOS with Pre-Built executable program! Use YPT in your PC
Ships:
I reverse-engineered an existing Android app called YPT using mitmproxy and developed an unofficial PC client using Flutter. It is currently available for web, Windows, Linux, and macOS....
|
1792979446.1247568
|
1793065846.1247568
|
|
4783
|
pandaBot by @panda | Stardance
|
panda
|
1
|
1.29
|
1
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-02T19:21:28Z", "hours": 1.0, "multiplier": 1.04, "payout": 1, "blessing": "neutral", "text": "Just followed the tutorial :D", "repo": "https://github.com/mail2adnanyazik-bit/pandaBot", "demo": "https://hackclub.enterprise.slack.com/archives/C0B7ULL3WKW"}]...
|
[{"post_id": 6136, "ts": "2026 [{"post_id": 6136, "ts": "2026-06-10T10:11:45Z", "hours": 0.2933, "text": "Fixed demo link to be correct"}, {"post_id": 864, "ts": "2026-06-02T16:04:39Z", "hours": 0.5214, "text": "Just finished setting up a Slack bot and running it on my homeserver !"}]...
|
Title: pandaBot by @panda | Stardance
Devlogs:
Ju Title: pandaBot by @panda | Stardance
Devlogs:
Just finished setting up a Slack bot and running it on my homeserver !
Fixed demo link to be correct
Ships:
Just followed the tutorial :D...
|
1792983193.284319
|
1793069593.284319
|
|
4799
|
Evochess by @Sam | Stardance
|
Sam
|
1
|
225.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T04:56:14Z", "hours": 225.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Let’s ship 🚢 This is a website where people can learn and improve their chess skills by watching courses, solving puzzles and practicing their vision. The website was overall really challenging to build. If I had do pick, it would definitely be making a working chessboard for puzzles. At the beginning of the project I didn’t even know if I was capable of building one but I am really glad I tried as I’ve learned so much. Another challenging thing would definitely be making the website responsive. I don’t like making website responsive and in this project animations added another layer of complexity. I’ve tried my best to keep things responsive though. I am really proud of completing the project and mainly working chessboard as this is my first time building something like this. I am also proud of the animations and the ui of the website. To test my website some knowledge of chess is preferred but even if you have zero knowledge about chess you can test out my project as there are courses which will teach you about chess. Thanks stardance for everything 💖💖. I probably would never have created or completed this project without stardance😄", "repo": "https://github.com/samgod1/Chess-website", "demo": "https://evochess.vercel.app"}]...
|
[{"post_id": 79525, "ts": "202 [{"post_id": 79525, "ts": "2026-10-14T13:11:44Z", "hours": 3.0406, "text": "THIS MIGHT BE THE LAST DEVLOG First I polished the puzzles sidebar. I made the sidebar width to be same as vision page sidebar. Then I changed the level button size as they were too small for larger screens. I also made the level button container scrollable if the level buttons overflow. This took the most time because the whole puzzles sidebar body was overflowing pushing down that start button. I just wanted the sidebar body to not overflow which would make the levels container to be scrollable. The fix at last was using min-height: 0 to the sidebar body. Idk how the min-height: 0 is helping here 😭 . Next I made the visualization section animation (The last section of the home page) to appear quicker. This was a recommendation from my brother as when scrolling previously the section might seem like it contained nothing until you scroll fully. I faced issued mainly with the section not pinning to the top of screen when trying to move the animation timeline starting point. Also I tried to placing text higher on y axis and animate it coming down with the user scroll which produce the result I was expecting. So, I split the timeline into two. The first one reveals the text and the second one shows a person visualizing. The tex revealing animation ends when the section top hits the top of the screen which makes the section pin to the top exactly how I wanted it to be. Then I polished vision page sidebar as follows: Made the sidebar responsive after user has clicked on start Made the sidebar header look better and fix mismatch of padding from body Returned to using flex for the attempts and mad them responsive Tweaked the options and info as they were looking odd in some screen sizes (mainly the tablet one which looked really bad) I then copied some of these changes to the puzzles sidebar for maintaining similarity. Lastly I capped the width of course, puzzles and vision page to 1600px by adding a wrapper element. It acted weird on puzzles and vision page sidebar as there was already a element named wrapper and so I changed the classname to page-wrapper."}, {"post_id": 76969, "ts": "2026-10-05T07:23:36Z", "hours": 1.8433, "text": "Fixing things and some more responsive things I’ve fixed chessboard displaying multiple selected squares. This happened when user selected a piece and then selected another piece by dragging. The fix was really simple. I just added resetSquares function when piece on drag start. I’ve also fixed pieces stacking on top of each other if user drags and drops a piece on another piece quickly before the opponents move happens. This was prevented when pieces are moved only by clicking but I forgot to prevent this if pieces were dragged and dropped. I did two things to prevent this: I reduced the time for opponent piece to move after the first move. I disabled the piece from dragging if it wasn’t the player’s turn. It seems the first fix wasn’t sufficient as it created another bug. So, if user selected a piece by clicking or dragging and then dragged the same piece then the destination squares and captureSquare will just completely disappear. The occurred due to resetSquares function that I had added. I thought for a while and came up with this solution. The resetSquares function only executes if user selects another piece on drag. However the function won’t execute if the selected Piece is being dragged. The selected piece state null at first so resetSquares() won’t also execute if selected piece is null. Now, it works as expected until and unless I find some bugs. Now returning back to the responsiveness. I fixed the puzzles button to be equal width and height. I had made the level buttons responsive before but they weren’t the same size. I had tried the aspect ratio last time as well but it was breaking the layout. Basically I used aspect ratio, removed the grid templated rows and changed some clamp values. Also I removed the media query below 1440px and integrated it as default css. After doing that, I started to fix the attempts in in vision sidebar. I thought it would take me two seconds to do it as I just had to apply the puzzle button knowledge here. I thought just doing this will work grid-template-columns: repeat(auto-fit, minmax(40px, 1fr)); I was wrong 😭 This worked fine for level buttons cuz the number of buttons were static. Here the attempts squares increases as the user clicks on the chessboard. If there’s only one attempt square then it will take the whole width. I was stuck after this. I tried different things such as using max-width, trying to add width: fit-content, etc. but nothing worked. At last I thought of reverting back to what the code orginally was which just used flex and flex wrap but coming this far I just used grid and used different values with height to make the attemps square kinda responsive. I still need to use clamp or something to make this look good. Uhhhhhh this is so frustrating… . I think I’m overexplaining things. I should just simplify down things"}, {"post_id": 75141, "ts": "2026-09-29T08:47:38Z", "hours": 2.0161, "text": "This devlog is a short one I’ve made the vision page responsive for larger screens. Last time I made the page responsive for mobile screens. I made some small changes in puzzles page while doing this for maintaining similar code . I ran into some issues such as css not working due to incorrect nesting and writing the writing the css on wrong file. Also, I removed media query for 1440px as the default css will work between 1024px and 1440px using clamp css functions and by doing that, above 1440px the css will stay the largest clamp value. I think I will do the same in puzzles page as well. 2hrs wen’t so quickly mainly cuz of my stupidity as I broke things that already was working fine. Also, I don’t think I like the mobile responsiveness that much but i don’t think i’ll change it now (or maybe I will). While writing this devlog I just realize that I’ve make the sidebar responsive after vision page has started. Uhhh i hate responsive design"}, {"post_id": 73203, "ts": "2026-09-24T16:25:05Z", "hours": 2.6344, "text": "Changed some puzzles and more responsiveness work Copied the puzzles page and it’s component’s media query css So after making puzzles page somewhat responsive last time, the first thing I decided to do after that was copying puzzles page media query css and just paste it in vision page as both of pages are very similar. This made the vision page and it’s components a little responsive. Puzzle changes I’ve changed the puzzle from level 12, 23 and 30. The 12 and 23 level had 2 ways to deliver checkmate and only one of them counted as correct. I changed them as user might get frustrated seeing that. My code doesn’t handle that so I just changed them. Level 30 was changed cuz it wasn’t really difficult. I don’t think I’m satisfied with the new level 30 puzzle either. One issue while polishing signup page I didn’t want the form to look squished on devices with small vertical screen size. Due to this last time I generally kept things smaller than what I wanted to make sure it looks okay for those devices. To fix that I added min-height to the form-container. It prevented the form from squishing but the form-container was overflowing as the puzzles page has 100dvh. What I wanted was just the form scrolling using overflow: scroll but this probably took me about 20-30 mins to make it work 😭 . I set overflow to scroll to form-container it didn’t work, added it to form which also didn’t work and then I added it to puzzles page. The scroll part was working when I added it on puzzles page but not what I was looking. Then I created a wrapper div to hold the img container and form container hoping now adding overflow:scroll to form container will do the job. After trying all things things I realized that the min-height was set to form container instead of form. The fix was to adding min-height to form and set overflow scroll to form-container. I removed the wrapper div after that as it was unnecessary and also hid the scrollbar that appears in form-container. Signup and login page polish after that annoying issue After that annoying issue I’d say things went pretty smoothly. I mainly used clamp as always for making things responsive. And as always it took me longer that expected. After polishing up the signup page I copied the code to login page and just changed signup to login. Vision page responsive on mobile devices Making the vision page responsive for mobile device was really similar as polishing signup page. I just used clamp for everything and made sure everything looked good. Now that I think about it i only made the sidebar responsive including the popup menu as only that is displayed on mobile devices and chessboard is hidden. The chessboard is also kinda responsive due to the copy pasting the puzzles page media query css. The making of sidebar responsive was just trying out different sizes and then putting the value into clamp calculator and copy pasting the value. Now, I’ll work on the vision page responsiveness for bigger devices and then if everything looks great after testing then I’ll ship the project"}, {"post_id": 71645, "ts": "2026-09-21T06:52:58Z", "hours": 3.2419, "text": "Made puzzles page responsive and bugs fixes Puzzles page responsive Most the time was spent making the puzzles page responsive. As always it took more time than expected. There were many issue that popped up and slowly but surely I fixed them. One of the issues was in bigger mobile screens the sidebar was being squished because the chessboard was getting really big but puzzles page has height of 100dvh as the chesboard in mobile phones is calculated according to width. To fix it I tried adding min-height to the sidebar for not getting squished and height of auto to puzzles page but this broke the sidebar when puzzles is not started cuz there’s no chessboard. The height of sidebar is 100% so due to the parent’s height being auto the sidebar height was about as didn’t fill the whole screen. To fix this I used overflow: scroll to puzzles page and it’s height to 100dvh. Another issue came when trying to make chessboard and sidebar look decent in different laptop sizes. I made it somehow work but using clamp, min-height, max-height, min-width and max width. It was kind of a pain to solve all the issues that came while doing this. That’s why I’ve rushed making the puzzles page responsive. My plan is to come and polish it after I’ve made the course page responsive as well. It shouldn’t be too difficult imo as it’s very similar to puzzles page. Fixed user being able to drag and drop opponent’s pieces It was a quite dumb bug. I had prevented this for click to move feature but I didn’t think about it in drag and drop. The fix was quite simple as dnd-kit (npm package) provides a disabled property in useDraggble. I disabled it for the pieces for dragging which had the opposite color of chessboard. Fix next puzzle button not working on second last level I didn’t actually know about this bug. A friend of mine told me about this issue while testing the website. After level 29 is completed a state is toggled to true which prevents the next button from not working. The next button is now only supposed to not work after completed the last level. I haven’t used fixed values for fixing this so in future if I decide to add or remove puzzles it shouldn’t break. The fix was a little more complex than I anticipated. 9 days of stardance remain now. So, I have to lock in now. Okay bie"}, {"post_id": 70097, "ts": "2026-09-18T13:33:32Z", "hours": 2.1928, "text": "We’re close to the end First I fixed the buggy dropping piece. I fixed this when I first worked on drag and drop piece feature but I don’t know how it broke again. When trying different things to fix it I tried to move the setIsDragging(false) lower inside dragEnd function below movePiece and capturePiece function calls. Surprisingly it worked 😄. I fixed light square being dark and vise versa if user had the black pieces. I found out this issue because the coordinates colors were mismatched. So my first intuition was changing the color of coords.jsx. I got really confused as the changes did nothing in the browser. I am so dumb I was changing the vision page chessboard’s coords.jsx instead of puzzles page chessboard’s coords.jsx. It worked but then I realized the coordinates color weren’t wrong square colors were. I undid the changes made to coords.jsx. I also seperated the coords.jsx but adding puzzles and vision in the name. Then I fixed the squares color for black’s board. I’ve figured out the mobile design for puzzle section. First the idea was that the chessboard and sidebar would be stacked on top of each other. This was the easy route but if I did that then it would add friction to the mobile players as they would have to scroll all the way down to start the puzzles. Then I looked at chess.com and they were doing it really well where only after clicking start puzzle the chessboard will appear. So I removed the chessboard below 425px first and then made the button text, size and gap smaller. I also removed the aspect ratio of 1/1 from the buttons as the buttons were ruining the gaps between them in certain screen sizes. Now for the first challenge I faced. How do I only make the chessboard appear and disappear when clicking start puzzle only on mobile devices. As I used gsap matchMedia to make the chessboard’s container display none or block according to hasPuzzleStarted for mobile screens. The chessboardSize is calculated according to chessboard container so that the chessboard is divisible by 4. When first loading the chessboard if the container has display none then the chessboardSize becomes zero and when setting the container to block will only show empty chessboard container without a board. I tried using the autoAlpha property of gsap hoping that it will do that same job as display none but without remove the element. It was making the container invisible but the container would still retain it’s height and width. I was starting to doubt myself here and was thinking to take the easy route but just stacking the board and sidebar vertically. After thinking for a while I came up with a breakthrough I made the position of chessboard container to absolute and visibility to invisible. Now the chessboard container won’t be visible and won’t take up any space as it is absolute. When the board used absolute position idk why but the board container got so bigger. It also distorted the pieces when puzzle started. To fix it I ran the gsapMatchMedia code only after chessboardSize is calculated which was a great idea. It fixed the board when the puzzle started but when it was hidden it was still large. I just replaced the absolute and visibility with display: none as it only runs after the chessboardSize is calculated, that’s why there is no issue with display:none. Last change is when sidebarMode is notStarted then only chessboard is hidden. I know that 80% of the things I say won’t be understood but I’m not a good explainer so you have do deal with it 😅. Were really close to the end now I just have to make puzzles page and vision page responsive and just polish the website and then click the ship button"}, {"post_id": 69180, "ts": "2026-09-16T15:22:21Z", "hours": 2.6522, "text": "Omg how does changing the color model solve the issue Before that I fixed the black piece being upside down when dragging. You can see it in my last devlog’s video. I was only happening with black pieces because to make the board work when user got the black pieces I just rotated the board 180 degree. This made all the pieces upside down and to fix that I again rotated the piece’s img 180 degree. Ig when dragging using dnd-kit (npm package) the transform value was being overwritten causing this issue. To fix the issue rather the rotating with board using css I changed the order of files and ranks. I used flex-direction column replacing column-reverse for the rank to start from 1 to 8. Then for reversing the files when color is black then I mapped squares from reversed files array using toReversed array method. I thought by doing this I’ll make the code cleaner but I think it’s more messy now 😭 . Also I did have hard time understanding my own code when trying to solve the issue 😭 . I fixed the pieces, destSquares and captureSquares being generated on the wrong squares. I realized the piece transition wasn’t working when capturing piece both for user’s piece and opponent’s piece. The transition only happens if hasPlacedPieces is set to true and isDragging is false. So, my first assumption the hasPlacedPieces was being turned to false only when capturing pieces but I was wrong. I was checked if it had something to do with the value of isDragging. I found the isDragging was never turned false so I fixed it but still the main issue wasn’t resolved. I was console logging things and just trying to figure out what was actually causing the issue. The fix was really simple. To implement the drag and drop feature I’ve broken down piece code into it’s own component. There inside the component I have added the key attribute and it was the issue. The key attribute is supposed to be used on the component itself instead of inside the component div. (Eg.) I don’t know why it only broke the capture transition but anyways it’s fixed Now to the part where I don’t even understand how does this even happen. Hopefully you understood what I was saying in the video btw please unmute the video as I am talking in that video. So what happened was the piece img bg color changes when it’s selected. This was working fine until I added the dragging feature. When the piece is dragged you see the background color comes along with the piece. So I decided that the square should change it’s color rather than the img inside the piece. I was going to create squareRefs for holding all the values of sqaures and then select the square using gsap to change the color but I realized a easier way would be to just target the square id. It worked so I also decided to use for changing background color of square when user move was either correct or incorrect. On light squares it worked great and it also fixed the animation as the same animation was working a little weirdly when using pieceRefs. I was happy that it was better but then I found the bug from the video. I tried different things and just couldn’t figure out what was the issue but when I decided to change the color from var(–c-red) to yellow it worked as intended. Then I changed the same hsl color into hex and it also worked but I don’t know whyyyy. If someone knows why this happened please tell me cuz it’s ridiculous. Most of the issue had a simple solution but learning what caused the issue what the difficult part."}, {"post_id": 68502, "ts": "2026-09-15T07:18:35Z", "hours": 3.0806, "text": "Worked on the drag and drop feature Although it’s not fully complete and polished, it’s kinda working. I stopped working on the feature and started writing this devlog cuz It has been 3hrs I’m forgetting what I did while working on it. Firstly I wasn’t even going to implement this on the first place as I thought this was outside my coding capability but someone gave me a feedback that I should add this feature so I decided to give it a shot. I found out about the dnd-kit package for implementing drag and drop. I was skeptical of using it at first. I was reading their docs to figure out the package. My main concern was how would I implement the feature with the already existing click to move feature. They provide a useDraggable hook for making any element draggable. The useDraggable was used to make the piece draggable. I had to convert the piece code into a component for it to work. To drop something into another thing there’s useDropable hook which as the piece I made square, destSquares and captureSquares into components. If I were a good react dev I would’ve already did those things ig the using the package is some what helping my code to be cleaner. I used the useDroppable hook inside destinationSquares and captureSquares. I was concerned that we couldn’t actually drop the piece as it doesn’t live inside the square rather it lives on top of the board using position absolute. But, I had gotten dnd-kit wrong. I element does need go inside the element if useDroppable is used. There’s DragDropProvider that connects both draggable and droppable hook. Let’s just say DragDropProvider gave me all the function such as dragEnd and values needed to move the piece. Later I changed the useDroppable to be inside all squares cuz after dragging the piece there was some issues when dropping the piece in it’s original square if the user wanted to cancel the move. I didn’t really have to write new code for moving, capturing and resettingSquare as the code I wrote previously worked fine with the drag and drop functionality. There were many issues while trying to add this feature. Still there are issues I need to fix such as the highlighting the square bg color instead of the piece bg color when selecting piece and other bugs I’ve found. Also transition when opponent captures pieces doesn’t working also need to fix that. But, I’m really glad I tried to add this feature as I’ve learned alot and the puzzles board now feels more fun because of the feature. Thanks @PAPER_01 for suggesting the feature 💖 Okay, I’ll stop yapping. Have a good time"}, {"post_id": 67307, "ts": "2026-09-13T11:45:38Z", "hours": 2.3678, "text": "Gosh I’m so dumb Last time I thought I had fixed 404 page issue when visiting paths like course directly. I did fix it for local development but not for production which is really dumb, shouldn’t the development environment be the same as deployment when using vercel cli. I tweaked the vercel.json to fix the issue in production now but now in the development the website didn’t work. The fix that I’m now using is leaving the production as it is and in devlopment using the environment created by vercel cli only as backend and running the frontend seperately using pnpm run dev. To connect both backend and frontend I configured the vite.config.js to redirect every /api request to localhost:3000(this is running throught vercel cli) Most of the time was spent on making the signup page responsive. The login page is also now responsive but it’s just a copy paste of signup page css. I am quite dissapointed in myself because it took me so long to do this and still I don’t like how it looks on certain screens. As I realized that I was spending too much time on making signup page responsive I panicked and just rushed the process. As a result a have a reponsive signup and login page that I’m not very proud of. I fixed the signup not working. While signing up there it showed user already exist error everytime. The fix was quite simple, I had missed await keyword when checking for user with same email in database. Due to which the userExists variable was always true. Then I did something really dumb. I tried to fix something that was already working. I was worried that if I delete a user from database and then if that user tries to login then it would throw an error so without even checking if that was true I started making changes to the protectRoute.js file. I was thinking after the token is verified then I’ll just check if the user exists or not. In the process I deleted one important line of code because of which I wasn’t able to login now and I didn’t know why. I tried made the code as before not knowing the line is still missing so the error still persisted. After giving up and doing ctrl + z undo the previous code returned I finally realized the missing line of code. Also the feature was already there when fetching user data so none of this was necessary 🫠 ."}, {"post_id": 66353, "ts": "2026-09-12T04:12:13Z", "hours": 4.2436, "text": "We’ve reached 200 hours It’s a big milestone that I’ve finally reached . I’ve made the whole course page responsive. This took me longer than I’ve expected. But before that I was getting 404 not found when visiting locations like /course directly but it was working normally when I was navbar to navigate. I’ve seen this issue before as well so I kinda knew that this was because of react SPA (Single Page Application) thing. To fix this I configured the vercel.json file and now it works as expected. So onto the course page. Firstly I made the accordions responsive on mobile screens using css clamp function. I removed the course info section for mobile devices. I didn’t touch the course card as they were a future problem for me to do. But the basic idea was the image with take up the whole width and the image and the text will be vertically aligned instead of the default horizontal alignment. Between 1024px and 768px one of the issues was the course info was looking crammed on the smaller side. so I reduced the padding and font-sizes with clamp css function so that it still looks good on the bigger screens. I also made the progress bar slimmer and badges smaller. Another issue were the course cards. One the bigger screens they looked find but on smaller screens the text were taking up more height than the image itself. I changed the value of thumbnail image from fixed value to %. Also I reduced the massive 1.75rem padding on the course card container for smaller screens. Also for all screens sizes below768px I made the banner slightly bigger vertically as the previous banner was looking very slim on mobile devices. I scraped the idea of making course cards vertically aligned and stayed with the horizontal alignment. I somehow managed the cards to look decent on smaller screens as well by using clamp(). The things I needed to do were similar but I guess it took me long as I was first checking the min and max values using browser dev tools and then putting that into clamp calculator and then pasting the value into vscode. Basically I had to constantly switch between things. In the end, I went to sleep but couldn’t fall asleep so I decided to complete the course page reponsiveness and do on last thing which was making the loading spinner responsive. Then, I peacefully went to bed ."}, {"post_id": 65437, "ts": "2026-09-10T15:59:36Z", "hours": 3.6533, "text": "This was a rough one One a good note I’ve completed making the home page responsive (for now). After making the hero section more responsive last time I then proceeded with making the courses and puzzles page more responsive. I mainly used the clamp css funciton to make the course and puzzles section responsive. The courses section remained the same as I am quite happy wiht how it turn out but I didn’t like how the puzzles section was looking after testing the website out in my phone. It looked to small for a section so below 768px instead of the text and image being horizontally aligned it’s now vertically aligned. The clamp part was similar to the courses section. Finally after completing those two I started working on the visualization section. I was the hardest section to make responsive due to the absolute positioning of the moves. Firstly I only focused on bigger screens as I had no idea how it would look on smaller devices. The moves were positioned before by mapping an array with the move notation and the css of top and right/left with percent values. I tried to remove that and instead of mapping the elements I thought of manually placing them and giving the ids by which I could have greater control over the css. While trying that I couldn’t make it work as in smaller screen heights it still looked terrible. At this point I was losing hope. I was wasting time watching a anime series just so I could avoid working on this. I tried thinking out the solution but nothing came in mind. Later when I was messing around with css throught the developer tools on the browser I realized the I could change the height of the image container to change the positioning of the moves as the moves are postioned on the basis of the image container. Now below 1440px the height of image container is 90% and below 1024px it’s 80% and I have a max-height value set for safety. It’s not prefect but it’s much better and I’m relieved 😌 . The mobile design uses a image contaning the main image and all the moves as there’s no animation on mobile devices. I made the image in fimga and using clamps and % values I think it’s decently responsive. To make the pages responsive I am using the developer tool in browser to first figure out the min and max values and the putting that value into clamp calculator to generate values. I am constantly switching between vscode and browser for this and if you have a better way to do it please lemme know. Okay the devlog has turned very long so biee…"}, {"post_id": 64066, "ts": "2026-09-08T06:38:40Z", "hours": 1.9236, "text": "Worked on hero and puzzles section (Responsiveness) The puzzles section was the easier that hero and courses section for making it responsive cuz puzzles section doesn’t contain any animations or any special thing. After several trials of adjusting the fonts and image I stopped after it looked quite decent. Before working on the visualization section I decided to polish the hero section first. My main goal with polishing the hero sectino was mainly using clamp() css function for smooth responsive text. Although the text are responsive using media queries in hero section, the text look kinda odd in some screens. After using clamp the website feels better that before. Also I changed the width of image with % values which does feel better. I also used clamp for some vertical padding as well cuz it was looking bad for devices with smaller vertical heights. I thought from 425px to 768px was tablet screen size but it seems the tablet screen size starts from 768px. So now upto 768px the website follows the mobile design. Now I’ll polishing courses section and puzzles sections just like the hero section. Wish me luck 😄. Bye I wanted to add more images but it seems 4 is the limit ."}, {"post_id": 63438, "ts": "2026-09-07T08:57:07Z", "hours": 4.4833, "text": "More website responsive stuff Firstly, I removed the animations from home and courses section below 768px of screen size. I didn’t remove the hero section starting animation cuz it’s nice. I used gsap matchMedia to achieve this. While removing the animations a funny thing happened, the matchMedia wasn’t working and then I was reading this a gsap forum hoping to see where did I go wrong. I later found that I was doing things correctly but instead of looking at localhost I was looking at live website. Obviously the changes didn’t appear 🤦♂️ Then, I made the courses section kinda resposive. Firstly I went to figma to design the mobile version of courses section as I was mainly unsure of what to do with the thumbnail cards. I decided to turn them into carousel which imo was a great idea. First, I turned turned the main courses section text smaller and then started working on the carousel. The making of carousel was rough. Firstly I was reading stuff online on how the sliding thing works. I think I somewhat figured that out but what I couldn’t figure out is the aligning the cards perfectly. The issue was I was going for a style where the first and the last card aren’t centered alight while the rest of them are. The swiping snapped the cards into place and some parts of the left and right cards would also be visible. I couldn’t figure out how to make this and was about to making hamburger menu but coincidentally while scrolling the stardance home page I saw recommended projects section where it’s like a carousel without the snapping thing. It was way easier to achieve than what I was thinking so even though I didn’t make what I wanted the carousel isn’t bad. The overall the courses section felt responsive so I started working on the hamburger menu. Working on hamburger menu went pretty smoothly except for some things going wrong here and there. I first roughly designed the the menu in figma and then wrote the code."}, {"post_id": 62042, "ts": "2026-09-05T08:11:51Z", "hours": 3.8953, "text": "Starting making the website responsive Before starting on making the website responsive I saw that when logging in or signing up there is some delay before redirection where people might click the login button several times thinking that it it’s working which is bad ux. In development there was almost no delay because I was using local mongodb. To let the user know that the button has been clicked successfully and to prevent multiple login/signup button clicks the buttons are disabled as soon as user clicks any button in login or signup page while turning the buttons color into gray. Now on to the reponsive ui part. I first tried making the navbar responsive but it didn’t look right in small screens. I was also trying to make the hero section responsive but without any design to follow. So realizing that I needed a design first I then hopped onto figma to design the navbar and hero section. I changed the ui of the navbar ig to make it easier to make it responsive but I don’t know if the navbar ui got better or worse. I know one thing and that is the navbar has got simpler. The design on the mobile is pretty simple imo but that’s the best I could do to make it look decent. I used flex property to make all the text align vertically in phones and decided to remove the image in phone screens. I’ve have currently hidden all sections below 1024px except the hero section to focus only on the hero section without other sections interference. I’ve mostly used hardcoded values to make hero section which I will change to clamp css propery for smoother hero section responsiveness. I have just eyeballed the sizes and paddings which is a bad idea but I’m just lazy to create figma design for every layouts. Now, I’ll make the hamburger menu working. Uhh, I hate making website responsive but it has to be done. If you’ve any suggestion feel free to leave it down in the comments."}, {"post_id": 61270, "ts": "2026-09-04T03:49:40Z", "hours": 1.9669, "text": "The website is live guys I used vercel to deploy my mern stack project and it was rough . I first tried deploying the the frontend and the backend separately. After reading blogs and trying I ended up deploying the express backend but at that point I had learned that there’s vercel cli with which I don’t have to push commits everytime to find out errors in production. I can just use “vercel dev” command to create a production like environment but for development and testing out. I couldn’t figure out how to run frontend and backend seperately using vercel cli. I then tried deploying the whole repo. The issue with this was I couldn’t configure the website with folder structure like this chess-website ----frontend ----backend Maybe there’s a way to make this work (I couldn’t ), I chose the easier path which I’m kinda familiar with. In this approach there’s no frontend and backend directory. The backend is renamed to api which allows vercel to recognize that it’s the backend and all the contents of the frontend folder will be moved up to the root directory. Errors came as I changed the folder structure but fixed on after another. The backend wasn’t working which got me really confused. There were many issues in this approach as well but atlast the website is running and backend is working properly . The two days break I took from coding is over and i think I feel better. Here’s the link to the website: https://evochess.vercel.app/"}, {"post_id": 58966, "ts": "2026-08-31T15:18:41Z", "hours": 2.2961, "text": "Many small improvements 🙂 I’ve added transition to level btns and added icons and different ui to puzzle sidebar button. I am using an array inside objects to display all buttons. So to customize the buttons I manipulated the array.Some button have only text, some have both text and img and some have only img. Also the main button is wider and other buttons are gray in background color. For this I used the className like in tailwind to add the styling meaning the buttons which need gray color will have the className gray. The size of the buttons is differentiated using different values of flex grow. I think the buttons look way better now. I’ve added reset if user changes from puzzles page to other page. The is to avoid any unnecessary bugs and error. I had already done this in vision page now it was the turn of the puzzles page. I have been avoiding this for so long but finally I’ve done it. I added the videos for professional course (or should I say advance course). I changed the name to advance cuz professional is just the wrong word to use here. I also moved some videos from beginner to intermediate. Now that the courses are in place I can finally write what you’ll learn in the information section. I’ve added numbers such as 0 - 1000 representing what I mean by beginner. I’ve tried to match videos to the elo level. The data in courses section in the home page is also change from placeholder data. Looking back at the code they are really bad but I’ll leave it as it is not broken 😁. Now I think the project is coming to it’s final stages I do need to add things but after that ig all I need is to polish the website and make website responsive. I’ve also fixed progress bar animation happening everytime on reload. This was a small thing but it was bugging me so I decided to fix it. Fixing it was annoying as I had expected to fix this easily. After some trial and error I fixed it using a hasCompleted state which is set to true after finish lesson button is click. Only when the hasCompleted is true the animation occurs. Some other changes I did were fixing only displaying highest achieved medal in course page and adding background color transitions to buttons. Enought yapping. I don’t feel like coding and I think I should take some rest for the next two days. Hope the rest reset my feelings and returns me to my prime stardance days 😆."}, {"post_id": 56525, "ts": "2026-08-28T10:04:18Z", "hours": 2.7708, "text": "Wow! This is the 51th devlog I’ve added the player color indicator in the sidebar. It tells you which color you’re playing. Before coding this I just complicating things in my head by thinking of creating new unnecessary states. I used pen and paper to think and realized why not use the color state already available in chessboard. To access the state I moved it up to the puzzles context file where both sidebar and chessboard could get and change the color. I also moved the hint down as it look clutter both color and hint together in the sidebar. Two quick small fixes. I fixed retry and back button not working and fixed replay button not playing the same level only on last level. I’ve added pawn promotions functionality to the opponent’s pawns. In puzzle 17 and 26 there are promotions that happen but without the promotion part it just looks weird to look at. Especially in level 26 where the pawn promotes to a knight and without having that knowledge the user will just get confused. I haven’t added promotion functionality for the user pawns because there is no puzzle that requires it. I will add it if I have the time to but rn i am going to just ignore it. One of the bugs I faced while doing this was the knight promotion worked fine but the queen promotion at level 17 wasn’t. The pawn was just disappearing because the pawn was capturing itself cuz the promotion only work for black pieces which is now fixed. Next I fixed the random color option color menu not working. Idk when and how it broke I thought it was working fine but it seems not. It seems it was not working because the element was being unmounted before running the selectRandomColor function. So, I moved it to vision context and with a useEffect hook it runs every time hasStarted is true. A small change but which I feel great that it’s solved. When clicking on accordion or pieces twice sometimes it selects the icon and other things which was just annoying. The fix was just two lines of css which I learned from a random dude on the internet. Really thank that random dude. I’ve now added functionality for adding multiple bestScore for according to the time and color. Before the highest score in vision would be the score scored across any time or color. So if you were to score 5 point in 45 seconds and score 5 points in 30 seconds they were treated as the same thing which imo opinion isn’t fair. To achieve this I used object inside a object unlike the single number representing the bestScore like before. The object looks like this. { white: { 15: 0, 30: 0, 45: 0, }, black: { 15: 0, 30: 0, 45: 0, } } I did have a very hard time figuring out how to update the state like this as I had to change the specific time score within the correct color. One thing I did learn from this is we can use square brackets for using a variable’s value as key while manipulating the useState object. I also encountered some errors while trying to implement this functionality. Now everything is working as expected."}, {"post_id": 55374, "ts": "2026-08-27T05:12:03Z", "hours": 2.2717, "text": "I’m so sloppy now I’ve added sounds for piece movement, capturing piece and completed puzzle. I spent more time than I should’ve finding the sounds. I am still not sure about the sounds that I’ve added expect completed puzzle sound. There was issue with playing sounds during opponent move cuz unlike moving player’s piece where there are seperate function for moving and capturing pieces, the moving and capturing logic is inside the same function. After thinking a while I did solve the issue. It seems mac default recording doesn’t capture sounds so you just have to trust me here 😅. I’ve made hint button disabled when pieces are moving (Both player and opponent piece). I did this after figuring out if user click the hint button quickly after the last puzzle move then we get an error. Although this thing happening is very unlikely but it’s better to always fix bugs. Also I don’t know what happens if user clicks on hint inbetween moves so I think preventing it is better. A small change, I’ve added better hover transition to logout button. I didn’t add a red background during making it cuz I had issue with chaning the svg color. I’ve learned that if I make the svg inline in the jsx and set fill to currentColor then I can change the svg color through css and add transitions. Also, I’ve added popup animations to time menu and color menu. I was even struggling with this even though I’ve added those kind of animations before. I was using the new Activity element in react to toggle the menus but to for adding the animations I’ve removed the Activity element cuz the menu would disappear before animating. I took some break from coding cuz I got sick. I think I’m really sloppy now. Imo these changes shouldn’t have taken me 2hrs. Hope I will be able to shake off this sloppiness."}, {"post_id": 53935, "ts": "2026-08-24T17:12:15Z", "hours": 2.6236, "text": "A little rest from programming I’ve added hint button in the puzzles sidebar. I had been trying to avoid working on this but I couldn’t avoid it forever. Also the puzzles sidebar looked really empty without the hint button. In chess.com the hint button highlights the correct. I did things a little differently, the hint is communicated via text to user. The text animates during first appearance and I’ve made it so that user gets only one hint. After the hint the button goes gray indicating it’s not clickable anymore. I made puzzles sidebar code better to display buttons and also added replay button with functionality on successful puzzle complete. I mainly made the code better cuz I need to add the replay button. The replay button is same as retry button for replaying the puzzle after completion. I made next button do nothing if user reaches the last level. Before when completing the last puzzle level we would reach the next level automatically which is prevented now. I’ve been sick for 2-3 days now and am just writing this devlog. Hopefully from tomorrow I will be working on the project more seriously."}, {"post_id": 51434, "ts": "2026-08-21T04:22:13Z", "hours": 1.9856, "text": "Interesting updates I added back button in puzzles sidebar with functionality. Before there was not way to go to the default sidebar (the notStarted state). Now after messing up or completing a puzzle there’s a back button which sets the board to default postion and set sidebarMode to “notStarted”. I wanted both buttons to be taking up equal space but later thought the smaller back button is better. Also now, puzzleLevel updates instantly updates after solving a puzzle instead of updating only after clicking next puzzle button. User can now select and play any completed puzzle by clicking level btns in sidebar. Previously user can only start the puzzle Level user has reached which meant no puzzle 1 and 2 resolving puzzle after user has reached level 3. I split the puzzleLevel state into selectedLevel and highestReachedLevel. The puzzle is set to the selectedLevel and the buttons aren’t clickable above the highestReachedLevel. The ui of level buttons is changed. I made the buttons smaller and made the selected level more distinct by adding a inner glow to the button. We’ve upto 30 levels now . I downloaded the lichess puzzles database for this project but whenever I opened the file my laptop will just heat as there were more than 69 millions data 💀 . I did try to use the lichess data but I didn’t actually like the progression of difficulty so I used chatgpt to make puzzles. I’ve played upto 21 levels and I think it’s good so far. That’s all for now, okay bie…."}, {"post_id": 50379, "ts": "2026-08-19T15:27:48Z", "hours": 1.1106, "text": "Finally, I present to you a short devlog 😆 I have fixed the issue of pieces moving with transition when pieces are being placed after clicking on retry puzzle. To prevent this I already written code which worked perfectly but when only on retry puzzle it wasn’t working. This solution was simple but figuring out the issue took time. To fix the issue I used a useState hook to set hasPiecesPlaced to true only after pieces state updated. Also, I’ve already written code for handling page change in the middle of vision practice. I think this doesn’t work after I removed Chessboard.jsx and ChessboardContext.jsx. Not sure when this broke . I found better way to do this using the useEffect hook cleanup function. I learned that when adding setState directly in cleanup function it throws at recurring error 😭 . I felt my laptop heating up 😭 😭 . But there’s no error when adding setState inside the function and then running the function in the cleanup function. That’s all for today. Couldn’t do as much as would like today cuz a rat bit me 😭. Bye…"}, {"post_id": 49661, "ts": "2026-08-18T15:27:18Z", "hours": 4.6519, "text": "Ayy good progress today I created a separate chessboard component for puzzles page only. Before both puzzles page and vision page were using the same chessboard component making the code complex, hard to read and hard to debug. Firstly I decided to move all the chessboard functions and states into puzzle context but later changed my mind midway. I decided the chessboard functions and states make more sense to be in it’s own folder. Everything broke while doing as expected but I fixed them one by one. Now the puzzles chessboard is functional and it’s code looks a little less overwhelming to me. Now the vision page also needed a separate a chessboard. It wasn’t as easy as just copying and pasting most of the code into vision chessboard because the data was connected to more components of the sidebar such as progress timer, color Menu, etc. I don’t if I should separate the functions to components that they server of just dump it all into the vision context file. What I did was keep functions into their respective folders cuz I think the vision context file looks really cluttered doing that. Everything broke here as well but as before I fixed things one by one. Now I really believe it will be much easier for me to work on chessboards as they’ve been seperated. Also I deleted the original chessboard component and chessboard context after that. On clicking the sidebar button the reset board function is called and the function came from chessboard context. As there is no chessboard context now you can see that there’s a problem here. The reset board function in now in PuzzlesChessboard.jsx which means we can’t access it from PuzzlesSidebarBody.jsx. To solve this I just made the board reset everytime when hasPuzzleStarted is true. We do have the access to hasPuzzleStarted from puzzle context. Fixing that somehow broke the piece transition though. After that I mostly worked on the small things. Such as fixing no transition during piece, fixing the progress timer staring with 2 seconds less than the time set, adding chessboard size to puzzles chessboard in a better way, etc… Now the next puzzle and retry puzzle buttons also work. The next puzzle button works as expected. The retry puzzle button also works but the pieces move to their repective place with animation when the board resets which I don’t wan’t. To prevent this specific thing I have already written some code before and it’s working when starting the puzzle, moving to next puzzle, rendering the default pieces on first load. I can’t figure out why it’s specifically working for retrying a puzzle. I spend a good amount of time looking but idk. I’ll look into this tomorrow. I think the devlogs are still pretty long. I’ll try to keep the devlogs shorter on future devlogs. Okay bie…"}, {"post_id": 48941, "ts": "2026-08-17T14:42:47Z", "hours": 3.0389, "text": "Two steps forward, Four steps backwards 😭 Firstly, I’ve fixed the gsap animations not working. This happened because last time I renamed all the color state into chessboardColor. Due to this the gsap backgroundColor css property turned into backgroundchessboardColor. Ig the lesson here is think before using change all occurences feature in vscode. The sidebar now changes. If puzzle hasn’t started then it’s the same old ui. If the puzzle starts the level btns disappear along with start puzzle button. If user makes incorrect move the sidebar show retry puzzle button and if the puzzle is completed successfully then next puzzle button shows up. One thing I learned here is making one button use different className, onClick handler and text easily by storing all data in object. The retry and completed onClick function looks empty. So, I decided to work on the retry puzzle button functionality. To make the functionality work I imported the resetBoard function from chessboard context. Calling the function directly didn’t work because setState function doesn’t apparently update if the value is same. I fixed that by passing {retryLevel: true} or false to the function. After doing this the first opponent move did break and I did fix it but I think with bad code. Looking at the code now I’ve been calling resetting the board and setting default position using the chessboardColor seems wrong. So, then I started cleaning the code. I guess I was correct and things needed to change. I would say these are mostly small changes and don’t need explanation but it seems that the chessboardColor had an actually bug and it took my soul away trying to fix that 😭 . So, the opponent move was capturing it’s own piece meaning that the piece which moved at the beginning would automatically disappear. This was happening because the moveOpponentPiece function ran before the chessboardColor could change when the puzzle is first started. To fix this I had used useEffect hook with chessboardColor in the dependency array to reset the board. But only works if I have the black pieces. If I have the white pieces the chessboardColor doesn’t update because useState doesn’t update when the value is same. The value is white at first because of the default position set when puzzle hasn’t started. I don’t even know how to explain the fix i used. I just chained state updates from file to file to have colorUpdated state value updated in chessboard context.jsx. Basically I had a rough time fixing the resetBoard function running before chessboard color was updated. This time even pen and paper also couldn’t help me solve this 😭 😭 but it did help me to understand the problem on a deeper level. I tried adding next puzzle button functionality. “I tried” 😭 cuz I couldn’t get it to work and on top of that when I tested the retry button it didn’t work. Don’t know how but the retry button also broke. Now, I’m taking a huge decision again. I think some of the problems can be reduced if the chessboard wasn’t a single component that works on both puzzle page and vision page. I think I was too ambitious but now seeing these issues I think it’s better for me to have to separate chessboard components. This might not be the best practice, but this will probably make my life easier. I just read the “Devlogs that get noticed” in the resources page and I think I should make my devlogs a little shorter. I said this in one of my previous blocks as well, but it seems that I am explaining too much. So let’s see what will happen tomorrow. Okay bieeee…."}, {"post_id": 47257, "ts": "2026-08-15T02:00:48Z", "hours": 3.0875, "text": "Learnt something valuable ✨ Okay now the puzzle buttons have dynamic ui. The puzzle button will have ui according to the puzzle level. I was confused on how to achieive because there were three condition instead of two. If there were only two coniditions then it would have be easy as I would have simply used ternary operator. I couldn’t use if condition inside jsx. After some time I figured that if could call a function and use if conditions inside the function and return the className. Also now the puzzle level is stored and fetched from the backend. After doing that a toast error popped up as you can see below. I didn’t know why this was showing up when the page is first loaded up but instead of fixing that I first moved on to make the start puzzle button work. I think my main problem is I get distracted easily. To make the start puzzles button work firstly I created puzzle context file . I was deciding to make the chesboard context the puzzlecontext as all the data needed for puzzles page was there but I think it’s better to seperate those things. So, I placed the puzzle context higher than chessboard context with that thought process. If the puzzle hasn’t started the fen value is set to default starting position. Then I again got distracted and thought why isn’t the vision context also above the chessboard context. So, I moved the vision context and the coordinates broke. The reason was color state so then I created different color states for vision and puzzle context. While writing this I don’t actually know what I’m really doing. I do one thing and jump onto another making writing the devlog very hard. I think I can do better… 🙁 After learning the lesson, doing thing one at a time. I only focused on making the start button work. So I moved some values inside puzzles context for this to work and everything broke. But, I wasn’t feeling overwhelmed as my focus on only one thing. Slowly but surely I fixed the pieces moving, capturing and the first opponent move. I think my main issue is dealing with useState hook updating in batches. Ig I will just get better with time. Still the backgroundColor animation is broken which I need to fix. Also while doing this I found out why the toast error was occurring. Silly me didn’t add method post to update the puzzle level. Now after the puzzle finishes the puzzle levels value updates and the updated value persists. I should definitely do things one at a time. Getting distracted and doing multiple things will just make me feeling overwhelmed and will make it harder for me to devlog as well."}, {"post_id": 46384, "ts": "2026-08-13T15:40:46Z", "hours": 4.4847, "text": "Making good progress The piece background color now changes color depending upon the correct or incorrect move that the user makes. Last time I was trying to achieve this by just using useState hook. I’ve understood now that it was the wrong approach instead now gsap handles the animation part. The main issue with gsap I was having was I didn’t know how to select the exact piece for animation. I’ve achieved this by using useRef hook named pieceRefs containing an object will all the pieces on the board with their ids as key. I haven’t never used a ref like this before and it feels scary to write code in the unknown territory but ig it’s a part learning. Also I’ve removed the code that changed the backgroundColor using useState and used gsap. It was just waste of my time to try to use useState hook to change the backgroundColor . So now, piece toggling the highlighted bg color when a piece is selected or unselected will be handled through gsap. Ahhhhhhh.. Finally after a puzzle is completed successfully the the next puzzle will start. My brain feels like it’s melting after making this work. I struggled so much to make the work mainly due to react batching the state updates. Unexpected bugs came while coding this. So, basically a puzzle is considered finished if the moveOpponentPiece function has no moves left. Then, we change the fen state and also reset the board so that the pieces are placed again. After that when player reaches next level the opponent first move needs to take place. For that I have a useEffect hook to check if opponentMoveIndex and userMoveIndex value are default values. The values are set to default through resetBoard function and if the values are the default ones then the opponent pieces moves. One of the main issues I had with this was the moveOpponentPiece function was running twice. Due to which one of the opponent move was being skipped. I wasn’t able to locate why and was making so many unnecessary changes and console logging everywhere to fix this 😭 . The issue was that the useEffect that I talked about earlier had pieces in the dependency array making the moveOpponentPiece function to run twice. I’m really exhausted after doing this… Then after some relaxation I made a rough figma design for the puzzles sidebar. It was kinda relaxing to not worry about coding for a while. I had big plans for the sidebar like making candy crush type levels but I don’t think I’ve time for that so just basic buttons will have to do. I’ve tried creating the distuinguishing the levels based on completed levels, current level and locked levels. Back to coding again, I mostly copied the vision sidebar code for puzzles sidebar as the only difference is in the sidebar body. It seems that I’ve forgetten to use css grids. I wanted the buttons layout to be responsive. I took a quick revisit on how grids. Throwed random properties at the grid hoping it will work as I expected 😆. At last it was the auto-fill property I was looking for with a combination of minmax. I’ve tried created the css for completed, current and locked now I just have to hook them up to the buttons according to puzzle level reached by player. I’ll do that tomorrow, now I’ll stop writing. If you’re reading this, I hope your project is going well💖."}, {"post_id": 45805, "ts": "2026-08-12T14:57:39Z", "hours": 2.5114, "text": "I am stuck Ayy the opponent moves work as expected now. In last devlog I wasn’t able to capture opponent’s page because I accidentally didn’t filter the pieces, only moved the piece. Now the capturing system also works as normal. While talking about capturing pieces now the opponent can also capture pieces. If any of the player’s piece is on the destination of opponent’s piece then it will be captured. The main lesson learned here is to mostly use the previous data while changing the state’s value to avoid unnecessary bugs. I’ve made the reset board function work. This was the point where I decided to rebuilt the code by removing the use dom manipulation and looking back I think it was a great decision by me. (Context: 2, 3 devlogs ago I found out my code was really trash while creating the reset board function). While writing reset board function I did run into some weird bugs. The board is reset by reconverting the fen to pieces array. The first opponent move happens when the opponentMoveIndex is 0 now. In the reset function the opponentMoveIndex is set to zero. I’ll add a animation to indicate that the user’s move is incorrect later. For now I added the animation for the piece moving. I’ve learned that when moving the pieces by updating the state in react, the key of the element is what matters for animation to occur. If the key of the element is same and just the transform style has changed react knows that it’s the same piece that jumped from one place to another. Also now, the move transition doesn’t happen when the pieces are being place. Because the pieces are placed using the transfrom property, the same property used to move the piece. I took me a while to fix this. It seems that this was happening because the squareWidth was making the page re render. I’ve fixed it but I still I don’t completely understand it, which shows that I’ve a long way to go. This one is small but crucial. Now the user cannot select the opponent’s piece during opponent’s turn. I’ve added a 500 ms delay for opponent’s move so that it doesn’t feel things are happening really fast. In that timeframe user is not able to select any pieces now. I am now stuck at the part where I am trying to animate the pieces after checking the user input. Whether it’s correct or incorrect. I wanted to make the background green if the move was correct and red if it move user made was incorrect. Using states is proving to be tricky for me as they’re fully synchronous. My brain goes okay this will happen and that will happen but the code won’t have the updated data because of useState nature. Also I tried to change the background color same way I move the pieces. Now that I think I about it I just wasted time. I will try to do animations with gsap now but idk how to explain I can’t really think of a way to do it with these useStates. Okay this was more that enough yap for 2hr 30 mins of work. Let’s see if I figure out a way tomorrow. If you’re reading this love you man 💖."}, {"post_id": 45236, "ts": "2026-08-11T16:05:21Z", "hours": 6.4983, "text": "Most rebuilding my broken code For context last devlog I took the decision to start rewriting the code to stop accessing dom directly by using states. Now the pieces are mapped from pieces state rather than directly from fen so that I can move the pieces from state instead of manipulating the dom. To achieve this I firstly created to convert the fen to pieces array. The pieces array looks something like this rn. [ {id: 'r-a8', pieceNotation: 'r', square: 'a8', coordOfFile: 0, coordOfRank: 0}, {id: 'r-e8', pieceNotation: 'r', square: 'e8', coordOfFile: 4, coordOfRank: 0} ] From this I learnt that setting the key attribute serves it’s own purpose in react. I don’t fully understand it rn but I’ll look into it. Now, the id of the piece serves as the key for the piece element and if I’ve understood correctly that will be vital in animating the piece moving. Yay the rook has been reestablished using react state without any dom manipulation. The reestablishment wasn’t too difficult as I thought due to the already existing code. All the changes now happen in the pieces state which then causes the react to repaint the pieces. Now the rook can move from one square to another and capture opponent’s pieces. Also I’ve made the reset squares function as it removes the destination squares, caputure squares, etc . Although there’s no animation during piece movement rn I’ll it add later. After making the rook work I stared making all other pieces work as they used to before. I thought I had to write most of the code to fix all the pieces but after finishing the rook other fix other pieces wasn’t that bad. I reused the code from the rook where I could, fixed some bugs and errors on the way and modified the code where necessary. Sometimes I got stuck due to my own stupidity but that’s nothing new 😆. The moveOpponentPiece function is rebuilt. Now the first opponent move will happen when the board is first loaded. While fixing this function I found out that I was able to select the opponent’s piece as well. This shouldn’t be the case cuz I had already put railguards for preventing this. After fixing the moveOpponentPiece function I checked why this was happenning and the cause was I put railguards only if user click on another piece when a piece was already selected and that code was also wrong. I fixed them both and now they work as expected. Another bug found. When I clicked on the first pawn it only created one destination square instead of two. This was happening because the for loop had only 7 iterations instead of 8 which added the starting pawn squares to the array. Also the user’s pawn were able to capture the user’s pieces which was a big nono so I quickly fixed that. Even thought the moveOpponentPiece is working for the first move it instantly breaks from the second move. I still fully don’t understand why this is happening. I know it has something to do with using setState and it not being synchronous. The code looks like this let updatedPieces = pieces.map((piece) => { if (piece.square === position) { return { ...piece, square: destination }; } return piece; }); setPieces((prev) => { console.log(\"updated\", updatedPieces);// I don't understand how this value return updatedPieces; // and this are have different values}); I’ve fixed it while writing this devlog removing updatedPieces variable and mapping the value directly inside setPieces(). Now, the second move works but the third move is broken 😭 . I’ll look into this tomorrow. I’ll wrap this up for today. Also I’m changing my devlog style a little bit. I’m not telling you all the problems I ran into like I did before to keep the devlogs a little short."}, {"post_id": 44520, "ts": "2026-08-10T10:34:10Z", "hours": 3.1394, "text": "Taking a BIG decision Updates: Fixed pieces creating only single capture square Added redirection to signup page in puzzle and vision page if user isn’t logged in Made user unable to select piece when opponent’s piece is moving Connect oppenent’s move to puzzle data, Add check for user moves and Add functionality to make the opponent piece move automatically after user plays the correct move I fixed the pawn not being showing two capture squares last time. After that I found out that the capturing the piece wasn’t removing the piece from the board. I found out a function that I have commented out was being called and causing an error so I removed the function call for now. This was easy to fix but by doing this I found out that the pawn wasn’t the only one who wasn’t able to display mutliple capture squares. All the other pieces weren’t able to display multiple capture squares due to a simple rookie react mistake. The value of captureSquares was being updated with it’s own value instead of using the previous value. After sorting that out I figured i should do same with the destination squares. Previously had an array updatedDestinationSquares after pushing all the values to the array then only I updated the destinationSquares value. In short I was doing the correct thing and me thinking that I could save 2 lines of code by adding setDestinationSquares directly to the loop was a bad idea but the state function isn’t synchronous. So I undid all the changes and also added a updatedCaptureSquare to all functions just to be safe. Now user can’t select pieces when it’s the opponent’s turn. Although the timeframe to select piece is small but still I wanted to be safe. I achieved this with a state named isOpponentPieceMoving. it’s toggled on when user clicks on a destination square and toggles back off after the animation finishes. Next I tried to make the opponent piece move work through with the help of the lichess puzzle data. Before the opponent piece could only the first move to play. After connecting the moveOpponentPiece with puzzles data. I created a function to check whether the move made by user is correct or incorrect. This was also being checked with the data in constants.js file. The data is stored like this r3r1k1/p4ppp/2p2n2/1p6/3P1qb1/2NQR3/PPB2PP1/R1B3K1 w - - 5,e3g3 e8e1 g1h2 e1c1 a1c1 f4h6 h2g1 h6c1 The moves part start after the comma. First move is of opponent. It tells from which square to which square the piece is needs to be moved Eg(e3 to g3). The second move seperated by space is what the user need to play to move forward in the puzzle. So if the user’s move is correct then I move the opponent’s piece. But if it’s incorrect then I reset the board. I got lost in the reset part. I learned if the key of a element is changed the element kinda resets. When I started doing this I felt a little uneasy. I was figuring out the code I wrote was manipulating the dom which isn’t the best practice in react. Regardless, I added a fragment to the code that was generating the pieces with a key with the value of boardKey and updated the boardKey when the user’s move was incorrect. But in my mind a question was lingering \"Should I redo this in the way how react wants it\" . Seeing the functionality working I pushed off that question. But, when I captured a piece a error popped up. The ss is below. I tried to locate why was that error popping up. I’ve concluded that the bad code has started to show why it’s called bad code. Although I might find this solution to this issue I think it’s better for me to just rewrite the code. This is painful but it will make me a better developer. Also I found another bug, the error isn’t the only reason I’m making this decision. I’ll push the code upto what I’ve done right now and then I’ll start to fix what I’ve created."}, {"post_id": 44051, "ts": "2026-08-09T15:53:39Z", "hours": 2.9425, "text": "I’m dissapointed in myself Updates: Fixed pawn unable to show two capture squares at once Added function to move opponent’s piece automatically Set fen according to puzzleLevel Moved opponent piece after the pieces have been placed and remove css transition into gsap animation while moving pieces Last time I added functionality to pawn to be able to capture pieces. It worked fine I there was only one piece diagonal to the pawn. I there were two pieces diagonally infront of the pawn only one capture square would appear. Now two capture squares appear if there are two pieces in front of the pawn diagonally. Fixing this was simple. Created the function to move the opponent’s piece automatically. In puzzles the user only moves their piece, the opponent’s piece moves automatically after user plays their move. This was the most frustrating thing I worked on today. I thought the function worked correctly but I was wrong. I’ll tell you in a sec. I added 3 fens with moves from lichess puzzles data in constants.js . Then I made the default fen data to null and made it so that the fen is selected according to the level of the puzzle. I think I was trying to add loading state for this. It was very poor thinking from me. I was just being very ambious and instead of trying to do things step by step I was trying to multiple things at this time. I don’t remember exactly what changes I tried to make ig I was trying to fix the moveOppenentPiece function as well at this time. I undid some of those changes, left others as it was and fixed the fen and commited that. I was already frustrated at that point and then when I tried fixing the moveOpponentPiece function the constant errors and bugs worsened my frustration. I don’t want to explain that part. Just know that after fighting with my code it’s working now. Also before I had css transition for trasform property. Meaning that whenever the pieces moved it moved smoothly. But when the chessboard is first rendered all the pieces also animate to their places. I fixed this by removing the transition css and using gsap to move the pieces. Now the first opponent move happens automatically. This was also frustrating to make it working. Basically today was frustrating. I thought I coded longer but seems like not. But anyway, when you’re at the bottom the only was is going up. Saying that I will stop writing this devlog. I feel I could have written an essay today. Okay bie…"}, {"post_id": 43708, "ts": "2026-08-09T03:48:45Z", "hours": 3.2064, "text": "Gobble up pieces Updates: Rotated piece img when color is black and made user unable to select opponent’s piece Added functionality of capturing pieces with rook Added functionality of capturing pieces to bishop, king and knight Added functionality of capturing pieces with pawn My goal was to make the board work from both sides. I was ready for this goal to be challenging. I was messing with squareid and position of pieces by checking the color of the board. But it seems don’t have to do much for things to work. Before, I have already made the board rotate using css. I was rotating the pieces when color was black and that was causing issue. Instead of rotating the piece I simply rotated the img inside the piece. Till now every is working as expected. Also I made user unable to select the opposite colored piece. Now we can capture pieces . If a piece can be captured, the piece will have four triangles at the corners. This is inspired from lichess as I didn’t really like the circle of chess.com. I made the triangles myself using figma. Also I created the dot in figma to change it’s color. Previously the dots were green. It took me some time to pick the colors of triangle and dot cuz I didn’t wanted their colors to ruin the feel of the chessboard. This works by firstly determining if the piece in the way of destination squares is our piece or the opponents. If it’s our piece then destination squares will instantly stop generating but if it’s the opponent’s piece the we first add the sqaure position to capuredSquares array and then stop generating the destination squares. While doing this I learnt about the remove method which allow me to remove the captured piece element from the board. It took time for figuring out how capture pieces with rook. After that it was really easy for me to do the same with other pieces as well except for the pawn. The pawn isn’t the same as other pieces. It moves vertically and captures diagonally. So I had to write code differently for the pawn. I code for the pawn does seem a little messy but i think it’s fine. I would say it wasn’t too difficult to make the pawn capture pieces. I did have to think about making the capturing functionality work for both white and black pawns. This much for this devlog. I am being quite lazy nowadays. Time to grind and lock back in. Hit me up if you also want to grind along with me."}, {"post_id": 43022, "ts": "2026-08-08T02:09:50Z", "hours": 3.1258, "text": "Mostly cleaning up my messy code 🧹 Updates: Made bishop not able to pass through pieces Made the code creating rook destination squares much cleaner Made the code creating bishop destination squares much cleaner Fixed rook and bishop not creating destination sqaures at the edges of the board Made code for creating knight destination squares cleaner and fix if statement condition of rook in ChessboardContext.jsx Made code for creating pawn destination squares cleaner and make pawn unable to pass through pieces Fixed bug while clicking on a piece when another piece is already selected In last devlog I made the rook unable to pass through pieces so it was very logical to do the same to bishop. Making the bishop unable to pass through pieces was pretty simple as the code wasn’t much different from the rook one. Idk what clicked in me after doing that I started to thinking about making the rook destionation squares creation code cleaner. The code was very messy and repitetive and I believed it can made cleaner and smaller. I used 4 while loops before which had almost the same code but different values and slightly different calculations. After thinking and trying I turned the 4 while loops in to a single while loop. Now the code looks much better. Seeing the success in rook destination squares creation code I then moved on to the bishop’s code. Made similar changes to the code as the rook’s code. Also i believe the queen works perfectly as it’s mixture of rook and bishop code but I haven’t really tested it on board. After cleaning up both rook and bishop I found a small bug. The bug appeared because of my slight mistake while trying to make the code better. Basically the rooke and bishop weren’t creating any destination square at the edges of the board. The fix was simple so this didn’t take long to fix. I already didn’t like the knight’s destination squares creation code. Me cleaning up the rook and bishop code gave me the motivation to make the knights code better. It did take some time for me for cleaning up that messy and tangled code. I was using break keyword for rook and bishop so I also used break for stopping the loop but I didn’t want the loop to stop completely I just needed to skip the loop if there way a piece or if the knight was on the edge of the board. After a quick search I found that continue keyword does the job. The pawn code wasn’t that messy but it could definetely do better. I mainly changed the pawn’s code cuz I wanted the pawn to also be unable to pass through pieces. Before there were two loops now I one loop does the job. Then I also made the pawn unable to pass through pieces by breaking the loop. Fixed the annoying bug. If a piece is clicked when another piece is already selected then it looks like both pieces are selected. Desitnation of both pieces are shown and both pieces are hightlighted. So, as clicking on a square reset the selected piece, I reset the previous piece if user selected another piece with a small change. Now I’m trying to making all these things work from the black side as well. Okay this much for this devlog. See you on the next one. Biee…👋"}, {"post_id": 42402, "ts": "2026-08-07T02:53:40Z", "hours": 3.7158, "text": "30 day streak let’s goo 🔥 Updates: Added functionality of moving pawn with seperation destination square for white and black Added functionality of moving knight Changed color of chessboard Made rook not able to pass through pieces The pawns now move one square at a time and have the option to move two squares if they’re on starting squares. Moving pawn one square is easy but I had to think about creating two destination squares infront of the pawn. So I created a array and push all the starting squares of the pawn and if the pawn is on one of the starting squares then two destination squares are created. It’s also seperate for black pawn and white pawn so that white pawn doesn’t get two destination squares when it’s on the black pawn’s starting squares. I forgot the knight also needed to move lol 😆. Just remembered in time after finishing the pawn. The knight was tricky to move. As always I used the mighty pen and paper first before coding. Creating the knight took some time due to random bugs here and there. I think I need to revisit the knight code later as it’s very messy. Yay, now the back pieces don’t disapper on the dark squares as I have changed the chessboard light and dark square colors. I think the new colors look great. I was lazy to test out colors so I went to chess.com and picked colors from one of their themes. Okay now were moving to the next step. Making the pieces not be able to move through pieces. I started with the rook. The plan was simple. Check for any piece with squareid that’s same of the destination square and if true stop the loop. I couldn’t figure out how to even select the piece. I was frustrated as I need to select the specific piece with the squareid attribute. I found out about ReactDOM.findDOMNode but I couldn’t figure out how to work with it. I felt really frustrated at that time. I was thinking of using document object but I know that is a bad practice in react. It seems I forgot that we can use querySelector in refs. I already had the chessboardRef so I used querySelector to find if a piece was on the way of the rook. Also I had to change the way I calculated the rook’s destination squares but let’s not talk about that I think the devlog has gotten pretty long. Although the problems are hard for me to solve when I see the results working I genuinely feel happy. I have gotten lazy after getting sick. Although I have not fully recovered yet I’ll try to stop wasting my time. Okay this much for now biee…."}, {"post_id": 40781, "ts": "2026-08-04T15:12:05Z", "hours": 3.8114, "text": "More pieces can move (I’m sick again 😭) Updates: Added functionality to handle vision page if user changes page during vision practice Added functionality of moving bishop and seperate calculation of rook moves Added functionality of moving queen Added functionality of moving king I told in the last devlog that I was working on hanling vision page if user changed page during vision practice. And now, it’s done. I think I have reset the necessary things so that vision page works normal. If any bug related to this appear in the future then I’ll fix it then. Right now everything looks fine after adding this functionality. Creating destination squares for rook was easy and I thought bishop would also be probably easy. I was very wrong. The thing with rook is that there will always be equal number of destination squares but bishop doesn’t. I bishop’s destination squares varies according to it’s position. I took a long time to figure things out in pen and paper. I even wrote the whole chessboard notation in paper and looked at only one diagonal first to find some sequence ( I’ve attached the img below 😆). I started coding after kind of figuring out where to start. I had issues during coding as well but we got it boys. Also I was using OR instead of AND in the while loop causing bugs and I needed some time to digest that AND definetely worked there. A silly mistake from my side. For the queen I didn’t have to code much as I wrapped the rook and bishop destination squares code in to a function. Then, I created a new function for creating destination squares of queen which just called both the rook and bishop function. As this was really easy I was pumped to move on creating king’s destination squares as it is also really easy. Took a sip of coffee and continued my coding journey. I was wrong 🥀. I got stuck adding the king’s destination squares. I was first thinking of combination of rook and bishop but only one out from every side. This was the wrong way of thinking ig. Then I thought I should use two nested for loops for creating the destination squares which firstly worked out badly cuz I’m dumb. The destination squares we’re being created in such odd manner. After fixing that I had to also remove the destination square which was being created on top of the king and also had to handle to not generate some destination squares when the rook is on the edges of the board. I have done nothing today due to my illness. I hate my immune system 😭. I’ll code for 5 mins now ig for keeping my streak alive. Okay biee.."}, {"post_id": 39546, "ts": "2026-08-02T15:52:07Z", "hours": 3.3606, "text": "The rook got some moves 💃 Updates: Added movement to piece when destSquare is clicked Added mode state for seperation of chessboard in puzzles and vision page Moved states, refs, effects and functions from Chessboard.jsx to VisionContext.jsx Working on handling vision page data if user switches to other page during vision practice Finally I can proudly say that the rook can move now. I am really happy that it’s working. To move the rook I had created destSquares(the square with green dots) last time. Now if the user clicks on any of the destSquare with some maths the rook move to that square. I’ve added transition for the movement to look smooth. While doing this the rook did move to the destSquare but when clicked on the rook again the destSquare appered from when the rook was last time. To fix this I grabbed the destSquare location (e4) then set the squareid of piece to the location. The destSquares were calculated based on the squareid so now after moving the rook I can move it again. Also now if the a piece is seleced the background color of the pieces changes. When a piece is selected then destSquares appear but if the piece is selected again or other square is clicked then the destSquares are removed. Small things like this is making the chessboard feel lively and feel that it works correctly. I wanted to do this before but I thought I’ll do it later. I added a mode state in Chessboard.jsx. The mode state is either “puzzles” or “vision” representing the page the chessboard is on. I have made the pieces not appear while I’m in vision page and am trying to make sure nothing is running behind the scences if user decides to move to another page after they click on start. The countdown timer code of vision page was in Chessboard.jsx. I didn’t like that so I decided to move the code to VisionContext.jsx with the timer I move some states , refs and function with it. I had some issues during this migration but it wasn’t too difficult to resolve. I thought I had worked more but seems like I’ve. I’m confused, when I think I have done little work at that time I some how end up will better hours and when I think I have done decent amount of work I end up with less hours. Anyways it feels good watching the rook moves are working correctly. This much for this devlog. Peace ✌️"}, {"post_id": 38612, "ts": "2026-08-01T02:55:53Z", "hours": 4.9544, "text": "I got sick 🤧🥀 Updates: Make pieces position perfectly to square in chessboard Moved chessboard states and refs to ChessboardContext.jsx Fixed pieces sometimes being group together in one square when chessboard offsetWidth is null Added destSquare element on click for all possible moves of rook Last time I did position the squares but when I changed the background color of pieces there was a slight misalignment. I started searching what was causing that to happen. It was due to the height and width of chessboard being in decimals. I checked to see what lichess were doing and found out the height and width of the chessboard were always divisible by four. I did the same for my website and now it’s perfectly aligned and that’s what I love to see. Moved the states and refs from chessboard.jsx to chessboardContext.jsx to make the chessboard code less cluttered. The code relevent to puzzles page is in the chessboardContext while the code revelent to vision page is still in the chessboard page. When the page was loaded for the first time the pieces were being group together at the top left square. It was being fixed automically when the page was reloaded. It also happened while navagating from home page. I found out this was happenning due to chessboardWidth being null at start. To fix this I created a useState for the chessboardWidth so the page rerendered after the value was changed. My goal today was to make the rook move but I could only work up to generating the destSquares when the piece is clicked. I achieved this by creating a useState array and if user now clicks on the rook it calculates all the possible squares that the rook can move to and then that array is mapped using math to place destSquares perfectly on top of squares. The destSquares have a dot insided them which will be replaced by a icon but that’s the reason they’re not aligned centered currently. I did have a hard time doing this. Let’s not talk about it. 😭 I’ve written everything in short so that I don’t hit the 4000 characters limit and also ig it’s better for people reading (if any 🥀). I got sick yesterday and was just able to work on my project for 1 hr. Today I thought didn’t work much but it seems today I did 3 and half hrs. I am happy about today. I really don’t know if I can create the puzzle but I’ll try my best to do so. Everything I try to do seems to come with their own set of challenges and take time to overcome those challenges. Let’s see what happens 😔"}, {"post_id": 37397, "ts": "2026-07-30T02:35:38Z", "hours": 3.0969, "text": "The pieces have been placed. I was so sloppy 😭 I’ve added pieces to the chessboard. I’ve finally started facing my fear and started working on the puzzles section. It seems that creating the chessboard for puzzles will be harder than I have anticipated. Also please don’t mind the black pieces blending in with the background. I didn’t find chess piece set I liked so I downloaded the lichess chess piece set from pinterest. I was trying to crop them in figma and I coundn’t crop them properly. Also it was a tedious job. After downloading two crop pieces from figma I again went to the web to find out if someone already made them. This website came in clutch (greenchess.net). They had the whole chess pieces set of lichess available for download. Then, I started to code with no plan in mind . I don’t know why do I do this to myself. Obviously it was a bad decision. So I decided to use pen and paper to mainly solve one thing and that was how to place the pieces on the board. The writing helped me alot to think better. I was so sloppy while coding. I was mostly outside while coding and I was really distracted. One sec I was coding and another sec I was thinking about something else. I was making so many silly mistakes making the process more frustrating that it already was. I learned about fen while doing this (Forsyth-Edwards Notation). Through this any chess position can be stored and recreated in one line. It looks like this rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1 I only needed to loop over the first part divided by slashes for positioning the pieces. Other things will be used later. I feel the code is really poorly written but it works so idk. I also found out about regex while I was trying to write a if condition for seperating strings and string with numbers. Okay this much for today. Bie…."}, {"post_id": 36798, "ts": "2026-07-29T02:45:06Z", "hours": 2.2681, "text": "Moving onto something big (I’m scared) Updates: Change ui of popup menus in options.jsx Added sounds for correct and incorrect attempt in chessboard Added countdown and start sound in chessboard.jsx Added puzzles page Renamed sidebar of vision page and it’s component with prefix of vision. Most of the updates in this devlog are small changes. But now I am going on to work on the puzzles page. I don’t know how I will figure this out. I hope it goes mostly smoothly.. I had designed the popup menus in the last devlog. I think the newer design is much better than the last one. The popup menus don’t look the same in the figma and the website cuz I tweak some things while coding. The figma design was a rough design Adding the sounds in the vision page has made praticing much more fun. The built in mac recorder doesn’t record sound unfortunately or I just don’t how to.. So, I’ll add a ss of vision page with menu open and a ss of puzzles page. I added chessboard and sidebar to vision page. There were two sidebars now so I decided to rename vision page sidebar to VisionSidebar and puzzles pages sidebar to PuzzlesSidebar. Okay that was all for this time. Give me strength to start making the puzzle by liking and commentin on the devlog. Byee ♥️. Also if you’re reading this support @PAPER_01 . AniShuffle has been taken down but she’s been unbanned now 💖."}, {"post_id": 36163, "ts": "2026-07-28T02:25:06Z", "hours": 3.6781, "text": "You’ve my coordinates now Updates: Added coordinates to chessboard Changed previous to current Fixed user input on chessboard being checked before countdown finished The show coordinates now works Fixed some event bubbling issues in colorMenu and timeMenu Designing the pop up menus Now it’s easier to locate squares with the help of coordinates . Now you will also notice the board has fliped while changing colors. ~ A small change, in the sidebar the previous word has been replace with current. I think the current word makes more sense there. ~ I also fixed user being able to click on the squared before the countdown finished. This was a silly mistake from me. ~ The coordinates has made it easier to locate squares. But if you want some challenge then you can toggle show coordinates off now. ~ That’s all for this devlog. If you wan’t my actual coordinates dm me 😄."}, {"post_id": 35623, "ts": "2026-07-27T05:20:24Z", "hours": 7.9881, "text": "We’ve reach 100 hours 🎉 Changes: Fixed timer not displaying in sidebar Removed the square display after time is over Fixed timer setInterval running multiple times and made countdown timer code cleaner Fix TimeMenu not closing Removed unused imports Designed the sidebar to add new data Added the new design Added animation to make the square notation that appears on the chessboard disappear First of all, we have reached 100 hours let’s goooooo. I would like to thank everybody who have followed my project read, liked or commented on my devlogs . My project has recently started getting some traction. Special thanks to @PAPER_01 💖. I have done a lot of things this devlog. I will try to cover these in as short as possible. It seems that the setInterval in progress.jsx was running twice. I found out this while I was making the countdown timer code cleaner. So to fix that I reset the hasCountdownCompleted as soon as the timer in progress.jsx runs out. Now, countdown and progress timer work as intended with cleaner code. The random color option in color menu now works. It was a little tricky making that work. Let’s just say it wasn’t working as expected but the fix wasn’t that hard. I liked what chess.com were doing. They were displaying the square notation and then the square notation would just disappear. The square rotation will also live in the sidebar so that if user forgets what the square was just displayed, they can easily look at the sidebar. I really like this idea and decided to implement on my project as well. But before I added this to the website, I first designed it on Figma. I also thought of displaying the score and best score on sidebar. Designing it was fun and tricky. I didn’t really like how the previous score and best score were looking and after some trial and error it looked okay. All of these things were fine and enjoyable to do but making the best score work was so frustratingggggg. It’s the reason that I couldn’t devlog yesterday. The issue was score was showing to be zero inside updateTimer function even though the score was greater than zero everywhere else. I thought fixing it wouldn’t be really hard. I tried console log score everywhere to see when the value was being zero but there was no sign of the score turn into zero. Later I found out that due to the updateTimer function being inside a setInterval the value is kind of locked and used useRef hook to solve the issue. Okay, that’s all for this devlog. Now that I have reached 100 hours let’s aim for 150 hours as soon as possible. I have taken very long to write this devlog so I like would be heavily appreciated 😄."}, {"post_id": 34403, "ts": "2026-07-25T02:47:48Z", "hours": 4.5364, "text": "Mostly cleaning up the code and breaking things Changes: Made timer code better and cleaner Added functionality to timeMenu options Added countdown before starting the timer and displaying the squares -Added VisionContext.jsx to make code cleander and broke down vision page into smaller components As I said in the previous dialogue, the timer code was messy. So I decided to clean the code now it looks much better. Also now the time button options work now the timer will have 15, 30 or 45 seconds according to what you choose. So before, after cleaning on start the timer would start right away and the square would also show up. But this might make the user frustrated as they have to click start and right away move their mouse to the chessboard. I saw that chess.com has a countdown timer so I also made one. The code for this countdown timer is also messy so I will probably make it more cleaner next time. This is the main thing I have doing this whole devlog which I cannot show you because it’s just making the code cleaner. The vision pays had a chessboard component and then sidebar element to it. The sidebar element had all the code which was making the vision page could a lot messy. So I have broken down components into components and those components in the further components. I think this is making the code much more easy to read and find and debug each component more easily. But in the process of cleaning my messy code, things have broken down. The timer isn’t working, I will fix that later. I don’t have much to show here today so the see the countdown timer working and the broken timer 😝. I will fix everything in the next devlog. So stay tuned. Bieee…"}, {"post_id": 33853, "ts": "2026-07-24T03:14:59Z", "hours": 4.7681, "text": "Ayy almost 5 hrs today !! Changes: Fixed attempt square and attempts not wrapping as expected Fixed color being stuck in chessboard when same square is clicked rapidly Added color menu popup when click color button in sidebar Added time menu popup when user clicks time button in sidebar Added Progress component in sidebar with working score Made timer in progress.jsx functional Fixing the user attempts in the was pretty easy. I just added a attempts container to wrap the attempts element and then the CSS work as expected. Fixing the red or green colour being stuck in chessboard when clicked rapidly was a headache to fix. I was trying my best and at last I came up to the decision that I needed a timeline for the animation before the animation was played the progress of the animation should be zero. I tried that and obviously that didn’t work but it seems that I was close to the answer. I used Claude to figure out the answer and Claude used killTweenOf gsap function to remove the animation before the animation was even played. It also added a onInterrupt property to the animation which basically reverted the stuck colour after killing the animation. I didn’t want to use Claude, but I just couldn’t figure it out and I think it was better to use Claude as I have never used those functions and properties of gsap. Also Claude made that portion of my much cleaner. Seeing this now, I will be more focused on the cleanliness of the code because claude showed me that my code was repetitive and how it could be made smaller and easy readable. I decided to make the colour menu pop-up and time menu pop-up straight by coding instead of designing it first as I should have. As you can see, the result is very terrible. I am sure definitely fixing it in the next devlog. I was force thinking of making a pop-up menu component and using them in both buttons but I found that it was a hassle and not worth it. Only the white and black button in colour pop-up menu work. They just rotate the board and that’s all I still need to add functionality to them. After learning the lesson that I should definitely design before coding. I started designing the progress component. Although there isn’t much to design there I definitely would have made it as bad as the pop-up menus. While coding this, I also made the score display the total number of correct at attempts which was pretty easy. I just had to add one digit whenever the chose the correct square. Then, I started working on the timer. The timer would have been really easy if I just used setTimeout every second but I like to torture myself so instead of just doing that, I challenged myself using date constructor. I have done this before but it has been sometime and I remember how it worked. The countdown started from 28 which was frustrating. Now, I have just completed that but the code is really messy. I will definitely fix that tomorrow or today as I might post this devlog tomorrow. I think that shorter devlogs do better in terms of views. I’ll try that next time. See you in the next devlog 👋."}, {"post_id": 33005, "ts": "2026-07-22T15:24:41Z", "hours": 3.3339, "text": "Things are going great Changes: Added chessboard component with ranks and colored squares Added function for generating random squares and displayed them Added feature to display green and req squares to indicate whether the user clicked correctly or incorrectly in the chessboard Displayed attempt made by user in the sidebar with respective colors for correct and incorrect ones I thought doing all of these took me at least four hours but I was wrong. It seems that it’s only been about like three hours. This time I have worked on the chessboard itself on the vision page. Before it was just a plain whiteboard but now there are individual squares which was pretty easy to implement. I however needed some time to figure out how to add colours to the squares. But it also wasn’t that difficult. Then I created a function for generating random squares with the help of math.random(). I created an absolute element to display the random squares at the centre of the chessboard. To indicate the user that the square they have clicked is correct or incorrect I played the small animation that changed the colour of the user clicked square into red or green depending upon whether the user input was correct or incorrect. I was stuck here because I didn’t know how to reverse the animation. Of course I could just change the colour to green and then the colour of the square but that didn’t look quite right as I am probably going to change the chessboard colour later. So I wanted the animation to be flexible I was trying to play and reverse a animation timeline but it was so much easier than that later. I just remember there was the repeat and yo-yo property that will easily accomplish this effect I’m looking for. I have found a new bug with this if I spam click a square the square permanently turns into either red or green so definitely I will fix that in the next devlog. Also now the squares that the user clicks will be displayed on the side bar. The colour of this square notation will be red or green depending upon the user selected the square correctly or incorrectly. I have found out that there’s a flex related css bug in attempts element. I will look into that tomorrow. Okay bie.. Hope you have a great day 💖"}, {"post_id": 32765, "ts": "2026-07-22T04:05:46Z", "hours": 4.1331, "text": "Started working on the vision page Changes Designed the vison page Created the vison page and worked on the sidebar ui I have changed the name from visualisation to a vision. I actually don’t know which one is better. I just changed because chess.com and chesskid.com had vision for practicing the squares on the board. Designing of the vision section was quite fun although I had some issues with auto layout that wasn’t big of a deal. I was thinking what options should I have and thought it would be best to add show coordinates, change the color and select the time. I think the UI turned out pretty great. I will probably change the colour of the chessboard but black and white also looks fine. Coding design wasn’t too difficult. It was just copying the design that I made, but the Figma design looks different. I should check out why the size of the buttons are the same but in Figma they look a lot bigger. It might be because the width of the sidebar is not the same. In conclusion, this was a peaceful devlog. It feels really nice not having to fight with your code and your designs. Hope that the future develops are the same 🤞. Until then peace✌️."}, {"post_id": 32156, "ts": "2026-07-21T03:52:34Z", "hours": 4.9689, "text": "We have followers Changes Designed hollow medals Switched from localStorage to db for storing updating and retrieving completed courses data Added feature to show medals achieved by user Designing the hollow medals (I don’t know what to call that so I’ll just say hollow medal) was really fun. I just started designing the medal for fun in Figma. The result turned out really great even better than what I had expected. I was using circles for the medal itself and was trying to use the rectangles for the below design. Later I figured that it would be wiser to use the pencil instead of creating a rectangle and mapping out the bottom portion of the medal which turned out to be a great idea. In this project, I have started using Figma for creation of some assets and I am loving it so far my intention is to keep on using Figma until and unless I really have to use AI. Switching from localStorage to database for completed courses data was easy in my head but it took me longer than expected mainly because of three reasons. Firstly, I was thinking of creating a separate backend endpoint for course data. After creating the controller and route for course data I thought that it isn’t really necessary to create another endpoint for this as we can store it in the users data itself. Secondly, after deleting the routes and controller, I created API function for fetching and updating the completed course data period I had forgotten that I don’t actually need to have a separate getCompleted function because while fetching the user itself, the data comes with it. I have forgotten to delete the getCompleted.js file which I will do later. Thirdly, I have started to use Postman for testing out api . I am loving to learn things such as Postman and Figma. But this issue I was facing was the postman was working correctly but from my codebase the request body was showing undefined. It was a fetch thing I use axios before and I am figuring out right now why people used axios. It seems that I needed to specify in the header that this request had the content of json. So figuring that out also took some time. Also, I have added the feature to show medals achieved by user. The code isn’t quite clean for this feature. Thanks to the people that followed this project. I genuinely appreciate that 💖. New followers : @PAPER_01 @sak"}, {"post_id": 31100, "ts": "2026-07-19T07:07:40Z", "hours": 3.5, "text": "When will my devlog get more than 7 views 😭 Changes: Added loading component Added scrollsmoother in home page Fixed course page padding and added toast while redirecting unauthenticated user Added back button to signup and login page Designed the logo for website Added the logo to the website Now whenever the frontend fetches user data from the backend there will be a loading component that will come up. I made the loading spinner myself in figma why not 😃. Scrolling the home page using a mouse is so much better now now due to scrollsmoother plugin of gsap. I was facing a issue with this though. I was seeing an error while navigating to other pages. After a while I found out a guy with same issue in gsap forum and his solution worked. God bless that guy 🙌. Some small changes were fixing the padding in course page , adding a toast while redirecting unauthenticated user from couse page and adding back button in singup and login page. I think they don’t need much explanation. I tried to design the logo of my website in figma. I tried different things and landed with a design that felt decent (The logo with king in the center). I look nice up close but it didn’t feel the same when shrunk down as a logo. So I started designing another one. I landed on the logo with cyan and dark purple background and !! symbol up front. I really don’t know how I feel about this logo. I looks decent sometimes and other times questionable. Please leave your opinion in the comments 🙏. While adding the icon as a favicon, for some reason the favicon wasn’t display which was confusing. Later I found out that this was a brave issue cuz it’s showing up in zen browser. Okay this much for now. Please like so that more people see this devlog 😭."}, {"post_id": 30508, "ts": "2026-07-18T04:21:03Z", "hours": 5.0097, "text": "Wth it’s been 5hrs?? Added toast for login signup and login as guest errors Made the signup data persist even after the value of hasContinued changes Designed the dropdown menu Added dropdown menu Added logout functionality First of all, I’m genuinly confused how this took me 5hrs.. Added toast so that now when there’s any error during the signup or login. For example during signup maybe a user might write a username less than two characters, then the toast pops up telling the user it should be greater than 2 characters. I was stuck during this cuz the trycatch block wasn’t catching the error which was confusing. I used axios previously and it threw an error if the backend response wasn’t ok. But this time I avoided using axios for reasons that you guys probably know 💀. It seems that fetch didn’t throw any error so I had to manually throw errors in the api functions. The making of signup data persist on hasContinued value change was early. I just set the value attribute of input to be it’s respective useState data. As you can see in the image that I designed the dropdown. I first designed the dark one which I really loved but it didn’t match the navbar so I created a light one. After seeing the dark one I really didn’t like the light one. So I tried fixing the design. I asked someone in the slack and they said the previous light dropdown design looked fine. Ig looking at the dropdown for long made it look fine to me as well 😂. Now I added the dropdown to the website. I had issue with the padding of the logout button during designing phase but I just winged it during coding phase and it worked 🎉. The dropdown now looks fine imo. I however did have a issue while making the dropdown closing work when user clicked outside of the dropdown. I thought of using an overlay in the background but I knew that there was a way of doing this by checking the click event. It seems I had forgetten to do this. After some trial and errors I remember how it was done.. I also added logout functionality which was fairly easy to add cuz I’m storing the jwt in the localStorage. I just removed the token for localStorage, set the user to null, set isDropdownOpen to false and navigated the user to the home page. Ig, i’ll try do things faster next time ⚡️. Don’t want to spend 5hrs on things like these. Okay biee…"}, {"post_id": 29446, "ts": "2026-07-16T12:12:04Z", "hours": 2.0422, "text": "Omg it’s finally fixed I finally fixed the bug that I addressed in my last devlog. This was so frustrating. I never expected that this would take me 2hrs and I would write a whole devlog on it 💔. The bug was that when I was logging in I was being redirected to /signup after signup, login or login as guest. I had made so that after signing up or logging in the user would be redirected to course page. I had also made it so that if the user value is null then the user would be redirected to the sign of page. So now you can see that where this is going. I just couldn’t simply figure out why the user value was null. After doing so much thinking and reading the code and trying to fix the bug, I have finally succeeded.Another issue that I was facing during the working was I was constantly forgetting what I was doing and to see everything visually I used excalidraw as you can see in the picture. So there were three things that was leading to this bug. Firstly, I wasn’t using the await keyword while calling the api functions. Secondly, I didn’t have a loading state while fetching the user’s data. Lastly, the function getUser function responsible for fetching the user data wasn’t even being called when redirected to course page. The function was only being called when the user first loaded the website. Right now, my head is aching now I think I should take some rest. I didn’t remember to add loading state which was so silly of me. I only realized that after visiting my old project. Seeing that I felt dumb because ofc you would need a loading state while fetching the user data from backend. I feel a little relieved now 😮💨. I cannot even remember properly all the things that I tried to solve this. It was just a mess 😩. After solving the bug, now looking back, it wasn’t that difficult to solve. It was just a me problem. I could write more on this but I’m too tired for this now. Okay biee..👋"}, {"post_id": 28787, "ts": "2026-07-15T09:05:35Z", "hours": 2.67, "text": "Life is frustrating 😩 ##Changes: Added navigation to /course after successful login Designed navbar when user is logged in Added the user button in navbar when user is logged in Added redirection to signup if user goes to /course without authentication Fixed jwt malformed error in protectRoute.js The navigation to /course after successful was implemented before but I somehow missed to implement that in login page. Designing the navbar for authenticated user was very challenging than I expected. As you can see in the image there are multiple attempts at creating the navbar. Everything I tried was just looking bad. The final design is also questionable. But for now it is what it is. Now unauthenticated user aren’t allowed to visit course page. They will be redirected to signup page if they try. This was supposed to be simple but somehow I made this also hard for myself. I have done this before so this should have been easy for me but nope. The redirecting was working fine but I were to be authenticated and be on course page and then reload, then also I would be redirected to the signup page. After I made up my own solution for this which I don’t think is the best way to do it. Due to my incapability of designing simple things and solving minor bugs I was questioning my ability to solve problems and design. Which at that moment felt sad 😔. Also there was jwt malformed error popping up in the backend which was also frustrating to solve. Not because it was hard but because it was easy and I wasn’t able to solve it. I won’t tell you what happened here as the devlog is getting long. No video this time cuz the I can’t show the navigation changes working as they aren’t working properly. The bug is preventing user from redirecting to /course after login or signup. Instead user is redirected to signup. I know that this because of the two redirection changes made in this devlog. So, I’ll go and fix it asap. Hope your coding experience isn’t going as frustrating as mine. Thank you for reading my frustrations. Bye…👋"}, {"post_id": 28126, "ts": "2026-07-14T06:43:34Z", "hours": 4.0444, "text": "I’m sorry 😭 ##Changes: Use localStorage to store jwt instead of cookies Fix signup page unequal width of img and form container Changed login.css similar to signup.css for consistent code Added login as guest functionality Added navigation to /course after signup or login success Added UserContext.jsx to handle user data Added protectRoute middleware to verify jwt Added “/api/user/“ endpoint to get user data from backend Too many changes, let’s break them down. I’m sorry that I switched to localStorage to store jwt instead of cookies 😭. The cookie wasn’t working as expected. I was able to store the jwt in the cookie and receive it in the frontend but when I reloaded the cookie would just disappear. I know that there’s a fix for this as I have done this before as well. But, I know that I’ll face the same issue during deployment even if I fix the issue now. I’ll probably deploy this in vercel and last time (in flavortown) I had to change the whole code format due to the cookie issue. So this time I’ll just rely on localStorage for now. If I deploy the website myself then maybe I’ll consider using the cookie. But for now just forgive me 🙏. I fixed the unequal width of img container and form container with again in signup page. This happened because I added padding to the form-container instead of the form. Using flex for this was a headache so I used grid and it worked. Although I didn’t necessarily needed to change the login page css. I did it to maintain a consistent codebase. This is a huge one. I added login as guest functionality. I know that people will be skeptical of entering their email even though they can use any made up email such as [email protected] . I purely added this feature so that people don’t rate me bad just because they assumed that they need their own email to signup. And logging in as guest is easier as well so why not. Now, after the signup, login or login as guest is successful then we’ll be redirected to the course page. Later I’ll make it so that users who aren’t logged in won’t be able to access any other path except for the “/“. Also now there’s userContext.jsx for storing and distributing user data. For now there’s getUser function for getting user’s data. I have made the backend work to verify the user’s token and then only provide the user with their data. Alright no more yapping, the devlog has gotten very long. If anyone has read this devlog, God bless them. ~ Peace ✌️."}, {"post_id": 27519, "ts": "2026-07-13T04:42:38Z", "hours": 4.9611, "text": "More progress on signup and login Changes: Designed the username form Created the username form in signup Changed useRef to useState to store signup data Adjusted the backend to receive and store username Add login functionality Fixed required attribute not working in both signup and login form Designing the username form wasn’t that hard as it’s just the signup page but will less things. I looked at how chess.com was doing things during signup and thought it’s better to split the email and password into one form and username form into another. There’s also a back button to go to the email and password form. Coding the username form was a little frustrating as I had some issue positioning the back button. Now it’s working but now I am facing the old issue of img-container and form container not being the same width. I’ll fix that next. Also the way username form is display is by just toggling a state into true or false in the singup page. After adding the username form there was an error telling that email and password was null. This was because while entering the username I wouldn’t be able to access the email and password input using the useRef hook. The fix was simple, I just changed the useRef into useState and store the data on input change. Now that was extra data (username) that needed to be stored. I sent the username along with email and password to the backend and changed the userSchema to accept username. I worked on the signup functionality last time so this time I worked on the login functionality. In short, now during login the backend verifies the email and password and gives the user a jsonwebtoken as a cookie or an error. I wanted the input to display “field is required” when user tries to login or signup without filling in the form. I just couldn’t get this working and it was so frustrating because the issue was so simple. Later I found out that I was using e.preventDefault on the button instead of the form causing the input to not show “field is required” Okay enough yapping. Gotta go and work on the project. Hope your project is going smoothly. Bie…👋"}, {"post_id": 26400, "ts": "2026-07-11T05:20:12Z", "hours": 5.6911, "text": "50 hours!! Let’s go 🎉 Changes Designed signup page and login page Created signup page and login page Divided the codebase into frontend and backend Setup backend Setup signup endpoint to receive formData Designing the signup and long page was really fun. I took some inspirations from pinterest. I’m proud of the design I made 😄. Turning the design into code was also fun ig. I did face a small bug. The image looked bigger than the form but both had flex-grow of one. The fix was simple I just had to change the flex-basis to 0 so I did flex: 1. Finally I’ve started on the backend. It’s been some time since I haven’t done backend stuff. Coming back to backend felt nice. Although it was frustrating when the data sent to backend was just saying it was undefined. But after some time I just figured out that I forgot add express.json() middleware in my server.js. I’m well now and feel that now I’ve no motive of slowing now. Hope you’re also doing well 🤞."}, {"post_id": 25132, "ts": "2026-07-09T04:37:06Z", "hours": 2.7414, "text": "Many small improvements Changes Made the opened cards remain open after finishing a lesson or going back from watch course Saved completed course data in localStorage Added confetti animation after clicking on finish lesson Fixed value of total in course.jsx by making it dynamic Fixed navbar animating when reloading on non home paths This time I have done many small changes but I think that they make a great impact on the website. ~ Firstly I made the card remain open while visiting other pages. I mainly did this as a part of user experience. I thought that it’s inconvenient for a user to see the card they opened being closed after they come back from the course watching page. ~ Also, now the data of completed course persists. It is stored in localStorage. I’ll definitely stored the data in database in the future. Also I was facing an annoying bug doing this because I forgot that I needed to stringify the data before storing in localStorage😭. ~ There’s now confetti animation after clicking finish lesson. I think it looks nice. I used a npm package for the animation. ~ Before the total course was a dummy value of 10. Instead of counting the courses manually I just did a sum of length of all courses data from constant.js. Now, when I change the professional course value I won’t have to think about changing the total value. ~ The navbar animation was meant to run only when user move from home page to other page and vise versa. But, when I was on the course page and if I reloaded the animation would still happen. Fixing this was really painful as the solution was really easy but I just couldn’t figure it out. At last I took the help of Claude to figure out the solution 😩. ~ I took two days off because I was sick again😭. Why is my immune system so weakkk😭.."}, {"post_id": 22223, "ts": "2026-07-04T16:15:12Z", "hours": 2.0581, "text": "Now the completed course has a green tick mark Basically now if you click on finish lesson you’ll be redirected back to the course page and the lesson you choose as completed will have a green tick mark inside the course card. ~ Also, if a lesson is completed the navbar won’t show the finish lesson button. ~ Right now, the data doesn’t persist across reloads. I will store the data in localStorage next and when I implement the backend, then only I’ll store the data in database. ~ The challenging part was seeing the whole picture. How will the feature work, where will the data live and how to know if a lesson is completed, things like that. ~ Also, during development I thought of using useContext hook but I had forgot how to use the hook while following best practices so I just went to my previous project to relearn stuff😅😆. ~ I decided to use pen and paper for problem solving and better visualization which worked really great for me 🎉🎉. I will definitely do this when I encounter problems in the future 😄. ~ Btw, No bullet points this time😅. I haven’t completed much as I’m sick. Hopefully I get well tomorrow🤞."}, {"post_id": 20676, "ts": "2026-07-02T10:26:56Z", "hours": 4.2492, "text": "I’m locked in Progress: Changed the dummy data from beginnerCourse and intermediateCourse in constants.js Created WatchCourse page Made courseCard open WatchCourse page with respective course video Made navbar show go back and finish lesson on button if the user is on WatchCourse page Designed a banner for the course page I changed the data of beginnerCourse and intermediateCourse in constants.js file which instantly made the cards inside both beginner and intermediate so much better. The professionalCourse data hasn’t changed and will be changed later. ~ After that I worked on one of the main feature of the website which is being able to watch the course. Now, if user clicks on a course that they want to watch, then will be redirected to WatchCourse page. I achieved by using the YouTube embed link and dynamic routing. ~ The navbar also changes in WatchCourse page as there will be go back and finish lesson button. The go back button currently works but I still have to work on the finish lesson button. ~ I took a break from coding after doing that and started working on the banner. I don’t really know how the banner should look so I just added a gradient, two chess pieces, some text and some chess analysis moves and called it a day. ~ Now I’ll go export that banner and add it to my website. If you have any recommendations please let me know. Biee.."}, {"post_id": 19060, "ts": "2026-06-30T07:56:09Z", "hours": 4.2233, "text": "Mostly designing and coding that design. Progress: Completed the info element Designed the course card inside the accordion Created the course card component Moved accordion, courseCard and progressBar component into components folder within the course page The course page is slowly but surely coming together. I think the info element looks really nice now that it’s complete. But yeah the list does contain dummy information. I will change them after I have selected the videos as my courses. ~ CourseCard component seems okay imo. The tick mark is supposed to indicate that the user hasn’t completed that course. After the individual course is completed it will go green. I have mixed feelings for the tick mark being there. The idea seems find but I’m really not sure about the design. ~ But anyways it was fun designing in figma. In the website have made the CourseCard with the ability of each card having different text and image but right now they are only a little different in different levels. ~ Idk how time passes so quickly. Got only this much done in 4hrs😕 but I think I am now starting to enjoy the process. I am not focused on the time so heavily as I was before 😇. ~ Okay this time I have decided to keep my devlog shorter. Any opinions will be appreciated ❤️."}, {"post_id": 18099, "ts": "2026-06-29T03:11:34Z", "hours": 5.4111, "text": "Ayy new devlog let’s go!! Updates: Designed the info part (the portion with the progress bar) Created working accordion component with animations Started working on the info part Created working progress bar component with animation I like the design of the info element. I have tried using hierarchy to make the design look good. Also I randomly had the idea of earned badges after the user completes the whole course of a certain difficulty. Then, I hoped onto coding the accordion. Firstly I wasn’t making accordion as a component. There were just three div in the course page and I realized that if I don’t make it a component the code is going to look messy so I created the accordion component and now the code looks much cleaner. While making that I stumbled across a funny bug. Clicking on one accordion component was making all component to open. It was because of gsap selecting all the similar classes and animating them. I fixed that by using useRef to select elements. I have also created a progress bar and now I’m working on completing the info element. The progress bar looks good if it’s even a little bit full but idk how I feel about the progress bar when it’s at 0%. It feels bland and idk what to do. Okay enough rambling. I feel my devlogs should be shorter ig. Anyways if you have any suggestions please let me know. Peace ✌️Ayy new devlog let’s go!!"}, {"post_id": 16777, "ts": "2026-06-27T07:43:36Z", "hours": 3.9072, "text": "Updates Added RootLayout.jsx for reusing a single a navbar across all pages Changed react-router-dom to react-router Added expanding animation to the navbar when the path is “/” and shrinking animation on other paths except “/” Designed the course part in course page What I wanted Before I added the navbar inside home page but after creating the course page I realized that I would want the navbar to be reusable across all pages. Also I wanted the navbar to expand in other pages expect the home page. Switch to react-router I was using react-router-dom for managing routes. I tried to look up the docs to make the navbar reusable. I couldn’t find anything and saw that react-router-dom just used react-router so I thought it’s was not necessary for me to use react-router-dom so I just switch to react-router. Navbar animation issue Animating navbar to expand and shrink was a mess. It’s look really simple and it is simple but not for my brain. I first thought of making the width to 100% and set align items to center. The width part animated as expected but the align items didn’t. Then I thought of using position absolute and centering the nav but now the navbar wasn’t respecting the nav-container’s padding. It was frustrating so I took help of claude and centered it using y property by doing some maths. Time flies I also had issue with the timeline reverse not working but I think I should stop my complains here. I am rambling here because it took too long to do too little 😭 . Designing the course page On the positive side the I have started working on the design of course page. I have only done a small part but it’s looking amazing. The part other part that don’t look right were the design which I made during the start of the project. Rn I am just refining that previous design of mine, that’s why the navbar looks different in figma. Hope you have a nice day ❤️"}, {"post_id": 16064, "ts": "2026-06-26T03:14:51Z", "hours": 4.9211, "text": "Visualization section transformation Separated visualization section into text wrapper and body wrapper Added a text with reveal animation in text wrapper Added visualizedMoves with animation around the img-container Deleted the thought component Finally I get to post a devlog with some good. It’s a better time cuz I’m logging both the figma and the coding time for the first time. Previous design I didn’t really like the previous design so I thought for a while and came up with this design. Although it isn’t perfect it’s much better than the last one. The figma design and the website don’t look the same because I just did the design roughly in figma and then winged the chess moves position in vscode. I think removing the background of the chess moves was a great decision. New design Firstly I designed the concept in figma before coding. I added a text wrapper within the visualization to break the flow of the website. The previous design which I was going towards started feeling like a generic website (a bad one). Now the there’s text with a reveal animation which looks pretty simple tbh but I think it’s better. I might change that in future though or add elements to make it look fuller. The after the text animation the person visualizing image appears and different moves appear indicating that the person is thinking the moves. I was going to use a thought component for this but I did it in a more simpler manner. Time I always underestimate the time required to build things. I feel that I should have completed more in the time that has been recorded but small bugs happen while coding which is really frustrating. In this devlog also I feel I should have completed more. Am I just slow or happens to others as well. I really would like to know (comment)."}, {"post_id": 14231, "ts": "2026-06-23T07:41:29Z", "hours": 1.8261, "text": "Hey, this devlog is a messy one. Changes: Created visualization section Created thought component Designing the visualization section Connected figma to hackatime I just figured out that I can add my connect figma to hackatime and record the time under this project. I have always designed this project before writing the code which a lot of time which could have been tracked is lost. That’s not a big worry as this project has long way to go. I just figured out that I can add my connect figma to hackatime and record the time under this project. I have always designed this project before writing the code which a lot of time which could have been tracked is lost. That’s not a big worry as this project has long way to go. Why this devlog is messy/incomplete The main purpose of this devlog is to figure out where I am currently in my project . I haven’t worked on my project like I used to because of my illness. So, instead of working on the project and forgetting what i did I just decided to commit the changes in my vscode write this devlog. I am hoping to work on this project as before as I am feeling better now. So that’s why the images below seem incomplete. Hope you guys are doing well. Btw the figma ss and the website image don’t match cuz i decided to change the figma design just before writing this devlog. I wasn’t happy with the previous design so i’m just tweking it to see where i land."}, {"post_id": 9977, "ts": "2026-06-16T14:48:46Z", "hours": 2.8114, "text": "Changes: Split home.jsx into smaller components Installed and applied different font weights Made navbar better Completed puzzle section on a basic level This time instead of jumping on doing something new I started with making the code cleaner first. It was easy as nothing broke. Then, I realized the font in the hero section doesn’t look as bold as in my figma design so after looking into the problem for a while I realized I had just the regular font weight of font downloaded leading to fonts looking different. Also made navbar better by decreasing horizontal padding in the button and adding a box shadow. Adding the box shadow made the navbar visible in the courses section. I also completed puzzle section which is looking good but I want to animate the image (Yoinked from chess.com btw 😅). The animation will bring so much life into the section but I really don’t know achieve that. If you can help me or have any suggestion in general please let me know. That’s all for this time folks. Piece ✌️ (It’s a pun btw)"}, {"post_id": 9132, "ts": "2026-06-15T08:50:45Z", "hours": 3.4731, "text": "Ayy new devlog!! Changes: Corrected timing of animations in courses section Added level indicator of thumbnail Added temporary images in each thumbnail. Added animation to course title Made animation on work reverse as well I’ve shifted on my macbook for coding which I’ve received from flavortown. Anyways, the courses section looks much better now. I am still not satisfied with the animation of courses info elements. I spend way to long to make that work but in the end I took help of gemini to make it work. Also, timing looks way better than last time. Now, I’m going to split the home page into smaller components to make the code cleaner. Also I’ve to do something of the navbar. Any suggestion will be appreciated."}, {"post_id": 7841, "ts": "2026-06-13T02:27:10Z", "hours": 2.3547, "text": "Changes: Added shrinking animation in hero section Moved courses text to a constants file Added thumbnails in the courses section with animation The courses section animation doesn’t look the way I want it to be. I’ll be fixing that.. Also things are taking more time than expected which is really frustrating. I thought this will take me about an hour but it’s still not finished. I’ll surely finish courses section today. Hope your project is going smoothly."}, {"post_id": 6073, "ts": "2026-06-10T06:20:34Z", "hours": 2.8981, "text": "Changes: Added text reveal animation Ahhhh it took three hours only to create this text revealing animation. I stumbled across many css and gsap bugs to make this. I first tried to use the ::before pseudo element which worked really well but later replaced it with span cuz i couldn’t figure out how to animate that with gsap. There are many other things that really annoyed me but lets not make this devlog a whole essay. But I love how it turned out in the end."}, {"post_id": 4195, "ts": "2026-06-07T12:47:02Z", "hours": 2.2108, "text": "Changes: Fixed the page stacking animation Changed the layout of hero section. Made navbar position fixed I was trying to make the navbar sticky which wasn’t working at first and was so annoying, after solving that I found out that it won’t go outside hero section. I was frustrated that I was messing up something so easy. Also it seems that I was doing the stacking animation the wrong way so I fixed that also. So now I have a clean stacking page animation and a navbar that stays at a fixed position."}, {"post_id": 2749, "ts": "2026-06-05T14:52:59Z", "hours": 0.9686, "text": "Created courses-section with page stacking animation. It took me an hour to figure this out 😭. I knew that I have to pin the hero-section but couldn’t figure out how to move the courses-section to overlap the hero-section. I watched different videos and even went to some random guy linked in account to find out the answer. But eventually I just figured it out myself. I still have to check if the way I have accomplished it is the correct way or not."}, {"post_id": 2615, "ts": "2026-06-05T07:31:04Z", "hours": 1.5622, "text": "Just worked on adding the animations to the home page. Also I downloaded the font instead of using google fonts cuz it was taking some time to load every time I reloaded the website. The animation of the hero text was a little tricky as it wasn’t working at first but then I found out the culprit was span. I change the span to inline-block and then the animation worked as expected. I have also made the let’s go nav button same as the cta button for consistency. You won’t be able to see the animations sadly cuz I’m attaching a screenshot here."}, {"post_id": 1995, "ts": "2026-06-04T08:13:05Z", "hours": 3.4961, "text": "First devlog I have worked on the hero section. I think it looks pretty good. I have some improvements to do on the nav bar. Also, I have to crop out the hero image. The image is taking alot of space rn. Now I’ll devlog after the hero section is complete and then will start on animating the hero section. Hope you’re project is also going well."}]...
|
Title: Evochess by @Sam | Stardance
Devlogs:
Firs Title: Evochess by @Sam | Stardance
Devlogs:
First devlog I have worked on the hero section. I think it looks pretty good. I have some improvements to do on the nav bar. Also, I have to crop out the hero image. The image is taking alot of space rn. Now I’ll devlog after the hero section is complete and then will start on animating the hero section. Hope you’re project is also going well.
Just worked on adding the animations to the home page. Also I downloaded the font instead of using google fonts cuz it was taking some time to load every time I reloaded the website. The animation of the hero text was a little tricky as it wasn’t working at first but then I found out the culprit was span. I change the span to inline-block and then the animation worked as expected. I have also made the let’s go nav button same as the cta button for consistency. You won’t be able to see the animations sadly cuz I’m attaching a screenshot here.
Created courses-section with page stacking animation. It took me an hour to figure this out 😭. I knew that I have to pin the hero-section but couldn’t figure out how to move the courses-section to overlap the hero-section. I watched different videos and even went to some random guy linked in account to find out the answer. But eventually I just figured it out myself. I still have to check if the way I have accomplished it is the correct way or not.
Changes: Fixed the page stacking animation Changed the layout of hero section. Made navbar position fixed I was trying to make the navbar sticky which wasn’t working at first and was so annoying, after solving that I found out that it won’t go outside hero section. I was frustrated that I was messing up something so easy. Also it seems that I was doing the stacking animation the wrong way so I fixed that also. So now I have a clean stacking page animation and a navbar that stays at a fixed position.
Changes: Added text reveal animation Ahhhh it took three hours only to create this text revealing animation. I stumbled across many css and gsap bugs to make this. I first tried to use the ::before pseudo element which worked really well but later replaced it with span cuz i couldn’t figure out how to animate that with gsap. There are many other things that really annoyed me but lets not make this devlog a whole essay. But I love how it turned out in the end.
Changes: Added shrinking animation in hero section Moved courses text to a constants file Added thumbnails in the courses section with animation The courses section animation doesn’t look the way I want it to be. I’ll be fixing that.. Also things are taking more time than expected which is really frustrating. I thought this will take me about an hour but it’s still not finished. I’ll surely finish courses section today. Hope your project is going smoothly.
Ayy new devlog!! Changes: Corrected timing of animations in courses section Added level indicator of thumbnail Added temporary images in each thumbnail. Added animation to course title Made animation on work reverse as well I’ve shifted on my macbook for coding which I’ve received from flavortown. Anyways, the courses section looks much better now. I am still not satisfied with the animation of courses info elements. I spend way to long to make that work but in the end I took help of gemini to make it work. Also, timing looks way better than last time. Now, I’m going to split the home page into smaller components to make the code cleaner. Also I’ve to do something of the navbar. Any suggestion will be appreciated.
Changes: Split home.jsx into smaller components Installed and applied different font weights Made navbar better Completed puzzle section on a basic level This time instead of jumping on doing something new I started with making the code cleaner first. It was easy as nothing broke. Then, I realized the font in the hero section doesn’t look as bold as in my figma design so after looking into the problem for a while I realized I had just the regular font weight of font downloaded leading to fonts looking different. Also made navbar better by decreasing horizontal padding in the button and adding a box shadow. Adding the box shadow made the navbar visible in the courses section. I also completed puzzle section which is looking good but I want to animate the image (Yoinked from chess.com btw 😅). The animation will bring so much life into the section but I really don’t know achieve that. If you can help me or have any suggestion in general please let me know. That’s all for this time folks. Piece ✌️ (It’s a pun btw)
Hey, this devlog is a messy one. Changes: Created visualization section Created thought component Designing the visualization section Connected figma to hackatime I just figured out that I can add my connect figma to hackatime and record the time under this project. I have always designed this project before writing the code which a lot of time which could have been tracked is lost. That’s not a big worry as this project has long way to go. I just figured out that I can add my connect figma to hackatime and record the time under this project. I have always designed this project before writing the code which a lot of time which could have been tracked is lost. That’s not a big worry as this project has long way to go. Why this devlog is messy/incomplete The main purpose of this devlog is to figure out where I am currently in my project . I haven’t worked on my project like I used to because of my illness. So, instead of working on the project and forgetting what i did I just decided to commit the changes in my vscode write this devlog. I am hoping to work on this project as before as I am feeling better now. So that’s why the images below seem incomplete. Hope you guys are doing well. Btw the figma ss and the website image don’t match cuz i decided to change the figma design just before writing this devlog. I wasn’t happy with the previous design so i’m just tweking it to see where i land.
Visualization section transformation Separated visualization section into text wrapper and body wrapper Added a text with reveal animation in text wrapper Added visualizedMoves with animation around the img-container Deleted the thought component Finally I get to post a devlog with some good. It’s a better time cuz I’m logging both the figma and the coding time for the first time. Previous design I didn’t really like the previous design so I thought for a while and came up with this design. Although it isn’t perfect it’s much better than the last one. The figma design and the website don’t look the same because I just did the design roughly in figma and then winged the chess moves position in vscode. I think removing the background of the chess moves was a great decision. New design Firstly I designed the concept in figma before coding. I added a text wrapper within the visualization to break the flow of the website. The previous design which I was going towards started feeling like a generic website (a bad one). Now the there’s text with a reveal animation which looks pretty simple tbh but I think it’s better. I might change that in future though or add elements to make it look fuller. The after the text animation the person visualizing image appears and different moves appear indicating that the person is thinking the moves. I was going to use a thought component for this but I did it in a more simpler manner. Time I always underestimate the time required to build things. I feel that I should have completed more in the time that has been recorded but small bugs happen while coding which is really frustrating. In this devlog also I feel I should have completed more. Am I just slow or happens to others as well. I really would like to know (comment).
Updates Added RootLayout.jsx for reusing a single a navbar across all pages Changed react-router-dom to react-router Added expanding animation to the navbar when the path is “/” and shrinking animation on other paths except “/” Designed the course part in course page What I wanted Before I added the navbar inside home page but after creating the course page I realized that I would want the navbar to be reusable across all pages. Also I wanted the navbar to expand in other pages expect the home page. Switch to react-router I was using react-router-dom for managing routes. I tried to look up the docs to make the navbar reusable. I couldn’t find anything and saw that react-router-dom just used react-router so I thought it’s was not necessary for me to use react-router-dom so I just switch to react-router. Navbar animation issue Animating navbar to expand and shrink was a mess. It’s look really simple and it is simple but not for my brain. I first thought of making the width to 100% and set align items to center. The width part animated as expected but the align items didn’t. Then I thought of using position absolute and centering the nav but now the navbar wasn’t respecting the nav-container’s padding. It was frustrating so I took help of claude and centered it using y property by doing some maths. Time flies I also had issue with the timeline reverse not working but I think I should stop my complains here. I am rambling here because it took too long to do too little 😭 . Designing the course page On the positive side the I have started working on the design of course page. I have only done a small part but it’s looking amazing. The part other part that don’t look right were the design which I made during the start of the project. Rn I am just refining that previous design of mine, that’s why the navbar looks different in figma. Hope you have a nice day ❤️
Ayy new devlog let’s go!! Updates: Designed the info part (the portion with the progress bar) Created working accordion component with animations Started working on the info part Created working progress bar component with animation I like the design of the info element. I have tried using hierarchy to make the design look good. Also I randomly had the idea of earned badges after the user completes the whole course of a certain difficulty. Then, I hoped onto coding the accordion. Firstly I wasn’t making accordion as a component. There were just three div in the course page and I realized that if I don’t make it a component the code is going to look messy so I created the accordion component and now the code looks much cleaner. While making that I stumbled across a funny bug. Clicking on one accordion component was making all component to open. It was because of gsap selecting all the similar classes and animating them. I fixed that by using useRef to select elements. I have also created a progress bar and now I’m working on completing the info element. The progress bar looks good if it’s even a little bit full but idk how I feel about the progress bar when it’s at 0%. It feels bland and idk what to do. Okay enough rambling. I feel my devlogs should be shorter ig. Anyways if you have any suggestions please let me know. Peace ✌️Ayy new devlog let’s go!!
Mostly designing and coding that design. Progress: Completed the info element Designed the course card inside the accordion Created the course card component Moved accordion, courseCard and progressBar component into components folder within the course page The course page is slowly but surely coming together. I think the info element looks really nice now that it’s complete. But yeah the list does contain dummy information. I will change them after I have selected the videos as my courses. ~ CourseCard component seems okay imo. The tick mark is supposed to indicate that the user hasn’t completed that course. After the individual course is completed it will go green. I have mixed feelings for the tick mark being there. The idea seems find but I’m really not sure about the design. ~ But anyways it was fun designing in figma. In the website have made the CourseCard with the ability of each card having different text and image but right now they are only a little different in different levels. ~ Idk how time passes so quickly. Got only this much done in 4hrs😕 but I think I am now starting to enjoy the process. I am not focused on the time so heavily as I was before 😇. ~ Okay this time I have decided to keep my devlog shorter. Any opinions will be appreciated ❤️.
I’m locked in Progress: Changed the dummy data from beginnerCourse and intermediateCourse in constants.js Created WatchCourse page Made courseCard open WatchCourse page with respective course video Made navbar show go back and finish lesson on button if the user is on WatchCourse page Designed a banner for the course page I changed the data of beginnerCourse and intermediateCourse in constants.js file which instantly made the cards inside both beginner and intermediate so much better. The professionalCourse data hasn’t changed and will be changed later. ~ After that I worked on one of the main feature of the website which is being able to watch the course. Now, if user clicks on a course that they want to watch, then will be redirected to WatchCourse page. I achieved by using the YouTube embed link and dynamic routing. ~ The navbar also changes in WatchCourse page as there will be go back and finish lesson button. The go back button currently works but I still have to work on the finish lesson button. ~ I took a break from coding after doing that and started working on the banner. I don’t really know how the banner should look so I just added a gradient, two chess pieces, some text and some chess analysis moves and called it a day. ~ Now I’ll go export that banner and add it to my website. If you have any recommendations please let me know. Biee..
Now the completed course has a green tick mark Basically now if you click on finish lesson you’ll be redirected back to the course page and the lesson you choose as completed will have a green tick mark inside the course card. ~ Also, if a lesson is completed the navbar won’t show the finish lesson button. ~ Right now, the data doesn’t persist across reloads. I will store the data in localStorage next and when I implement the backend, then only I’ll store the data in database. ~ The challenging part was seeing the whole picture. How will the feature work, where will the data live and how to know if a lesson is completed, things like that. ~ Also, during development I thought of using useContext hook but I had forgot how to use the hook while following best practices so I just went to my previous project to relearn stuff😅😆. ~ I decided to use pen and paper for problem solving and better visualization which worked really great for me 🎉🎉. I will definitely do this when I encounter problems in the future 😄. ~ Btw, No bullet points this time😅. I haven’t completed much as I’m sick. Hopefully I get well tomorrow🤞.
Many small improvements Changes Made the opened cards remain open after finishing a lesson or going back from watch course Saved completed course data in localStorage Added confetti animation after clicking on finish lesson Fixed value of total in course.jsx by making it dynamic Fixed navbar animating when reloading on non home paths This time I have done many small changes but I think that they make a great impact on the website. ~ Firstly I made the card remain open while visiting other pages. I mainly did this as a part of user experience. I thought that it’s inconvenient for a user to see the card they opened being closed after they come back from the course watching page. ~ Also, now the data of completed course persists. It is stored in localStorage. I’ll definitely stored the data in database in the future. Also I was facing an annoying bug doing this because I forgot that I needed to stringify the data before storing in localStorage😭. ~ There’s now confetti animation after clicking finish lesson. I think it looks nice. I used a npm package for the animation. ~ Before the total course was a dummy value of 10. Instead of counting the courses manually I just did a sum of length of all courses data from constant.js. Now, when I change the professional course value I won’t have to think about changing the total value. ~ The navbar animation was meant to run only when user move from home page to other page and vise versa. But, when I was on the course page and if I reloaded the animation would still happen. Fixing this was really painful as the solution was really easy but I just couldn’t figure it out. At last I took the help of Claude to figure out the solution 😩. ~ I took two days off because I was sick again😭. Why is my immune system so weakkk😭..
50 hours!! Let’s go 🎉 Changes Designed signup page and login page Created signup page and login page Divided the codebase into frontend and backend Setup backend Setup signup endpoint to receive formData Designing the signup and long page was really fun. I took some inspirations from pinterest. I’m proud of the design I made 😄. Turning the design into code was also fun ig. I did face a small bug. The image looked bigger than the form but both had flex-grow of one. The fix was simple I just had to change the flex-basis to 0 so I did flex: 1. Finally I’ve started on the backend. It’s been some time since I haven’t done backend stuff. Coming back to backend felt nice. Although it was frustrating when the data sent to backend was just saying it was undefined. But after some time I just figured out that I forgot add express.json() middleware in my server.js. I’m well now and feel that now I’ve no motive of slowing now. Hope you’re also doing well 🤞.
More progress on signup and login Changes: Designed the username form Created the username form in signup Changed useRef to useState to store signup data Adjusted the backend to receive and store username Add login functionality Fixed required attribute not working in both signup and login form Designing the username form wasn’t that hard as it’s just the signup page but will less things. I looked at how chess.com was doing things during signup and thought it’s better to split the email and password into one form and username form into another. There’s also a back button to go to the email and password form. Coding the username form was a little frustrating as I had some issue positioning the back button. Now it’s working but now I am facing the old issue of img-container and form container not being the same width. I’ll fix that next. Also the way username form is display is by just toggling a state into true or false in the singup page. After adding the username form there was an error telling that email and password was null. This was because while entering the username I wouldn’t be able to access the email and password input using the useRef hook. The fix was simple, I just changed the useRef into useState and store the data on input change. Now that was extra data (username) that needed to be stored. I sent the username along with email and password to the backend and changed the userSchema to accept username. I worked on the signup functionality last time so this time I worked on the login functionality. In short, now during login the backend verifies the email and password and gives the user a jsonwebtoken as a cookie or an error. I wanted the input to display “field is required” when user tries to login or signup without filling in the form. I just couldn’t get this working and it was so frustrating because the issue was so simple. Later I found out that I was using e.preventDefault on the button instead of the form causing the input to not show “field is required” Okay enough yapping. Gotta go and work on the project. Hope your project is going smoothly. Bie…👋
I’m sorry 😭 ##Changes: Use localStorage to store jwt instead of cookies Fix signup page unequal width of img and form container Changed login.css similar to signup.css for consistent code Added login as guest functionality Added navigation to /course after signup or login success Added UserContext.jsx to handle user data Added protectRoute middleware to verify jwt Added “/api/user/“ endpoint to get user data from backend Too many changes, let’s break them down. I’m sorry that I switched to localStorage to store jwt instead of cookies 😭. The cookie wasn’t working as expected. I was able to store the jwt in the cookie and receive it in the frontend but when I reloaded the cookie would just disappear. I know that there’s a fix for this as I have done this before as well. But, I know that I’ll face the same issue during deployment even if I fix the issue now. I’ll probably deploy this in vercel and last time (in flavortown) I had to change the whole code format due to the cookie issue. So this time I’ll just rely on localStorage for now. If I deploy the website myself then maybe I’ll consider using the cookie. But for now just forgive me 🙏. I fixed the unequal width of img container and form container with again in signup page. This happened because I added padding to the form-container instead of the form. Using flex for this was a headache so I used grid and it worked. Although I didn’t necessarily needed to change the login page css. I did it to maintain a consistent codebase. This is a huge one. I added login as guest functionality. I know that people will be skeptical of entering their email even though they can use any made up email such as [email protected] . I purely added this feature so that people don’t rate me bad just because they assumed that they need their own email to signup. And logging in as guest is easier as well so why not. Now, after the signup, login or login as guest is successful then we’ll be redirected to the course page. Later I’ll make it so that users who aren’t logged in won’t be able to access any other path except for the “/“. Also now there’s userContext.jsx for storing and distributing user data. For now there’s getUser function for getting user’s data. I have made the backend work to verify the user’s token and then only provide the user with their data. Alright no more yapping, the devlog has gotten very long. If anyone has read this devlog, God bless them. ~ Peace ✌️.
Life is frustrating 😩 ##Changes: Added navigation to /course after successful login Designed navbar when user is logged in Added the user button in navbar when user is logged in Added redirection to signup if user goes to /course without authentication Fixed jwt malformed error in protectRoute.js The navigation to /course after successful was implemented before but I somehow missed to implement that in login page. Designing the navbar for authenticated user was very challenging than I expected. As you can see in the image there are multiple attempts at creating the navbar. Everything I tried was just looking bad. The final design is also questionable. But for now it is what it is. Now unauthenticated user aren’t allowed to visit course page. They will be redirected to signup page if they try. This was supposed to be simple but somehow I made this also hard for myself. I have done this before so this should have been easy for me but nope. The redirecting was working fine but I were to be authenticated and be on course page and then reload, then also I would be redirected to the signup page. After I made up my own solution for this which I don’t think is the best way to do it. Due to my incapability of designing simple things and solving minor bugs I was questioning my ability to solve problems and design. Which at that moment felt sad 😔. Also there was jwt malformed error popping up in the backend which was also frustrating to solve. Not because it was hard but because it was easy and I wasn’t able to solve it. I won’t tell you what happened here as the devlog is getting long. No video this time cuz the I can’t show the navigation changes working as they aren’t working properly. The bug is preventing user from redirecting to /course after login or signup. Instead user is redirected to signup. I know that this because of the two redirection changes made in this devlog. So, I’ll go and fix it asap. Hope your coding experience isn’t going as frustrating as mine. Thank you for reading my frustrations. Bye…👋
Omg it’s finally fixed I finally fixed the bug that I addressed in my last devlog. This was so frustrating. I never expected that this would take me 2hrs and I would write a whole devlog on it 💔. The bug was that when I was logging in I was being redirected to /signup after signup, login or login as guest. I had made so that after signing up or logging in the user would be redirected to course page. I had also made it so that if the user value is null then the user would be redirected to the sign of page. So now you can see that where this is going. I just couldn’t simply figure out why the user value was null. After doing so much thinking and reading the code and trying to fix the bug, I have finally succeeded.Another issue that I was facing during the working was I was constantly forgetting what I was doing and to see everything visually I used excalidraw as you can see in the picture. So there were three things that was leading to this bug. Firstly, I wasn’t using the await keyword while calling the api functions. Secondly, I didn’t have a loading state while fetching the user’s data. Lastly, the function getUser function responsible for fetching the user data wasn’t even being called when redirected to course page. The function was only being called when the user first loaded the website. Right now, my head is aching now I think I should take some rest. I didn’t remember to add loading state which was so silly of me. I only realized that after visiting my old project. Seeing that I felt dumb because ofc you would need a loading state while fetching the user data from backend. I feel a little relieved now 😮💨. I cannot even remember properly all the things that I tried to solve this. It was just a mess 😩. After solving the bug, now looking back, it wasn’t that difficult to solve. It was just a me problem. I could write more on this but I’m too tired for this now. Okay biee..👋
Wth it’s been 5hrs?? Added toast for login signup and login as guest errors Made the signup data persist even after the value of hasContinued changes Designed the dropdown menu Added dropdown menu Added logout functionality First of all, I’m genuinly confused how this took me 5hrs.. Added toast so that now when there’s any error during the signup or login. For example during signup maybe a user might write a username less than two characters, then the toast pops up telling the user it should be greater than 2 characters. I was stuck during this cuz the trycatch block wasn’t catching the error which was confusing. I used axios previously and it threw an error if the backend response wasn’t ok. But this time I avoided using axios for reasons that you guys probably know 💀. It seems that fetch didn’t throw any error so I had to manually throw errors in the api functions. The making of signup data persist on hasContinued value change was early. I just set the value attribute of input to be it’s respective useState data. As you can see in the image that I designed the dropdown. I first designed the dark one which I really loved but it didn’t match the navbar so I created a light one. After seeing the dark one I really didn’t like the light one. So I tried fixing the design. I asked someone in the slack and they said the previous light dropdown design looked fine. Ig looking at the dropdown for long made it look fine to me as well 😂. Now I added the dropdown to the website. I had issue with the padding of the logout button during designing phase but I just winged it during coding phase and it worked 🎉. The dropdown now looks fine imo. I however did have a issue while making the dropdown closing work when user clicked outside of the dropdown. I thought of using an overlay in the background but I knew that there was a way of doing this by checking the click event. It seems I had forgetten to do this. After some trial and errors I remember how it was done.. I also added logout functionality which was fairly easy to add cuz I’m storing the jwt in the localStorage. I just removed the token for localStorage, set the user to null, set isDropdownOpen to false and navigated the user to the home page. Ig, i’ll try do things faster next time ⚡️. Don’t want to spend 5hrs on things like these. Okay biee…
When will my devlog get more than 7 views 😭 Changes: Added loading component Added scrollsmoother in home page Fixed course page padding and added toast while redirecting unauthenticated user Added back button to signup and login page Designed the logo for website Added the logo to the website Now whenever the frontend fetches user data from the backend there will be a loading component that will come up. I made the loading spinner myself in figma why not 😃. Scrolling the home page using a mouse is so much better now now due to scrollsmoother plugin of gsap. I was facing a issue with this though. I was seeing an error while navigating to other pages. After a while I found out a guy with same issue in gsap forum and his solution worked. God bless that guy 🙌. Some small changes were fixing the padding in course page , adding a toast while redirecting unauthenticated user from couse page and adding back button in singup and login page. I think they don’t need much explanation. I tried to design the logo of my website in figma. I tried different things and landed with a design that felt decent (The logo with king in the center). I look nice up close but it didn’t feel the same when shrunk down as a logo. So I started designing another one. I landed on the logo with cyan and dark purple background and !! symbol up front. I really don’t know how I feel about this logo. I looks decent sometimes and other times questionable. Please leave your opinion in the comments 🙏. While adding the icon as a favicon, for some reason the favicon wasn’t display which was confusing. Later I found out that this was a brave issue cuz it’s showing up in zen browser. Okay this much for now. Please like so that more people see this devlog 😭.
We have followers Changes Designed hollow medals Switched from localStorage to db for storing updating and retrieving completed courses data Added feature to show medals achieved by user Designing the hollow medals (I don’t know what to call that so I’ll just say hollow medal) was really fun. I just started designing the medal for fun in Figma. The result turned out really great even better than what I had expected. I was using circles for the medal itself and was trying to use the rectangles for the below design. Later I figured that it would be wiser to use the pencil instead of creating a rectangle and mapping out the bottom portion of the medal which turned out to be a great idea. In this project, I have started using Figma for creation of some assets and I am loving it so far my intention is to keep on using Figma until and unless I really have to use AI. Switching from localStorage to database for completed courses data was easy in my head but it took me longer than expected mainly because of three reasons. Firstly, I was thinking of creating a separate backend endpoint for course data. After creating the controller and route for course data I thought that it isn’t really necessary to create another endpoint for this as we can store it in the users data itself. Secondly, after deleting the routes and controller, I created API function for fetching and updating the completed course data period I had forgotten that I don’t actually need to have a separate getCompleted function because while fetching the user itself, the data comes with it. I have forgotten to delete the getCompleted.js file which I will do later. Thirdly, I have started to use Postman for testing out api . I am loving to learn things such as Postman and Figma. But this issue I was facing was the postman was working correctly but from my codebase the request body was showing undefined. It was a fetch thing I use axios before and I am figuring out right now why people used axios. It seems that I needed to specify in the header that this request had the content of json. So figuring that out also took some time. Also, I have added the feature to show medals achieved by user. The code isn’t quite clean for this feature. Thanks to the people that followed this project. I genuinely appreciate that 💖. New followers : @PAPER_01 @sak
Started working on the vision page Changes Designed the vison page Created the vison page and worked on the sidebar ui I have changed the name from visualisation to a vision. I actually don’t know which one is better. I just changed because chess.com and chesskid.com had vision for practicing the squares on the board. Designing of the vision section was quite fun although I had some issues with auto layout that wasn’t big of a deal. I was thinking what options should I have and thought it would be best to add show coordinates, change the color and select the time. I think the UI turned out pretty great. I will probably change the colour of the chessboard but black and white also looks fine. Coding design wasn’t too difficult. It was just copying the design that I made, but the Figma design looks different. I should check out why the size of the buttons are the same but in Figma they look a lot bigger. It might be because the width of the sidebar is not the same. In conclusion, this was a peaceful devlog. It feels really nice not having to fight with your code and your designs. Hope that the future develops are the same 🤞. Until then peace✌️.
Things are going great Changes: Added chessboard component with ranks and colored squares Added function for generating random squares and displayed them Added feature to display green and req squares to indicate whether the user clicked correctly or incorrectly in the chessboard Displayed attempt made by user in the sidebar with respective colors for correct and incorrect ones I thought doing all of these took me at least four hours but I was wrong. It seems that it’s only been about like three hours. This time I have worked on the chessboard itself on the vision page. Before it was just a plain whiteboard but now there are individual squares which was pretty easy to implement. I however needed some time to figure out how to add colours to the squares. But it also wasn’t that difficult. Then I created a function for generating random squares with the help of math.random(). I created an absolute element to display the random squares at the centre of the chessboard. To indicate the user that the square they have clicked is correct or incorrect I played the small animation that changed the colour of the user clicked square into red or green depending upon whether the user input was correct or incorrect. I was stuck here because I didn’t know how to reverse the animation. Of course I could just change the colour to green and then the colour of the square but that didn’t look quite right as I am probably going to change the chessboard colour later. So I wanted the animation to be flexible I was trying to play and reverse a animation timeline but it was so much easier than that later. I just remember there was the repeat and yo-yo property that will easily accomplish this effect I’m looking for. I have found a new bug with this if I spam click a square the square permanently turns into either red or green so definitely I will fix that in the next devlog. Also now the squares that the user clicks will be displayed on the side bar. The colour of this square notation will be red or green depending upon the user selected the square correctly or incorrectly. I have found out that there’s a flex related css bug in attempts element. I will look into that tomorrow. Okay bie.. Hope you have a great day 💖
Ayy almost 5 hrs today !! Changes: Fixed attempt square and attempts not wrapping as expected Fixed color being stuck in chessboard when same square is clicked rapidly Added color menu popup when click color button in sidebar Added time menu popup when user clicks time button in sidebar Added Progress component in sidebar with working score Made timer in progress.jsx functional Fixing the user attempts in the was pretty easy. I just added a attempts container to wrap the attempts element and then the CSS work as expected. Fixing the red or green colour being stuck in chessboard when clicked rapidly was a headache to fix. I was trying my best and at last I came up to the decision that I needed a timeline for the animation before the animation was played the progress of the animation should be zero. I tried that and obviously that didn’t work but it seems that I was close to the answer. I used Claude to figure out the answer and Claude used killTweenOf gsap function to remove the animation before the animation was even played. It also added a onInterrupt property to the animation which basically reverted the stuck colour after killing the animation. I didn’t want to use Claude, but I just couldn’t figure it out and I think it was better to use Claude as I have never used those functions and properties of gsap. Also Claude made that portion of my much cleaner. Seeing this now, I will be more focused on the cleanliness of the code because claude showed me that my code was repetitive and how it could be made smaller and easy readable. I decided to make the colour menu pop-up and time menu pop-up straight by coding instead of designing it first as I should have. As you can see, the result is very terrible. I am sure definitely fixing it in the next devlog. I was force thinking of making a pop-up menu component and using them in both buttons but I found that it was a hassle and not worth it. Only the white and black button in colour pop-up menu work. They just rotate the board and that’s all I still need to add functionality to them. After learning the lesson that I should definitely design before coding. I started designing the progress component. Although there isn’t much to design there I definitely would have made it as bad as the pop-up menus. While coding this, I also made the score display the total number of correct at attempts which was pretty easy. I just had to add one digit whenever the chose the correct square. Then, I started working on the timer. The timer would have been really easy if I just used setTimeout every second but I like to torture myself so instead of just doing that, I challenged myself using date constructor. I have done this before but it has been sometime and I remember how it worked. The countdown started from 28 which was frustrating. Now, I have just completed that but the code is really messy. I will definitely fix that tomorrow or today as I might post this devlog tomorrow. I think that shorter devlogs do better in terms of views. I’ll try that next time. See you in the next devlog 👋.
Mostly cleaning up the code and breaking things Changes: Made timer code better and cleaner Added functionality to timeMenu options Added countdown before starting the timer and displaying the squares -Added VisionContext.jsx to make code cleander and broke down vision page into smaller components As I said in the previous dialogue, the timer code was messy. So I decided to clean the code now it looks much better. Also now the time button options work now the timer will have 15, 30 or 45 seconds according to what you choose. So before, after cleaning on start the timer would start right away and the square would also show up. But this might make the user frustrated as they have to click start and right away move their mouse to the chessboard. I saw that chess.com has a countdown timer so I also made one. The code for this countdown timer is also messy so I will probably make it more cleaner next time. This is the main thing I have doing this whole devlog which I cannot show you because it’s just making the code cleaner. The vision pays had a chessboard component and then sidebar element to it. The sidebar element had all the code which was making the vision page could a lot messy. So I have broken down components into components and those components in the further components. I think this is making the code much more easy to read and find and debug each component more easily. But in the process of cleaning my messy code, things have broken down. The timer isn’t working, I will fix that later. I don’t have much to show here today so the see the countdown timer working and the broken timer 😝. I will fix everything in the next devlog. So stay tuned. Bieee…
We’ve reach 100 hours 🎉 Changes: Fixed timer not displaying in sidebar Removed the square display after time is over Fixed timer setInterval running multiple times and made countdown timer code cleaner Fix TimeMenu not closing Removed unused imports Designed the sidebar to add new data Added the new design Added animation to make the square notation that appears on the chessboard disappear First of all, we have reached 100 hours let’s goooooo. I would like to thank everybody who have followed my project read, liked or commented on my devlogs . My project has recently started getting some traction. Special thanks to @PAPER_01 💖. I have done a lot of things this devlog. I will try to cover these in as short as possible. It seems that the setInterval in progress.jsx was running twice. I found out this while I was making the countdown timer code cleaner. So to fix that I reset the hasCountdownCompleted as soon as the timer in progress.jsx runs out. Now, countdown and progress timer work as intended with cleaner code. The random color option in color menu now works. It was a little tricky making that work. Let’s just say it wasn’t working as expected but the fix wasn’t that hard. I liked what chess.com were doing. They were displaying the square notation and then the square notation would just disappear. The square rotation will also live in the sidebar so that if user forgets what the square was just displayed, they can easily look at the sidebar. I really like this idea and decided to implement on my project as well. But before I added this to the website, I first designed it on Figma. I also thought of displaying the score and best score on sidebar. Designing it was fun and tricky. I didn’t really like how the previous score and best score were looking and after some trial and error it looked okay. All of these things were fine and enjoyable to do but making the best score work was so frustratingggggg. It’s the reason that I couldn’t devlog yesterday. The issue was score was showing to be zero inside updateTimer function even though the score was greater than zero everywhere else. I thought fixing it wouldn’t be really hard. I tried console log score everywhere to see when the value was being zero but there was no sign of the score turn into zero. Later I found out that due to the updateTimer function being inside a setInterval the value is kind of locked and used useRef hook to solve the issue. Okay, that’s all for this devlog. Now that I have reached 100 hours let’s aim for 150 hours as soon as possible. I have taken very long to write this devlog so I like would be heavily appreciated 😄.
You’ve my coordinates now Updates: Added coordinates to chessboard Changed previous to current Fixed user input on chessboard being checked before countdown finished The show coordinates now works Fixed some event bubbling issues in colorMenu and timeMenu Designing the pop up menus Now it’s easier to locate squares with the help of coordinates . Now you will also notice the board has fliped while changing colors. ~ A small change, in the sidebar the previous word has been replace with current. I think the current word makes more sense there. ~ I also fixed user being able to click on the squared before the countdown finished. This was a silly mistake from me. ~ The coordinates has made it easier to locate squares. But if you want some challenge then you can toggle show coordinates off now. ~ That’s all for this devlog. If you wan’t my actual coordinates dm me 😄.
Moving onto something big (I’m scared) Updates: Change ui of popup menus in options.jsx Added sounds for correct and incorrect attempt in chessboard Added countdown and start sound in chessboard.jsx Added puzzles page Renamed sidebar of vision page and it’s component with prefix of vision. Most of the updates in this devlog are small changes. But now I am going on to work on the puzzles page. I don’t know how I will figure this out. I hope it goes mostly smoothly.. I had designed the popup menus in the last devlog. I think the newer design is much better than the last one. The popup menus don’t look the same in the figma and the website cuz I tweak some things while coding. The figma design was a rough design Adding the sounds in the vision page has made praticing much more fun. The built in mac recorder doesn’t record sound unfortunately or I just don’t how to.. So, I’ll add a ss of vision page with menu open and a ss of puzzles page. I added chessboard and sidebar to vision page. There were two sidebars now so I decided to rename vision page sidebar to VisionSidebar and puzzles pages sidebar to PuzzlesSidebar. Okay that was all for this time. Give me strength to start making the puzzle by liking and commentin on the devlog. Byee ♥️. Also if you’re reading this support @PAPER_01 . AniShuffle has been taken down but she’s been unbanned now 💖.
The pieces have been placed. I was so sloppy 😭 I’ve added pieces to the chessboard. I’ve finally started facing my fear and started working on the puzzles section. It seems that creating the chessboard for puzzles will be harder than I have anticipated. Also please don’t mind the black pieces blending in with the background. I didn’t find chess piece set I liked so I downloaded the lichess chess piece set from pinterest. I was trying to crop them in figma and I coundn’t crop them properly. Also it was a tedious job. After downloading two crop pieces from figma I again went to the web to find out if someone already made them. This website came in clutch (greenchess.net). They had the whole chess pieces set of lichess available for download. Then, I started to code with no plan in mind . I don’t know why do I do this to myself. Obviously it was a bad decision. So I decided to use pen and paper to mainly solve one thing and that was how to place the pieces on the board. The writing helped me alot to think better. I was so sloppy while coding. I was mostly outside while coding and I was really distracted. One sec I was coding and another sec I was thinking about something else. I was making so many silly mistakes making the process more frustrating that it already was. I learned about fen while doing this (Forsyth-Edwards Notation). Through this any chess position can be stored and recreated in one line. It looks like this rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1 I only needed to loop over the first part divided by slashes for positioning the pieces. Other things will be used later. I feel the code is really poorly written but it works so idk. I also found out about regex while I was trying to write a if condition for seperating strings and string with numbers. Okay this much for today. Bie….
I got sick 🤧🥀 Updates: Make pieces position perfectly to square in chessboard Moved chessboard states and refs to ChessboardContext.jsx Fixed pieces sometimes being group together in one square when chessboard offsetWidth is null Added destSquare element on click for all possible moves of rook Last time I did position the squares but when I changed the background color of pieces there was a slight misalignment. I started searching what was causing that to happen. It was due to the height and width of chessboard being in decimals. I checked to see what lichess were doing and found out the height and width of the chessboard were always divisible by four. I did the same for my website and now it’s perfectly aligned and that’s what I love to see. Moved the states and refs from chessboard.jsx to chessboardContext.jsx to make the chessboard code less cluttered. The code relevent to puzzles page is in the chessboardContext while the code revelent to vision page is still in the chessboard page. When the page was loaded for the first time the pieces were being group together at the top left square. It was being fixed automically when the page was reloaded. It also happened while navagating from home page. I found out this was happenning due to chessboardWidth being null at start. To fix this I created a useState for the chessboardWidth so the page rerendered after the value was changed. My goal today was to make the rook move but I could only work up to generating the destSquares when the piece is clicked. I achieved this by creating a useState array and if user now clicks on the rook it calculates all the possible squares that the rook can move to and then that array is mapped using math to place destSquares perfectly on top of squares. The destSquares have a dot insided them which will be replaced by a icon but that’s the reason they’re not aligned centered currently. I did have a hard time doing this. Let’s not talk about it. 😭 I’ve written everything in short so that I don’t hit the 4000 characters limit and also ig it’s better for people reading (if any 🥀). I got sick yesterday and was just able to work on my project for 1 hr. Today I thought didn’t work much but it seems today I did 3 and half hrs. I am happy about today. I really don’t know if I can create the puzzle but I’ll try my best to do so. Everything I try to do seems to come with their own set of challenges and take time to overcome those challenges. Let’s see what happens 😔
The rook got some moves 💃 Updates: Added movement to piece when destSquare is clicked Added mode state for seperation of chessboard in puzzles and vision page Moved states, refs, effects and functions from Chessboard.jsx to VisionContext.jsx Working on handling vision page data if user switches to other page during vision practice Finally I can proudly say that the rook can move now. I am really happy that it’s working. To move the rook I had created destSquares(the square with green dots) last time. Now if the user clicks on any of the destSquare with some maths the rook move to that square. I’ve added transition for the movement to look smooth. While doing this the rook did move to the destSquare but when clicked on the rook again the destSquare appered from when the rook was last time. To fix this I grabbed the destSquare location (e4) then set the squareid of piece to the location. The destSquares were calculated based on the squareid so now after moving the rook I can move it again. Also now if the a piece is seleced the background color of the pieces changes. When a piece is selected then destSquares appear but if the piece is selected again or other square is clicked then the destSquares are removed. Small things like this is making the chessboard feel lively and feel that it works correctly. I wanted to do this before but I thought I’ll do it later. I added a mode state in Chessboard.jsx. The mode state is either “puzzles” or “vision” representing the page the chessboard is on. I have made the pieces not appear while I’m in vision page and am trying to make sure nothing is running behind the scences if user decides to move to another page after they click on start. The countdown timer code of vision page was in Chessboard.jsx. I didn’t like that so I decided to move the code to VisionContext.jsx with the timer I move some states , refs and function with it. I had some issues during this migration but it wasn’t too difficult to resolve. I thought I had worked more but seems like I’ve. I’m confused, when I think I have done little work at that time I some how end up will better hours and when I think I have done decent amount of work I end up with less hours. Anyways it feels good watching the rook moves are working correctly. This much for this devlog. Peace ✌️
More pieces can move (I’m sick again 😭) Updates: Added functionality to handle vision page if user changes page during vision practice Added functionality of moving bishop and seperate calculation of rook moves Added functionality of moving queen Added functionality of moving king I told in the last devlog that I was working on hanling vision page if user changed page during vision practice. And now, it’s done. I think I have reset the necessary things so that vision page works normal. If any bug related to this appear in the future then I’ll fix it then. Right now everything looks fine after adding this functionality. Creating destination squares for rook was easy and I thought bishop would also be probably easy. I was very wrong. The thing with rook is that there will always be equal number of destination squares but bishop doesn’t. I bishop’s destination squares varies according to it’s position. I took a long time to figure things out in pen and paper. I even wrote the whole chessboard notation in paper and looked at only one diagonal first to find some sequence ( I’ve attached the img below 😆). I started coding after kind of figuring out where to start. I had issues during coding as well but we got it boys. Also I was using OR instead of AND in the while loop causing bugs and I needed some time to digest that AND definetely worked there. A silly mistake from my side. For the queen I didn’t have to code much as I wrapped the rook and bishop destination squares code in to a function. Then, I created a new function for creating destination squares of queen which just called both the rook and bishop function. As this was really easy I was pumped to move on creating king’s destination squares as it is also really easy. Took a sip of coffee and continued my coding journey. I was wrong 🥀. I got stuck adding the king’s destination squares. I was first thinking of combination of rook and bishop but only one out from every side. This was the wrong way of thinking ig. Then I thought I should use two nested for loops for creating the destination squares which firstly worked out badly cuz I’m dumb. The destination squares we’re being created in such odd manner. After fixing that I had to also remove the destination square which was being created on top of the king and also had to handle to not generate some destination squares when the rook is on the edges of the board. I have done nothing today due to my illness. I hate my immune system 😭. I’ll code for 5 mins now ig for keeping my streak alive. Okay biee..
30 day streak let’s goo 🔥 Updates: Added functionality of moving pawn with seperation destination square for white and black Added functionality of moving knight Changed color of chessboard Made rook not able to pass through pieces The pawns now move one square at a time and have the option to move two squares if they’re on starting squares. Moving pawn one square is easy but I had to think about creating two destination squares infront of the pawn. So I created a array and push all the starting squares of the pawn and if the pawn is on one of the starting squares then two destination squares are created. It’s also seperate for black pawn and white pawn so that white pawn doesn’t get two destination squares when it’s on the black pawn’s starting squares. I forgot the knight also needed to move lol 😆. Just remembered in time after finishing the pawn. The knight was tricky to move. As always I used the mighty pen and paper first before coding. Creating the knight took some time due to random bugs here and there. I think I need to revisit the knight code later as it’s very messy. Yay, now the back pieces don’t disapper on the dark squares as I have changed the chessboard light and dark square colors. I think the new colors look great. I was lazy to test out colors so I went to chess.com and picked colors from one of their themes. Okay now were moving to the next step. Making the pieces not be able to move through pieces. I started with the rook. The plan was simple. Check for any piece with squareid that’s same of the destination square and if true stop the loop. I couldn’t figure out how to even select the piece. I was frustrated as I need to select the specific piece with the squareid attribute. I found out about ReactDOM.findDOMNode but I couldn’t figure out how to work with it. I felt really frustrated at that time. I was thinking of using document object but I know that is a bad practice in react. It seems I forgot that we can use querySelector in refs. I already had the chessboardRef so I used querySelector to find if a piece was on the way of the rook. Also I had to change the way I calculated the rook’s destination squares but let’s not talk about that I think the devlog has gotten pretty long. Although the problems are hard for me to solve when I see the results working I genuinely feel happy. I have gotten lazy after getting sick. Although I have not fully recovered yet I’ll try to stop wasting my time. Okay this much for now biee….
Mostly cleaning up my messy code 🧹 Updates: Made bishop not able to pass through pieces Made the code creating rook destination squares much cleaner Made the code creating bishop destination squares much cleaner Fixed rook and bishop not creating destination sqaures at the edges of the board Made code for creating knight destination squares cleaner and fix if statement condition of rook in ChessboardContext.jsx Made code for creating pawn destination squares cleaner and make pawn unable to pass through pieces Fixed bug while clicking on a piece when another piece is already selected In last devlog I made the rook unable to pass through pieces so it was very logical to do the same to bishop. Making the bishop unable to pass through pieces was pretty simple as the code wasn’t much different from the rook one. Idk what clicked in me after doing that I started to thinking about making the rook destionation squares creation code cleaner. The code was very messy and repitetive and I believed it can made cleaner and smaller. I used 4 while loops before which had almost the same code but different values and slightly different calculations. After thinking and trying I turned the 4 while loops in to a single while loop. Now the code looks much better. Seeing the success in rook destination squares creation code I then moved on to the bishop’s code. Made similar changes to the code as the rook’s code. Also i believe the queen works perfectly as it’s mixture of rook and bishop code but I haven’t really tested it on board. After cleaning up both rook and bishop I found a small bug. The bug appeared because of my slight mistake while trying to make the code better. Basically the rooke and bishop weren’t creating any destination square at the edges of the board. The fix was simple so this didn’t take long to fix. I already didn’t like the knight’s destination squares creation code. Me cleaning up the rook and bishop code gave me the motivation to make the knights code better. It did take some time for me for cleaning up that messy and tangled code. I was using break keyword for rook and bishop so I also used break for stopping the loop but I didn’t want the loop to stop completely I just needed to skip the loop if there way a piece or if the knight was on the edge of the board. After a quick search I found that continue keyword does the job. The pawn code wasn’t that messy but it could definetely do better. I mainly changed the pawn’s code cuz I wanted the pawn to also be unable to pass through pieces. Before there were two loops now I one loop does the job. Then I also made the pawn unable to pass through pieces by breaking the loop. Fixed the annoying bug. If a piece is clicked when another piece is already selected then it looks like both pieces are selected. Desitnation of both pieces are shown and both pieces are hightlighted. So, as clicking on a square reset the selected piece, I reset the previous piece if user selected another piece with a small change. Now I’m trying to making all these things work from the black side as well. Okay this much for this devlog. See you on the next one. Biee…👋
Gobble up pieces Updates: Rotated piece img when color is black and made user unable to select opponent’s piece Added functionality of capturing pieces with rook Added functionality of capturing pieces to bishop, king and knight Added functionality of capturing pieces with pawn My goal was to make the board work from both sides. I was ready for this goal to be challenging. I was messing with squareid and position of pieces by checking the color of the board. But it seems don’t have to do much for things to work. Before, I have already made the board rotate using css. I was rotating the pieces when color was black and that was causing issue. Instead of rotating the piece I simply rotated the img inside the piece. Till now every is working as expected. Also I made user unable to select the opposite colored piece. Now we can capture pieces . If a piece can be captured, the piece will have four triangles at the corners. This is inspired from lichess as I didn’t really like the circle of chess.com. I made the triangles myself using figma. Also I created the dot in figma to change it’s color. Previously the dots were green. It took me some time to pick the colors of triangle and dot cuz I didn’t wanted their colors to ruin the feel of the chessboard. This works by firstly determining if the piece in the way of destination squares is our piece or the opponents. If it’s our piece then destination squares will instantly stop generating but if it’s the opponent’s piece the we first add the sqaure position to capuredSquares array and then stop generating the destination squares. While doing this I learnt about the remove method which allow me to remove the captured piece element from the board. It took time for figuring out how capture pieces with rook. After that it was really easy for me to do the same with other pieces as well except for the pawn. The pawn isn’t the same as other pieces. It moves vertically and captures diagonally. So I had to write code differently for the pawn. I code for the pawn does seem a little messy but i think it’s fine. I would say it wasn’t too difficult to make the pawn capture pieces. I did have to think about making the capturing functionality work for both white and black pawns. This much for this devlog. I am being quite lazy nowadays. Time to grind and lock back in. Hit me up if you also want to grind along with me.
I’m dissapointed in myself Updates: Fixed pawn unable to show two capture squares at once Added function to move opponent’s piece automatically Set fen according to puzzleLevel Moved opponent piece after the pieces have been placed and remove css transition into gsap animation while moving pieces Last time I added functionality to pawn to be able to capture pieces. It worked fine I there was only one piece diagonal to the pawn. I there were two pieces diagonally infront of the pawn only one capture square would appear. Now two capture squares appear if there are two pieces in front of the pawn diagonally. Fixing this was simple. Created the function to move the opponent’s piece automatically. In puzzles the user only moves their piece, the opponent’s piece moves automatically after user plays their move. This was the most frustrating thing I worked on today. I thought the function worked correctly but I was wrong. I’ll tell you in a sec. I added 3 fens with moves from lichess puzzles data in constants.js . Then I made the default fen data to null and made it so that the fen is selected according to the level of the puzzle. I think I was trying to add loading state for this. It was very poor thinking from me. I was just being very ambious and instead of trying to do things step by step I was trying to multiple things at this time. I don’t remember exactly what changes I tried to make ig I was trying to fix the moveOppenentPiece function as well at this time. I undid some of those changes, left others as it was and fixed the fen and commited that. I was already frustrated at that point and then when I tried fixing the moveOpponentPiece function the constant errors and bugs worsened my frustration. I don’t want to explain that part. Just know that after fighting with my code it’s working now. Also before I had css transition for trasform property. Meaning that whenever the pieces moved it moved smoothly. But when the chessboard is first rendered all the pieces also animate to their places. I fixed this by removing the transition css and using gsap to move the pieces. Now the first opponent move happens automatically. This was also frustrating to make it working. Basically today was frustrating. I thought I coded longer but seems like not. But anyway, when you’re at the bottom the only was is going up. Saying that I will stop writing this devlog. I feel I could have written an essay today. Okay bie…
Taking a BIG decision Updates: Fixed pieces creating only single capture square Added redirection to signup page in puzzle and vision page if user isn’t logged in Made user unable to select piece when opponent’s piece is moving Connect oppenent’s move to puzzle data, Add check for user moves and Add functionality to make the opponent piece move automatically after user plays the correct move I fixed the pawn not being showing two capture squares last time. After that I found out that the capturing the piece wasn’t removing the piece from the board. I found out a function that I have commented out was being called and causing an error so I removed the function call for now. This was easy to fix but by doing this I found out that the pawn wasn’t the only one who wasn’t able to display mutliple capture squares. All the other pieces weren’t able to display multiple capture squares due to a simple rookie react mistake. The value of captureSquares was being updated with it’s own value instead of using the previous value. After sorting that out I figured i should do same with the destination squares. Previously had an array updatedDestinationSquares after pushing all the values to the array then only I updated the destinationSquares value. In short I was doing the correct thing and me thinking that I could save 2 lines of code by adding setDestinationSquares directly to the loop was a bad idea but the state function isn’t synchronous. So I undid all the changes and also added a updatedCaptureSquare to all functions just to be safe. Now user can’t select pieces when it’s the opponent’s turn. Although the timeframe to select piece is small but still I wanted to be safe. I achieved this with a state named isOpponentPieceMoving. it’s toggled on when user clicks on a destination square and toggles back off after the animation finishes. Next I tried to make the opponent piece move work through with the help of the lichess puzzle data. Before the opponent piece could only the first move to play. After connecting the moveOpponentPiece with puzzles data. I created a function to check whether the move made by user is correct or incorrect. This was also being checked with the data in constants.js file. The data is stored like this r3r1k1/p4ppp/2p2n2/1p6/3P1qb1/2NQR3/PPB2PP1/R1B3K1 w - - 5,e3g3 e8e1 g1h2 e1c1 a1c1 f4h6 h2g1 h6c1 The moves part start after the comma. First move is of opponent. It tells from which square to which square the piece is needs to be moved Eg(e3 to g3). The second move seperated by space is what the user need to play to move forward in the puzzle. So if the user’s move is correct then I move the opponent’s piece. But if it’s incorrect then I reset the board. I got lost in the reset part. I learned if the key of a element is changed the element kinda resets. When I started doing this I felt a little uneasy. I was figuring out the code I wrote was manipulating the dom which isn’t the best practice in react. Regardless, I added a fragment to the code that was generating the pieces with a key with the value of boardKey and updated the boardKey when the user’s move was incorrect. But in my mind a question was lingering "Should I redo this in the way how react wants it" . Seeing the functionality working I pushed off that question. But, when I captured a piece a error popped up. The ss is below. I tried to locate why was that error popping up. I’ve concluded that the bad code has started to show why it’s called bad code. Although I might find this solution to this issue I think it’s better for me to just rewrite the code. This is painful but it will make me a better developer. Also I found another bug, the error isn’t the only reason I’m making this decision. I’ll push the code upto what I’ve done right now and then I’ll start to fix what I’ve created.
Most rebuilding my broken code For context last devlog I took the decision to start rewriting the code to stop accessing dom directly by using states. Now the pieces are mapped from pieces state rather than directly from fen so that I can move the pieces from state instead of manipulating the dom. To achieve this I firstly created to convert the fen to pieces array. The pieces array looks something like this rn. [ {id: 'r-a8', pieceNotation: 'r', square: 'a8', coordOfFile: 0, coordOfRank: 0}, {id: 'r-e8', pieceNotation: 'r', square: 'e8', coordOfFile: 4, coordOfRank: 0} ] From this I learnt that setting the key attribute serves it’s own purpose in react. I don’t fully understand it rn but I’ll look into it. Now, the id of the piece serves as the key for the piece element and if I’ve understood correctly that will be vital in animating the piece moving. Yay the rook has been reestablished using react state without any dom manipulation. The reestablishment wasn’t too difficult as I thought due to the already existing code. All the changes now happen in the pieces state which then causes the react to repaint the pieces. Now the rook can move from one square to another and capture opponent’s pieces. Also I’ve made the reset squares function as it removes the destination squares, caputure squares, etc . Although there’s no animation during piece movement rn I’ll it add later. After making the rook work I stared making all other pieces work as they used to before. I thought I had to write most of the code to fix all the pieces but after finishing the rook other fix other pieces wasn’t that bad. I reused the code from the rook where I could, fixed some bugs and errors on the way and modified the code where necessary. Sometimes I got stuck due to my own stupidity but that’s nothing new 😆. The moveOpponentPiece function is rebuilt. Now the first opponent move will happen when the board is first loaded. While fixing this function I found out that I was able to select the opponent’s piece as well. This shouldn’t be the case cuz I had already put railguards for preventing this. After fixing the moveOpponentPiece function I checked why this was happenning and the cause was I put railguards only if user click on another piece when a piece was already selected and that code was also wrong. I fixed them both and now they work as expected. Another bug found. When I clicked on the first pawn it only created one destination square instead of two. This was happening because the for loop had only 7 iterations instead of 8 which added the starting pawn squares to the array. Also the user’s pawn were able to capture the user’s pieces which was a big nono so I quickly fixed that. Even thought the moveOpponentPiece is working for the first move it instantly breaks from the second move. I still fully don’t understand why this is happening. I know it has something to do with using setState and it not being synchronous. The code looks like this let updatedPieces = pieces.map((piece) => { if (piece.square === position) { return { ...piece, square: destination }; } return piece; }); setPieces((prev) => { console.log("updated", updatedPieces);// I don't understand how this value return updatedPieces; // and this are have different values}); I’ve fixed it while writing this devlog removing updatedPieces variable and mapping the value directly inside setPieces(). Now, the second move works but the third move is broken 😭 . I’ll look into this tomorrow. I’ll wrap this up for today. Also I’m changing my devlog style a little bit. I’m not telling you all the problems I ran into like I did before to keep the devlogs a little short.
I am stuck Ayy the opponent moves work as expected now. In last devlog I wasn’t able to capture opponent’s page because I accidentally didn’t filter the pieces, only moved the piece. Now the capturing system also works as normal. While talking about capturing pieces now the opponent can also capture pieces. If any of the player’s piece is on the destination of opponent’s piece then it will be captured. The main lesson learned here is to mostly use the previous data while changing the state’s value to avoid unnecessary bugs. I’ve made the reset board function work. This was the point where I decided to rebuilt the code by removing the use dom manipulation and looking back I think it was a great decision by me. (Context: 2, 3 devlogs ago I found out my code was really trash while creating the reset board function). While writing reset board function I did run into some weird bugs. The board is reset by reconverting the fen to pieces array. The first opponent move happens when the opponentMoveIndex is 0 now. In the reset function the opponentMoveIndex is set to zero. I’ll add a animation to indicate that the user’s move is incorrect later. For now I added the animation for the piece moving. I’ve learned that when moving the pieces by updating the state in react, the key of the element is what matters for animation to occur. If the key of the element is same and just the transform style has changed react knows that it’s the same piece that jumped from one place to another. Also now, the move transition doesn’t happen when the pieces are being place. Because the pieces are placed using the transfrom property, the same property used to move the piece. I took me a while to fix this. It seems that this was happening because the squareWidth was making the page re render. I’ve fixed it but I still I don’t completely understand it, which shows that I’ve a long way to go. This one is small but crucial. Now the user cannot select the opponent’s piece during opponent’s turn. I’ve added a 500 ms delay for opponent’s move so that it doesn’t feel things are happening really fast. In that timeframe user is not able to select any pieces now. I am now stuck at the part where I am trying to animate the pieces after checking the user input. Whether it’s correct or incorrect. I wanted to make the background green if the move was correct and red if it move user made was incorrect. Using states is proving to be tricky for me as they’re fully synchronous. My brain goes okay this will happen and that will happen but the code won’t have the updated data because of useState nature. Also I tried to change the background color same way I move the pieces. Now that I think I about it I just wasted time. I will try to do animations with gsap now but idk how to explain I can’t really think of a way to do it with these useStates. Okay this was more that enough yap for 2hr 30 mins of work. Let’s see if I figure out a way tomorrow. If you’re reading this love you man 💖.
Making good progress The piece background color now changes color depending upon the correct or incorrect move that the user makes. Last time I was trying to achieve this by just using useState hook. I’ve understood now that it was the wrong approach instead now gsap handles the animation part. The main issue with gsap I was having was I didn’t know how to select the exact piece for animation. I’ve achieved this by using useRef hook named pieceRefs containing an object will all the pieces on the board with their ids as key. I haven’t never used a ref like this before and it feels scary to write code in the unknown territory but ig it’s a part learning. Also I’ve removed the code that changed the backgroundColor using useState and used gsap. It was just waste of my time to try to use useState hook to change the backgroundColor . So now, piece toggling the highlighted bg color when a piece is selected or unselected will be handled through gsap. Ahhhhhhh.. Finally after a puzzle is completed successfully the the next puzzle will start. My brain feels like it’s melting after making this work. I struggled so much to make the work mainly due to react batching the state updates. Unexpected bugs came while coding this. So, basically a puzzle is considered finished if the moveOpponentPiece function has no moves left. Then, we change the fen state and also reset the board so that the pieces are placed again. After that when player reaches next level the opponent first move needs to take place. For that I have a useEffect hook to check if opponentMoveIndex and userMoveIndex value are default values. The values are set to default through resetBoard function and if the values are the default ones then the opponent pieces moves. One of the main issues I had with this was the moveOpponentPiece function was running twice. Due to which one of the opponent move was being skipped. I wasn’t able to locate why and was making so many unnecessary changes and console logging everywhere to fix this 😭 . The issue was that the useEffect that I talked about earlier had pieces in the dependency array making the moveOpponentPiece function to run twice. I’m really exhausted after doing this… Then after some relaxation I made a rough figma design for the puzzles sidebar. It was kinda relaxing to not worry about coding for a while. I had big plans for the sidebar like making candy crush type levels but I don’t think I’ve time for that so just basic buttons will have to do. I’ve tried creating the distuinguishing the levels based on completed levels, current level and locked levels. Back to coding again, I mostly copied the vision sidebar code for puzzles sidebar as the only difference is in the sidebar body. It seems that I’ve forgetten to use css grids. I wanted the buttons layout to be responsive. I took a quick revisit on how grids. Throwed random properties at the grid hoping it will work as I expected 😆. At last it was the auto-fill property I was looking for with a combination of minmax. I’ve tried created the css for completed, current and locked now I just have to hook them up to the buttons according to puzzle level reached by player. I’ll do that tomorrow, now I’ll stop writing. If you’re reading this, I hope your project is going well💖.
Learnt something valuable ✨ Okay now the puzzle buttons have dynamic ui. The puzzle button will have ui according to the puzzle level. I was confused on how to achieive because there were three condition instead of two. If there were only two coniditions then it would have be easy as I would have simply used ternary operator. I couldn’t use if condition inside jsx. After some time I figured that if could call a function and use if conditions inside the function and return the className. Also now the puzzle level is stored and fetched from the backend. After doing that a toast error popped up as you can see below. I didn’t know why this was showing up when the page is first loaded up but instead of fixing that I first moved on to make the start puzzle button work. I think my main problem is I get distracted easily. To make the start puzzles button work firstly I created puzzle context file . I was deciding to make the chesboard context the puzzlecontext as all the data needed for puzzles page was there but I think it’s better to seperate those things. So, I placed the puzzle context higher than chessboard context with that thought process. If the puzzle hasn’t started the fen value is set to default starting position. Then I again got distracted and thought why isn’t the vision context also above the chessboard context. So, I moved the vision context and the coordinates broke. The reason was color state so then I created different color states for vision and puzzle context. While writing this I don’t actually know what I’m really doing. I do one thing and jump onto another making writing the devlog very hard. I think I can do better… 🙁 After learning the lesson, doing thing one at a time. I only focused on making the start button work. So I moved some values inside puzzles context for this to work and everything broke. But, I wasn’t feeling overwhelmed as my focus on only one thing. Slowly but surely I fixed the pieces moving, capturing and the first opponent move. I think my main issue is dealing with useState hook updating in batches. Ig I will just get better with time. Still the backgroundColor animation is broken which I need to fix. Also while doing this I found out why the toast error was occurring. Silly me didn’t add method post to update the puzzle level. Now after the puzzle finishes the puzzle levels value updates and the updated value persists. I should definitely do things one at a time. Getting distracted and doing multiple things will just make me feeling overwhelmed and will make it harder for me to devlog as well.
Two steps forward, Four steps backwards 😭 Firstly, I’ve fixed the gsap animations not working. This happened because last time I renamed all the color state into chessboardColor. Due to this the gsap backgroundColor css property turned into backgroundchessboardColor. Ig the lesson here is think before using change all occurences feature in vscode. The sidebar now changes. If puzzle hasn’t started then it’s the same old ui. If the puzzle starts the level btns disappear along with start puzzle button. If user makes incorrect move the sidebar show retry puzzle button and if the puzzle is completed successfully then next puzzle button shows up. One thing I learned here is making one button use different className, onClick handler and text easily by storing all data in object. The retry and completed onClick function looks empty. So, I decided to work on the retry puzzle button functionality. To make the functionality work I imported the resetBoard function from chessboard context. Calling the function directly didn’t work because setState function doesn’t apparently update if the value is same. I fixed that by passing {retryLevel: true} or false to the function. After doing this the first opponent move did break and I did fix it but I think with bad code. Looking at the code now I’ve been calling resetting the board and setting default position using the chessboardColor seems wrong. So, then I started cleaning the code. I guess I was correct and things needed to change. I would say these are mostly small changes and don’t need explanation but it seems that the chessboardColor had an actually bug and it took my soul away trying to fix that 😭 . So, the opponent move was capturing it’s own piece meaning that the piece which moved at the beginning would automatically disappear. This was happening because the moveOpponentPiece function ran before the chessboardColor could change when the puzzle is first started. To fix this I had used useEffect hook with chessboardColor in the dependency array to reset the board. But only works if I have the black pieces. If I have the white pieces the chessboardColor doesn’t update because useState doesn’t update when the value is same. The value is white at first because of the default position set when puzzle hasn’t started. I don’t even know how to explain the fix i used. I just chained state updates from file to file to have colorUpdated state value updated in chessboard context.jsx. Basically I had a rough time fixing the resetBoard function running before chessboard color was updated. This time even pen and paper also couldn’t help me solve this 😭 😭 but it did help me to understand the problem on a deeper level. I tried adding next puzzle button functionality. “I tried” 😭 cuz I couldn’t get it to work and on top of that when I tested the retry button it didn’t work. Don’t know how but the retry button also broke. Now, I’m taking a huge decision again. I think some of the problems can be reduced if the chessboard wasn’t a single component that works on both puzzle page and vision page. I think I was too ambitious but now seeing these issues I think it’s better for me to have to separate chessboard components. This might not be the best practice, but this will probably make my life easier. I just read the “Devlogs that get noticed” in the resources page and I think I should make my devlogs a little shorter. I said this in one of my previous blocks as well, but it seems that I am explaining too much. So let’s see what will happen tomorrow. Okay bieeee….
Ayy good progress today I created a separate chessboard component for puzzles page only. Before both puzzles page and vision page were using the same chessboard component making the code complex, hard to read and hard to debug. Firstly I decided to move all the chessboard functions and states into puzzle context but later changed my mind midway. I decided the chessboard functions and states make more sense to be in it’s own folder. Everything broke while doing as expected but I fixed them one by one. Now the puzzles chessboard is functional and it’s code looks a little less overwhelming to me. Now the vision page also needed a separate a chessboard. It wasn’t as easy as just copying and pasting most of the code into vision chessboard because the data was connected to more components of the sidebar such as progress timer, color Menu, etc. I don’t if I should separate the functions to components that they server of just dump it all into the vision context file. What I did was keep functions into their respective folders cuz I think the vision context file looks really cluttered doing that. Everything broke here as well but as before I fixed things one by one. Now I really believe it will be much easier for me to work on chessboards as they’ve been seperated. Also I deleted the original chessboard component and chessboard context after that. On clicking the sidebar button the reset board function is called and the function came from chessboard context. As there is no chessboard context now you can see that there’s a problem here. The reset board function in now in PuzzlesChessboard.jsx which means we can’t access it from PuzzlesSidebarBody.jsx. To solve this I just made the board reset everytime when hasPuzzleStarted is true. We do have the access to hasPuzzleStarted from puzzle context. Fixing that somehow broke the piece transition though. After that I mostly worked on the small things. Such as fixing no transition during piece, fixing the progress timer staring with 2 seconds less than the time set, adding chessboard size to puzzles chessboard in a better way, etc… Now the next puzzle and retry puzzle buttons also work. The next puzzle button works as expected. The retry puzzle button also works but the pieces move to their repective place with animation when the board resets which I don’t wan’t. To prevent this specific thing I have already written some code before and it’s working when starting the puzzle, moving to next puzzle, rendering the default pieces on first load. I can’t figure out why it’s specifically working for retrying a puzzle. I spend a good amount of time looking but idk. I’ll look into this tomorrow. I think the devlogs are still pretty long. I’ll try to keep the devlogs shorter on future devlogs. Okay bie…
Finally, I present to you a short devlog 😆 I have fixed the issue of pieces moving with transition when pieces are being placed after clicking on retry puzzle. To prevent this I already written code which worked perfectly but when only on retry puzzle it wasn’t working. This solution was simple but figuring out the issue took time. To fix the issue I used a useState hook to set hasPiecesPlaced to true only after pieces state updated. Also, I’ve already written code for handling page change in the middle of vision practice. I think this doesn’t work after I removed Chessboard.jsx and ChessboardContext.jsx. Not sure when this broke . I found better way to do this using the useEffect hook cleanup function. I learned that when adding setState directly in cleanup function it throws at recurring error 😭 . I felt my laptop heating up 😭 😭 . But there’s no error when adding setState inside the function and then running the function in the cleanup function. That’s all for today. Couldn’t do as much as would like today cuz a rat bit me 😭. Bye…
Interesting updates I added back button in puzzles sidebar with functionality. Before there was not way to go to the default sidebar (the notStarted state). Now after messing up or completing a puzzle there’s a back button which sets the board to default postion and set sidebarMode to “notStarted”. I wanted both buttons to be taking up equal space but later thought the smaller back button is better. Also now, puzzleLevel updates instantly updates after solving a puzzle instead of updating only after clicking next puzzle button. User can now select and play any completed puzzle by clicking level btns in sidebar. Previously user can only start the puzzle Level user has reached which meant no puzzle 1 and 2 resolving puzzle after user has reached level 3. I split the puzzleLevel state into selectedLevel and highestReachedLevel. The puzzle is set to the selectedLevel and the buttons aren’t clickable above the highestReachedLevel. The ui of level buttons is changed. I made the buttons smaller and made the selected level more distinct by adding a inner glow to the button. We’ve upto 30 levels now . I downloaded the lichess puzzles database for this project but whenever I opened the file my laptop will just heat as there were more than 69 millions data 💀 . I did try to use the lichess data but I didn’t actually like the progression of difficulty so I used chatgpt to make puzzles. I’ve played upto 21 levels and I think it’s good so far. That’s all for now, okay bie….
A little rest from programming I’ve added hint button in the puzzles sidebar. I had been trying to avoid working on this but I couldn’t avoid it forever. Also the puzzles sidebar looked really empty without the hint button. In chess.com the hint button highlights the correct. I did things a little differently, the hint is communicated via text to user. The text animates during first appearance and I’ve made it so that user gets only one hint. After the hint the button goes gray indicating it’s not clickable anymore. I made puzzles sidebar code better to display buttons and also added replay button with functionality on successful puzzle complete. I mainly made the code better cuz I need to add the replay button. The replay button is same as retry button for replaying the puzzle after completion. I made next button do nothing if user reaches the last level. Before when completing the last puzzle level we would reach the next level automatically which is prevented now. I’ve been sick for 2-3 days now and am just writing this devlog. Hopefully from tomorrow I will be working on the project more seriously.
I’m so sloppy now I’ve added sounds for piece movement, capturing piece and completed puzzle. I spent more time than I should’ve finding the sounds. I am still not sure about the sounds that I’ve added expect completed puzzle sound. There was issue with playing sounds during opponent move cuz unlike moving player’s piece where there are seperate function for moving and capturing pieces, the moving and capturing logic is inside the same function. After thinking a while I did solve the issue. It seems mac default recording doesn’t capture sounds so you just have to trust me here 😅. I’ve made hint button disabled when pieces are moving (Both player and opponent piece). I did this after figuring out if user click the hint button quickly after the last puzzle move then we get an error. Although this thing happening is very unlikely but it’s better to always fix bugs. Also I don’t know what happens if user clicks on hint inbetween moves so I think preventing it is better. A small change, I’ve added better hover transition to logout button. I didn’t add a red background during making it cuz I had issue with chaning the svg color. I’ve learned that if I make the svg inline in the jsx and set fill to currentColor then I can change the svg color through css and add transitions. Also, I’ve added popup animations to time menu and color menu. I was even struggling with this even though I’ve added those kind of animations before. I was using the new Activity element in react to toggle the menus but to for adding the animations I’ve removed the Activity element cuz the menu would disappear before animating. I took some break from coding cuz I got sick. I think I’m really sloppy now. Imo these changes shouldn’t have taken me 2hrs. Hope I will be able to shake off this sloppiness.
Wow! This is the 51th devlog I’ve added the player color indicator in the sidebar. It tells you which color you’re playing. Before coding this I just complicating things in my head by thinking of creating new unnecessary states. I used pen and paper to think and realized why not use the color state already available in chessboard. To access the state I moved it up to the puzzles context file where both sidebar and chessboard could get and change the color. I also moved the hint down as it look clutter both color and hint together in the sidebar. Two quick small fixes. I fixed retry and back button not working and fixed replay button not playing the same level only on last level. I’ve added pawn promotions functionality to the opponent’s pawns. In puzzle 17 and 26 there are promotions that happen but without the promotion part it just looks weird to look at. Especially in level 26 where the pawn promotes to a knight and without having that knowledge the user will just get confused. I haven’t added promotion functionality for the user pawns because there is no puzzle that requires it. I will add it if I have the time to but rn i am going to just ignore it. One of the bugs I faced while doing this was the knight promotion worked fine but the queen promotion at level 17 wasn’t. The pawn was just disappearing because the pawn was capturing itself cuz the promotion only work for black pieces which is now fixed. Next I fixed the random color option color menu not working. Idk when and how it broke I thought it was working fine but it seems not. It seems it was not working because the element was being unmounted before running the selectRandomColor function. So, I moved it to vision context and with a useEffect hook it runs every time hasStarted is true. A small change but which I feel great that it’s solved. When clicking on accordion or pieces twice sometimes it selects the icon and other things which was just annoying. The fix was just two lines of css which I learned from a random dude on the internet. Really thank that random dude. I’ve now added functionality for adding multiple bestScore for according to the time and color. Before the highest score in vision would be the score scored across any time or color. So if you were to score 5 point in 45 seconds and score 5 points in 30 seconds they were treated as the same thing which imo opinion isn’t fair. To achieve this I used object inside a object unlike the single number representing the bestScore like before. The object looks like this. { white: { 15: 0, 30: 0, 45: 0, }, black: { 15: 0, 30: 0, 45: 0, } } I did have a very hard time figuring out how to update the state like this as I had to change the specific time score within the correct color. One thing I did learn from this is we can use square brackets for using a variable’s value as key while manipulating the useState object. I also encountered some errors while trying to implement this functionality. Now everything is working as expected.
Many small improvements 🙂 I’ve added transition to level btns and added icons and different ui to puzzle sidebar button. I am using an array inside objects to display all buttons. So to customize the buttons I manipulated the array.Some button have only text, some have both text and img and some have only img. Also the main button is wider and other buttons are gray in background color. For this I used the className like in tailwind to add the styling meaning the buttons which need gray color will have the className gray. The size of the buttons is differentiated using different values of flex grow. I think the buttons look way better now. I’ve added reset if user changes from puzzles page to other page. The is to avoid any unnecessary bugs and error. I had already done this in vision page now it was the turn of the puzzles page. I have been avoiding this for so long but finally I’ve done it. I added the videos for professional course (or should I say advance course). I changed the name to advance cuz professional is just the wrong word to use here. I also moved some videos from beginner to intermediate. Now that the courses are in place I can finally write what you’ll learn in the information section. I’ve added numbers such as 0 - 1000 representing what I mean by beginner. I’ve tried to match videos to the elo level. The data in courses section in the home page is also change from placeholder data. Looking back at the code they are really bad but I’ll leave it as it is not broken 😁. Now I think the project is coming to it’s final stages I do need to add things but after that ig all I need is to polish the website and make website responsive. I’ve also fixed progress bar animation happening everytime on reload. This was a small thing but it was bugging me so I decided to fix it. Fixing it was annoying as I had expected to fix this easily. After some trial and error I fixed it using a hasCompleted state which is set to true after finish lesson button is click. Only when the hasCompleted is true the animation occurs. Some other changes I did were fixing only displaying highest achieved medal in course page and adding background color transitions to buttons. Enought yapping. I don’t feel like coding and I think I should take some rest for the next two days. Hope the rest reset my feelings and returns me to my prime stardance days 😆.
The website is live guys I used vercel to deploy my mern stack project and it was rough . I first tried deploying the the frontend and the backend separately. After reading blogs and trying I ended up deploying the express backend but at that point I had learned that there’s vercel cli with which I don’t have to push commits everytime to find out errors in production. I can just use “vercel dev” command to create a production like environment but for development and testing out. I couldn’t figure out how to run frontend and backend seperately using vercel cli. I then tried deploying the whole repo. The issue with this was I couldn’t configure the website with folder structure like this chess-website ----frontend ----backend Maybe there’s a way to make this work (I couldn’t ), I chose the easier path which I’m kinda familiar with. In this approach there’s no frontend and backend directory. The backend is renamed to api which allows vercel to recognize that it’s the backend and all the contents of the frontend folder will be moved up to the root directory. Errors came as I changed the folder structure but fixed on after another. The backend wasn’t working which got me really confused. There were many issues in this approach as well but atlast the website is running and backend is working properly . The two days break I took from coding is over and i think I feel better. Here’s the link to the website: https://evochess.vercel.app/
Starting making the website responsive Before starting on making the website responsive I saw that when logging in or signing up there is some delay before redirection where people might click the login button several times thinking that it it’s working which is bad ux. In development there was almost no delay because I was using local mongodb. To let the user know that the button has been clicked successfully and to prevent multiple login/signup button clicks the buttons are disabled as soon as user clicks any button in login or signup page while turning the buttons color into gray. Now on to the reponsive ui part. I first tried making the navbar responsive but it didn’t look right in small screens. I was also trying to make the hero section responsive but without any design to follow. So realizing that I needed a design first I then hopped onto figma to design the navbar and hero section. I changed the ui of the navbar ig to make it easier to make it responsive but I don’t know if the navbar ui got better or worse. I know one thing and that is the navbar has got simpler. The design on the mobile is pretty simple imo but that’s the best I could do to make it look decent. I used flex property to make all the text align vertically in phones and decided to remove the image in phone screens. I’ve have currently hidden all sections below 1024px except the hero section to focus only on the hero section without other sections interference. I’ve mostly used hardcoded values to make hero section which I will change to clamp css propery for smoother hero section responsiveness. I have just eyeballed the sizes and paddings which is a bad idea but I’m just lazy to create figma design for every layouts. Now, I’ll make the hamburger menu working. Uhh, I hate making website responsive but it has to be done. If you’ve any suggestion feel free to leave it down in the comments.
More website responsive stuff Firstly, I removed the animations from home and courses section below 768px of screen size. I didn’t remove the hero section starting animation cuz it’s nice. I used gsap matchMedia to achieve this. While removing the animations a funny thing happened, the matchMedia wasn’t working and then I was reading this a gsap forum hoping to see where did I go wrong. I later found that I was doing things correctly but instead of looking at localhost I was looking at live website. Obviously the changes didn’t appear 🤦♂️ Then, I made the courses section kinda resposive. Firstly I went to figma to design the mobile version of courses section as I was mainly unsure of what to do with the thumbnail cards. I decided to turn them into carousel which imo was a great idea. First, I turned turned the main courses section text smaller and then started working on the carousel. The making of carousel was rough. Firstly I was reading stuff online on how the sliding thing works. I think I somewhat figured that out but what I couldn’t figure out is the aligning the cards perfectly. The issue was I was going for a style where the first and the last card aren’t centered alight while the rest of them are. The swiping snapped the cards into place and some parts of the left and right cards would also be visible. I couldn’t figure out how to make this and was about to making hamburger menu but coincidentally while scrolling the stardance home page I saw recommended projects section where it’s like a carousel without the snapping thing. It was way easier to achieve than what I was thinking so even though I didn’t make what I wanted the carousel isn’t bad. The overall the courses section felt responsive so I started working on the hamburger menu. Working on hamburger menu went pretty smoothly except for some things going wrong here and there. I first roughly designed the the menu in figma and then wrote the code.
Worked on hero and puzzles section (Responsiveness) The puzzles section was the easier that hero and courses section for making it responsive cuz puzzles section doesn’t contain any animations or any special thing. After several trials of adjusting the fonts and image I stopped after it looked quite decent. Before working on the visualization section I decided to polish the hero section first. My main goal with polishing the hero sectino was mainly using clamp() css function for smooth responsive text. Although the text are responsive using media queries in hero section, the text look kinda odd in some screens. After using clamp the website feels better that before. Also I changed the width of image with % values which does feel better. I also used clamp for some vertical padding as well cuz it was looking bad for devices with smaller vertical heights. I thought from 425px to 768px was tablet screen size but it seems the tablet screen size starts from 768px. So now upto 768px the website follows the mobile design. Now I’ll polishing courses section and puzzles sections just like the hero section. Wish me luck 😄. Bye I wanted to add more images but it seems 4 is the limit .
This was a rough one One a good note I’ve completed making the home page responsive (for now). After making the hero section more responsive last time I then proceeded with making the courses and puzzles page more responsive. I mainly used the clamp css funciton to make the course and puzzles section responsive. The courses section remained the same as I am quite happy wiht how it turn out but I didn’t like how the puzzles section was looking after testing the website out in my phone. It looked to small for a section so below 768px instead of the text and image being horizontally aligned it’s now vertically aligned. The clamp part was similar to the courses section. Finally after completing those two I started working on the visualization section. I was the hardest section to make responsive due to the absolute positioning of the moves. Firstly I only focused on bigger screens as I had no idea how it would look on smaller devices. The moves were positioned before by mapping an array with the move notation and the css of top and right/left with percent values. I tried to remove that and instead of mapping the elements I thought of manually placing them and giving the ids by which I could have greater control over the css. While trying that I couldn’t make it work as in smaller screen heights it still looked terrible. At this point I was losing hope. I was wasting time watching a anime series just so I could avoid working on this. I tried thinking out the solution but nothing came in mind. Later when I was messing around with css throught the developer tools on the browser I realized the I could change the height of the image container to change the positioning of the moves as the moves are postioned on the basis of the image container. Now below 1440px the height of image container is 90% and below 1024px it’s 80% and I have a max-height value set for safety. It’s not prefect but it’s much better and I’m relieved 😌 . The mobile design uses a image contaning the main image and all the moves as there’s no animation on mobile devices. I made the image in fimga and using clamps and % values I think it’s decently responsive. To make the pages responsive I am using the developer tool in browser to first figure out the min and max values and the putting that value into clamp calculator to generate values. I am constantly switching between vscode and browser for this and if you have a better way to do it please lemme know. Okay the devlog has turned very long so biee…
We’ve reached 200 hours It’s a big milestone that I’ve finally reached . I’ve made the whole course page responsive. This took me longer than I’ve expected. But before that I was getting 404 not found when visiting locations like /course directly but it was working normally when I was navbar to navigate. I’ve seen this issue before as well so I kinda knew that this was because of react SPA (Single Page Application) thing. To fix this I configured the vercel.json file and now it works as expected. So onto the course page. Firstly I made the accordions responsive on mobile screens using css clamp function. I removed the course info section for mobile devices. I didn’t touch the course card as they were a future problem for me to do. But the basic idea was the image with take up the whole width and the image and the text will be vertically aligned instead of the default horizontal alignment. Between 1024px and 768px one of the issues was the course info was looking crammed on the smaller side. so I reduced the padding and font-sizes with clamp css function so that it still looks good on the bigger screens. I also made the progress bar slimmer and badges smaller. Another issue were the course cards. One the bigger screens they looked find but on smaller screens the text were taking up more height than the image itself. I changed the value of thumbnail image from fixed value to %. Also I reduced the massive 1.75rem padding on the course card container for smaller screens. Also for all screens sizes below768px I made the banner slightly bigger vertically as the previous banner was looking very slim on mobile devices. I scraped the idea of making course cards vertically aligned and stayed with the horizontal alignment. I somehow managed the cards to look decent on smaller screens as well by using clamp(). The things I needed to do were similar but I guess it took me long as I was first checking the min and max values using browser dev tools and then putting that into clamp calculator and then pasting the value into vscode. Basically I had to constantly switch between things. In the end, I went to sleep but couldn’t fall asleep so I decided to complete the course page reponsiveness and do on last thing which was making the loading spinner responsive. Then, I peacefully went to bed .
Gosh I’m so dumb Last time I thought I had fixed 404 page issue when visiting paths like course directly. I did fix it for local development but not for production which is really dumb, shouldn’t the development environment be the same as deployment when using vercel cli. I tweaked the vercel.json to fix the issue in production now but now in the development the website didn’t work. The fix that I’m now using is leaving the production as it is and in devlopment using the environment created by vercel cli only as backend and running the frontend seperately using pnpm run dev. To connect both backend and frontend I configured the vite.config.js to redirect every /api request to localhost:3000(this is running throught vercel cli) Most of the time was spent on making the signup page responsive. The login page is also now responsive but it’s just a copy paste of signup page css. I am quite dissapointed in myself because it took me so long to do this and still I don’t like how it looks on certain screens. As I realized that I was spending too much time on making signup page responsive I panicked and just rushed the process. As a result a have a reponsive signup and login page that I’m not very proud of. I fixed the signup not working. While signing up there it showed user already exist error everytime. The fix was quite simple, I had missed await keyword when checking for user with same email in database. Due to which the userExists variable was always true. Then I did something really dumb. I tried to fix something that was already working. I was worried that if I delete a user from database and then if that user tries to login then it would throw an error so without even checking if that was true I started making changes to the protectRoute.js file. I was thinking after the token is verified then I’ll just check if the user exists or not. In the process I deleted one important line of code because of which I wasn’t able to login now and I didn’t know why. I tried made the code as before not knowing the line is still missing so the error still persisted. After giving up and doing ctrl + z undo the previous code returned I finally realized the missing line of code. Also the feature was already there when fetching user data so none of this was necessary 🫠 .
Worked on the drag and drop feature Although it’s not fully complete and polished, it’s kinda working. I stopped working on the feature and started writing this devlog cuz It has been 3hrs I’m forgetting what I did while working on it. Firstly I wasn’t even going to implement this on the first place as I thought this was outside my coding capability but someone gave me a feedback that I should add this feature so I decided to give it a shot. I found out about the dnd-kit package for implementing drag and drop. I was skeptical of using it at first. I was reading their docs to figure out the package. My main concern was how would I implement the feature with the already existing click to move feature. They provide a useDraggable hook for making any element draggable. The useDraggable was used to make the piece draggable. I had to convert the piece code into a component for it to work. To drop something into another thing there’s useDropable hook which as the piece I made square, destSquares and captureSquares into components. If I were a good react dev I would’ve already did those things ig the using the package is some what helping my code to be cleaner. I used the useDroppable hook inside destinationSquares and captureSquares. I was concerned that we couldn’t actually drop the piece as it doesn’t live inside the square rather it lives on top of the board using position absolute. But, I had gotten dnd-kit wrong. I element does need go inside the element if useDroppable is used. There’s DragDropProvider that connects both draggable and droppable hook. Let’s just say DragDropProvider gave me all the function such as dragEnd and values needed to move the piece. Later I changed the useDroppable to be inside all squares cuz after dragging the piece there was some issues when dropping the piece in it’s original square if the user wanted to cancel the move. I didn’t really have to write new code for moving, capturing and resettingSquare as the code I wrote previously worked fine with the drag and drop functionality. There were many issues while trying to add this feature. Still there are issues I need to fix such as the highlighting the square bg color instead of the piece bg color when selecting piece and other bugs I’ve found. Also transition when opponent captures pieces doesn’t working also need to fix that. But, I’m really glad I tried to add this feature as I’ve learned alot and the puzzles board now feels more fun because of the feature. Thanks @PAPER_01 for suggesting the feature 💖 Okay, I’ll stop yapping. Have a good time
Omg how does changing the color model solve the issue Before that I fixed the black piece being upside down when dragging. You can see it in my last devlog’s video. I was only happening with black pieces because to make the board work when user got the black pieces I just rotated the board 180 degree. This made all the pieces upside down and to fix that I again rotated the piece’s img 180 degree. Ig when dragging using dnd-kit (npm package) the transform value was being overwritten causing this issue. To fix the issue rather the rotating with board using css I changed the order of files and ranks. I used flex-direction column replacing column-reverse for the rank to start from 1 to 8. Then for reversing the files when color is black then I mapped squares from reversed files array using toReversed array method. I thought by doing this I’ll make the code cleaner but I think it’s more messy now 😭 . Also I did have hard time understanding my own code when trying to solve the issue 😭 . I fixed the pieces, destSquares and captureSquares being generated on the wrong squares. I realized the piece transition wasn’t working when capturing piece both for user’s piece and opponent’s piece. The transition only happens if hasPlacedPieces is set to true and isDragging is false. So, my first assumption the hasPlacedPieces was being turned to false only when capturing pieces but I was wrong. I was checked if it had something to do with the value of isDragging. I found the isDragging was never turned false so I fixed it but still the main issue wasn’t resolved. I was console logging things and just trying to figure out what was actually causing the issue. The fix was really simple. To implement the drag and drop feature I’ve broken down piece code into it’s own component. There inside the component I have added the key attribute and it was the issue. The key attribute is supposed to be used on the component itself instead of inside the component div. (Eg.) I don’t know why it only broke the capture transition but anyways it’s fixed Now to the part where I don’t even understand how does this even happen. Hopefully you understood what I was saying in the video btw please unmute the video as I am talking in that video. So what happened was the piece img bg color changes when it’s selected. This was working fine until I added the dragging feature. When the piece is dragged you see the background color comes along with the piece. So I decided that the square should change it’s color rather than the img inside the piece. I was going to create squareRefs for holding all the values of sqaures and then select the square using gsap to change the color but I realized a easier way would be to just target the square id. It worked so I also decided to use for changing background color of square when user move was either correct or incorrect. On light squares it worked great and it also fixed the animation as the same animation was working a little weirdly when using pieceRefs. I was happy that it was better but then I found the bug from the video. I tried different things and just couldn’t figure out what was the issue but when I decided to change the color from var(–c-red) to yellow it worked as intended. Then I changed the same hsl color into hex and it also worked but I don’t know whyyyy. If someone knows why this happened please tell me cuz it’s ridiculous. Most of the issue had a simple solution but learning what caused the issue what the difficult part.
We’re close to the end First I fixed the buggy dropping piece. I fixed this when I first worked on drag and drop piece feature but I don’t know how it broke again. When trying different things to fix it I tried to move the setIsDragging(false) lower inside dragEnd function below movePiece and capturePiece function calls. Surprisingly it worked 😄. I fixed light square being dark and vise versa if user had the black pieces. I found out this issue because the coordinates colors were mismatched. So my first intuition was changing the color of coords.jsx. I got really confused as the changes did nothing in the browser. I am so dumb I was changing the vision page chessboard’s coords.jsx instead of puzzles page chessboard’s coords.jsx. It worked but then I realized the coordinates color weren’t wrong square colors were. I undid the changes made to coords.jsx. I also seperated the coords.jsx but adding puzzles and vision in the name. Then I fixed the squares color for black’s board. I’ve figured out the mobile design for puzzle section. First the idea was that the chessboard and sidebar would be stacked on top of each other. This was the easy route but if I did that then it would add friction to the mobile players as they would have to scroll all the way down to start the puzzles. Then I looked at chess.com and they were doing it really well where only after clicking start puzzle the chessboard will appear. So I removed the chessboard below 425px first and then made the button text, size and gap smaller. I also removed the aspect ratio of 1/1 from the buttons as the buttons were ruining the gaps between them in certain screen sizes. Now for the first challenge I faced. How do I only make the chessboard appear and disappear when clicking start puzzle only on mobile devices. As I used gsap matchMedia to make the chessboard’s container display none or block according to hasPuzzleStarted for mobile screens. The chessboardSize is calculated according to chessboard container so that the chessboard is divisible by 4. When first loading the chessboard if the container has display none then the chessboardSize becomes zero and when setting the container to block will only show empty chessboard container without a board. I tried using the autoAlpha property of gsap hoping that it will do that same job as display none but without remove the element. It was making the container invisible but the container would still retain it’s height and width. I was starting to doubt myself here and was thinking to take the easy route but just stacking the board and sidebar vertically. After thinking for a while I came up with a breakthrough I made the position of chessboard container to absolute and visibility to invisible. Now the chessboard container won’t be visible and won’t take up any space as it is absolute. When the board used absolute position idk why but the board container got so bigger. It also distorted the pieces when puzzle started. To fix it I ran the gsapMatchMedia code only after chessboardSize is calculated which was a great idea. It fixed the board when the puzzle started but when it was hidden it was still large. I just replaced the absolute and visibility with display: none as it only runs after the chessboardSize is calculated, that’s why there is no issue with display:none. Last change is when sidebarMode is notStarted then only chessboard is hidden. I know that 80% of the things I say won’t be understood but I’m not a good explainer so you have do deal with it 😅. Were really close to the end now I just have to make puzzles page and vision page responsive and just polish the website and then click the ship button
Made puzzles page responsive and bugs fixes Puzzles page responsive Most the time was spent making the puzzles page responsive. As always it took more time than expected. There were many issue that popped up and slowly but surely I fixed them. One of the issues was in bigger mobile screens the sidebar was being squished because the chessboard was getting really big but puzzles page has height of 100dvh as the chesboard in mobile phones is calculated according to width. To fix it I tried adding min-height to the sidebar for not getting squished and height of auto to puzzles page but this broke the sidebar when puzzles is not started cuz there’s no chessboard. The height of sidebar is 100% so due to the parent’s height being auto the sidebar height was about as didn’t fill the whole screen. To fix this I used overflow: scroll to puzzles page and it’s height to 100dvh. Another issue came when trying to make chessboard and sidebar look decent in different laptop sizes. I made it somehow work but using clamp, min-height, max-height, min-width and max width. It was kind of a pain to solve all the issues that came while doing this. That’s why I’ve rushed making the puzzles page responsive. My plan is to come and polish it after I’ve made the course page responsive as well. It shouldn’t be too difficult imo as it’s very similar to puzzles page. Fixed user being able to drag and drop opponent’s pieces It was a quite dumb bug. I had prevented this for click to move feature but I didn’t think about it in drag and drop. The fix was quite simple as dnd-kit (npm package) provides a disabled property in useDraggble. I disabled it for the pieces for dragging which had the opposite color of chessboard. Fix next puzzle button not working on second last level I didn’t actually know about this bug. A friend of mine told me about this issue while testing the website. After level 29 is completed a state is toggled to true which prevents the next button from not working. The next button is now only supposed to not work after completed the last level. I haven’t used fixed values for fixing this so in future if I decide to add or remove puzzles it shouldn’t break. The fix was a little more complex than I anticipated. 9 days of stardance remain now. So, I have to lock in now. Okay bie
Changed some puzzles and more responsiveness work Copied the puzzles page and it’s component’s media query css So after making puzzles page somewhat responsive last time, the first thing I decided to do after that was copying puzzles page media query css and just paste it in vision page as both of pages are very similar. This made the vision page and it’s components a little responsive. Puzzle changes I’ve changed the puzzle from level 12, 23 and 30. The 12 and 23 level had 2 ways to deliver checkmate and only one of them counted as correct. I changed them as user might get frustrated seeing that. My code doesn’t handle that so I just changed them. Level 30 was changed cuz it wasn’t really difficult. I don’t think I’m satisfied with the new level 30 puzzle either. One issue while polishing signup page I didn’t want the form to look squished on devices with small vertical screen size. Due to this last time I generally kept things smaller than what I wanted to make sure it looks okay for those devices. To fix that I added min-height to the form-container. It prevented the form from squishing but the form-container was overflowing as the puzzles page has 100dvh. What I wanted was just the form scrolling using overflow: scroll but this probably took me about 20-30 mins to make it work 😭 . I set overflow to scroll to form-container it didn’t work, added it to form which also didn’t work and then I added it to puzzles page. The scroll part was working when I added it on puzzles page but not what I was looking. Then I created a wrapper div to hold the img container and form container hoping now adding overflow:scroll to form container will do the job. After trying all things things I realized that the min-height was set to form container instead of form. The fix was to adding min-height to form and set overflow scroll to form-container. I removed the wrapper div after that as it was unnecessary and also hid the scrollbar that appears in form-container. Signup and login page polish after that annoying issue After that annoying issue I’d say things went pretty smoothly. I mainly used clamp as always for making things responsive. And as always it took me longer that expected. After polishing up the signup page I copied the code to login page and just changed signup to login. Vision page responsive on mobile devices Making the vision page responsive for mobile device was really similar as polishing signup page. I just used clamp for everything and made sure everything looked good. Now that I think about it i only made the sidebar responsive including the popup menu as only that is displayed on mobile devices and chessboard is hidden. The chessboard is also kinda responsive due to the copy pasting the puzzles page media query css. The making of sidebar responsive was just trying out different sizes and then putting the value into clamp calculator and copy pasting the value. Now, I’ll work on the vision page responsiveness for bigger devices and then if everything looks great after testing then I’ll ship the project
This devlog is a short one I’ve made the vision page responsive for larger screens. Last time I made the page responsive for mobile screens. I made some small changes in puzzles page while doing this for maintaining similar code . I ran into some issues such as css not working due to incorrect nesting and writing the writing the css on wrong file. Also, I removed media query for 1440px as the default css will work between 1024px and 1440px using clamp css functions and by doing that, above 1440px the css will stay the largest clamp value. I think I will do the same in puzzles page as well. 2hrs wen’t so quickly mainly cuz of my stupidity as I broke things that already was working fine. Also, I don’t think I like the mobile responsiveness that much but i don’t think i’ll change it now (or maybe I will). While writing this devlog I just realize that I’ve make the sidebar responsive after vision page has started. Uhhh i hate responsive design
Fixing things and some more responsive things I’ve fixed chessboard displaying multiple selected squares. This happened when user selected a piece and then selected another piece by dragging. The fix was really simple. I just added resetSquares function when piece on drag start. I’ve also fixed pieces stacking on top of each other if user drags and drops a piece on another piece quickly before the opponents move happens. This was prevented when pieces are moved only by clicking but I forgot to prevent this if pieces were dragged and dropped. I did two things to prevent this: I reduced the time for opponent piece to move after the first move. I disabled the piece from dragging if it wasn’t the player’s turn. It seems the first fix wasn’t sufficient as it created another bug. So, if user selected a piece by clicking or dragging and then dragged the same piece then the destination squares and captureSquare will just completely disappear. The occurred due to resetSquares function that I had added. I thought for a while and came up with this solution. The resetSquares function only executes if user selects another piece on drag. However the function won’t execute if the selected Piece is being dragged. The selected piece state null at first so resetSquares() won’t also execute if selected piece is null. Now, it works as expected until and unless I find some bugs. Now returning back to the responsiveness. I fixed the puzzles button to be equal width and height. I had made the level buttons responsive before but they weren’t the same size. I had tried the aspect ratio last time as well but it was breaking the layout. Basically I used aspect ratio, removed the grid templated rows and changed some clamp values. Also I removed the media query below 1440px and integrated it as default css. After doing that, I started to fix the attempts in in vision sidebar. I thought it would take me two seconds to do it as I just had to apply the puzzle button knowledge here. I thought just doing this will work grid-template-columns: repeat(auto-fit, minmax(40px, 1fr)); I was wrong 😭 This worked fine for level buttons cuz the number of buttons were static. Here the attempts squares increases as the user clicks on the chessboard. If there’s only one attempt square then it will take the whole width. I was stuck after this. I tried different things such as using max-width, trying to add width: fit-content, etc. but nothing worked. At last I thought of reverting back to what the code orginally was which just used flex and flex wrap but coming this far I just used grid and used different values with height to make the attemps square kinda responsive. I still need to use clamp or something to make this look good. Uhhhhhh this is so frustrating… . I think I’m overexplaining things. I should just simplify down things
THIS MIGHT BE THE LAST DEVLOG First I polished the puzzles sidebar. I made the sidebar width to be same as vision page sidebar. Then I changed the level button size as they were too small for larger screens. I also made the level button container scrollable if the level buttons overflow. This took the most time because the whole puzzles sidebar body was overflowing pushing down that start button. I just wanted the sidebar body to not overflow which would make the levels container to be scrollable. The fix at last was using min-height: 0 to the sidebar body. Idk how the min-height: 0 is helping here 😭 . Next I made the visualization section animation (The last section of the home page) to appear quicker. This was a recommendation from my brother as when scrolling previously the section might seem like it contained nothing until you scroll fully. I faced issued mainly with the section not pinning to the top of screen when trying to move the animation timeline starting point. Also I tried to placing text higher on y axis and animate it coming down with the user scroll which produce the result I was expecting. So, I split the timeline into two. The first one reveals the text and the second one shows a person visualizing. The tex revealing animation ends when the section top hits the top of the screen which makes the section pin to the top exactly how I wanted it to be. Then I polished vision page sidebar as follows: Made the sidebar responsive after user has clicked on start Made the sidebar header look better and fix mismatch of padding from body Returned to using flex for the attempts and mad them responsive Tweaked the options and info as they were looking odd in some screen sizes (mainly the tablet one which looked really bad) I then copied some of these changes to the puzzles sidebar for maintaining similarity. Lastly I capped the width of course, puzzles and vision page to 1600px by adding a wrapper element. It acted weird on puzzles and vision page sidebar as there was already a element named wrapper and so I changed the classname to page-wrapper.
Ships:
Let’s ship 🚢 This is a website where people can learn and improve their chess skills by watching courses, solving puzzles and practicing their vision. The website was overall really challenging to build. If I had do pick, it would definitely be making a working chessboard for puzzles. At the beginning of the project I didn’t even know if I was capable of building one but I am really glad I tried as I’ve learned so much. Another challenging thing would definitely be making the website responsive. I don’t like making website responsive and in this project animations added another layer of complexity. I’ve tried my best to keep things responsive though. I am really proud of completing the project and mainly working chessboard as this is my first time building something like this. I am also proud of the animations and the ui of the website. To test my website some knowledge of chess is preferred but even if you have zero knowledge about chess you can test out my project as there are courses which will teach you about chess. Thanks stardance for everything 💖💖. I probably would never have created or completed this project without stardance😄...
|
1793047914.9301367
|
1793134314.9301367
|
|
4802
|
ResumeBot by @web | Stardance
|
web
|
1
|
3.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-27T18:13:19Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Tired of drafting countless applications for your co-ops? Opportune helps people organize their skills and experiences to automatically find suitable opportunities and draft application materials.", "repo": "https://github.com/Web1000/Opportune", "demo": "https://web1000.hackclub.app/"}]...
|
[{"post_id": 4635, "ts": "2026 [{"post_id": 4635, "ts": "2026-06-08T00:54:31Z", "hours": 3.1828, "text": "Search bar"}]...
|
Title: ResumeBot by @web | Stardance
Devlogs:
Sea Title: ResumeBot by @web | Stardance
Devlogs:
Search bar
Ships:
Tired of drafting countless applications for your co-ops? Opportune helps people organize their skills and experiences to automatically find suitable opportunities and draft application materials....
|
1792990466.4610097
|
1793076866.4610097
|
|
4804
|
Universal Civilization Sim by @Niamh | Stardance
|
Niamh
|
1
|
17.0
|
145
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-07-02T00:15:30Z", "hours": 17.0, "multiplier": 10.31, "payout": 145, "blessing": "neutral", "text": "UniCivSim This is my first ship and I’m excited. This is UniCivSim short for Universal Civilization Simulation (Genius name I know), it’s meant to approximate dark forest theory, which is a theory of how interstellar civilisations interact based in game theory and it ends with claiming that civilisation have two options their either Destroy any other civilisation they encounter Hide from all other civilisations The main aspect of this that I couldn’t approximate is information. In dark forest theory lack of information is what means the benevolent civilisations are better off hiding then going out searching for others like then. In my civilisation simulator they have the benefit of perfect information, when two civs meet their interaction is instantly determined by their behaviour. This leads to an interestingly different conclusion, the simulations always end with only benevolent empires remaining which paints quote a hopeful picture of the far future. Anyway I hope you enjoy playing around with the factors and thank you for rating my project.", "repo": "https://github.com/NiamhGrimesMcDonough/UniCivSim", "demo": "https://github.com/NiamhGrimesMcDonough/UniCivSim/releases/tag/Release"}]...
|
[{"post_id": 20401, "ts": "202 [{"post_id": 20401, "ts": "2026-07-02T00:04:08Z", "hours": 4.1308, "text": "V1.0 ON MY CIVILIZATION SIMULATOR! It’s been a while since I posted a devlog on this project. I’ve been working on getting this to a minimum viable product for release so that’s bug fixing, core features and packaging. Features More complex civilisation behaviour Improved settings screen Full screen Notes Honestly my heart was never really in this project, I was mainly trying to build the courage to work on hardware which I think I’ve secured (You can hopefully expect some rocketry based stuff from me in future) but I have done my best to build something I can be proud of."}, {"post_id": 17011, "ts": "2026-06-27T16:39:05Z", "hours": 4.9925, "text": "V0.6 on my Civilization Simulator On the latest release we now have a settings menu that allows you to adjust the factors affecting the simulation. New Features A settings menu that launches on startup and allows you to adjust the simulation. A text file that stores the variables for easy editing Planned Features Implement more behaviors for civilizations encountering one another based off of more varied factors such as benevolence, malevolence and desperation Clean up UI and add a setting menu to tweak the factors of the simulation Add dialogue elements to easier understand what is going on Package into an exe application One step closer to first ship!"}, {"post_id": 12197, "ts": "2026-06-19T22:12:23Z", "hours": 4.0464, "text": "V0.5 on my Civilization Simulator In this latest version we now have civilizations that are spawned randomly based on the variables for the Drake equation The average rate of star formation in our galaxy The fraction of those stars that have planets The average number of planets that could support life that actually develop life at some point. The fraction of planets that develop life that go on the develop intelligent life The fraction of civilizations that develop a technology that releases detectable signs of their existence into space The length of time for which such civilizations release detectable signal into space. In this implementation we don’t use the rate of star formation as we already decide seperatly how many stars we will include in our simulation. Current Features We can create a randomly generated star map in a window We can create civilizations in some of those stars based off of the drake equation We can have those civilizations expand at a factor of the speed of light accelerating and related to their level of technology We can have those civilizations interact in a way that is loosely based on dark forest theory Planned Features Implement more behaviours for civilizations encountering one another based off of more varied factors such as benevolance, malevolance and desperation Clean up UI and add a setting menu to tweak the factors of the simulation Add dialogue elements to easier understand what is going on Package into an exe application"}, {"post_id": 9550, "ts": "2026-06-15T22:34:19Z", "hours": 2.1931, "text": "I reprogrammed the rendering to go from tkinter to pygame, this will be a better basis for future functionality. The plan currently is to keep it simple so, when generating a star we’ll run odds for whether there’s a civilization there based off your options for the drake equation. From there we’ll spawn a sprite that expands at some factor of the speed of light, when it collides with another sprite we’ll run a random chance at first we’ll base this fully off dark forest theory so they’ll always destroy each other, which destroys the other will depend on age and a randomly determined factor called desperation. Once I have the basic system working I want to add more complex behaviors where civilizations can merge or co-exist✨"}, {"post_id": 2455, "ts": "2026-06-04T23:06:03Z", "hours": 1.725, "text": "First version of my universe sim, so far it just build out the 2d star field that the rest will be built on top of."}]...
|
Title: Universal Civilization Sim by @Niamh | Star Title: Universal Civilization Sim by @Niamh | Stardance
Devlogs:
First version of my universe sim, so far it just build out the 2d star field that the rest will be built on top of.
I reprogrammed the rendering to go from tkinter to pygame, this will be a better basis for future functionality. The plan currently is to keep it simple so, when generating a star we’ll run odds for whether there’s a civilization there based off your options for the drake equation. From there we’ll spawn a sprite that expands at some factor of the speed of light, when it collides with another sprite we’ll run a random chance at first we’ll base this fully off dark forest theory so they’ll always destroy each other, which destroys the other will depend on age and a randomly determined factor called desperation. Once I have the basic system working I want to add more complex behaviors where civilizations can merge or co-exist✨
V0.5 on my Civilization Simulator In this latest version we now have civilizations that are spawned randomly based on the variables for the Drake equation The average rate of star formation in our galaxy The fraction of those stars that have planets The average number of planets that could support life that actually develop life at some point. The fraction of planets that develop life that go on the develop intelligent life The fraction of civilizations that develop a technology that releases detectable signs of their existence into space The length of time for which such civilizations release detectable signal into space. In this implementation we don’t use the rate of star formation as we already decide seperatly how many stars we will include in our simulation. Current Features We can create a randomly generated star map in a window We can create civilizations in some of those stars based off of the drake equation We can have those civilizations expand at a factor of the speed of light accelerating and related to their level of technology We can have those civilizations interact in a way that is loosely based on dark forest theory Planned Features Implement more behaviours for civilizations encountering one another based off of more varied factors such as benevolance, malevolance and desperation Clean up UI and add a setting menu to tweak the factors of the simulation Add dialogue elements to easier understand what is going on Package into an exe application
V0.6 on my Civilization Simulator On the latest release we now have a settings menu that allows you to adjust the factors affecting the simulation. New Features A settings menu that launches on startup and allows you to adjust the simulation. A text file that stores the variables for easy editing Planned Features Implement more behaviors for civilizations encountering one another based off of more varied factors such as benevolence, malevolence and desperation Clean up UI and add a setting menu to tweak the factors of the simulation Add dialogue elements to easier understand what is going on Package into an exe application One step closer to first ship!
V1.0 ON MY CIVILIZATION SIMULATOR! It’s been a while since I posted a devlog on this project. I’ve been working on getting this to a minimum viable product for release so that’s bug fixing, core features and packaging. Features More complex civilisation behaviour Improved settings screen Full screen Notes Honestly my heart was never really in this project, I was mainly trying to build the courage to work on hardware which I think I’ve secured (You can hopefully expect some rocketry based stuff from me in future) but I have done my best to build something I can be proud of.
Ships:
UniCivSim This is my first ship and I’m excited. This is UniCivSim short for Universal Civilization Simulation (Genius name I know), it’s meant to approximate dark forest theory, which is a theory of how interstellar civilisations interact based in game theory and it ends with claiming that civilisation have two options their either Destroy any other civilisation they encounter Hide from all other civilisations The main aspect of this that I couldn’t approximate is information. In dark forest theory lack of information is what means the benevolent civilisations are better off hiding then going out searching for others like then. In my civilisation simulator they have the benefit of perfect information, when two civs meet their interaction is instantly determined by their behaviour. This leads to an interestingly different conclusion, the simulations always end with only benevolent empires remaining which paints quote a hopeful picture of the far future. Anyway I hope you enjoy playing around with the factors and thank you for rating my project....
|
1792986553.4249113
|
1793072953.4249113
|
|
4810
|
AstroPad by @SpaceEvee | Stardance
|
SpaceEvee
|
1
|
3.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-26T18:10:19Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "My very own try on the Hackpad mission. This one is called, Astropad, serving all my spacey needs!", "repo": "https://github.com/Evyvaan-Space-Lover/AstroPad_Space_Is_Cool", "demo": ""}]...
|
[{"post_id": 6793, "ts": "2026 [{"post_id": 6793, "ts": "2026-06-11T11:55:18Z", "hours": 0.3011, "text": "ASTROPAD UPDATE: i wrote the firmware for it :) (i lost a lot of time due to the Lapse problems yesterday)"}, {"post_id": 4875, "ts": "2026-06-08T13:08:32Z", "hours": 2.0747, "text": "yeah, so i made the plate and a case for it it looks BAD but my first time using fusion so ig its fine"}, {"post_id": 2700, "ts": "2026-06-05T12:18:00Z", "hours": 0.6194, "text": "AstroPad I am making a macropad that shall help in many aspects of my life. Such as space, space and space (I am planning there to be study and programming modes as well, but thats for later) The PCB holds the Microcontroller, four Keys and a pin connector for an OLED screen (for space visuals) and traces (my jokes are bad) It was my first time at making a PCB an I think I did not do a good job, but I’m happy with it."}]...
|
Title: AstroPad by @SpaceEvee | Stardance
Devlogs Title: AstroPad by @SpaceEvee | Stardance
Devlogs:
AstroPad I am making a macropad that shall help in many aspects of my life. Such as space, space and space (I am planning there to be study and programming modes as well, but thats for later) The PCB holds the Microcontroller, four Keys and a pin connector for an OLED screen (for space visuals) and traces (my jokes are bad) It was my first time at making a PCB an I think I did not do a good job, but I’m happy with it.
yeah, so i made the plate and a case for it it looks BAD but my first time using fusion so ig its fine
ASTROPAD UPDATE: i wrote the firmware for it :) (i lost a lot of time due to the Lapse problems yesterday)
Ships:
My very own try on the Hackpad mission. This one is called, Astropad, serving all my spacey needs!...
|
1792986698.018925
|
1793073098.018925
|
|
4839
|
My first slack bot! by @Namaami | Stardance
|
Namaami
|
1
|
1.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-02T17:24:42Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a 24/7 slack bot which responds to slash commands. Overall, there were no significant issues faced by me and deploying it through Nest was a very fun process", "repo": "https://github.com/Namaami/Tonic-Slack-Bot", "demo": "https://youtube.com/shorts/K4zaOL7ct4w?si=MwY-6wcEI4PT7wN7"}]...
|
[{"post_id": 882, "ts": "2026- [{"post_id": 882, "ts": "2026-06-02T16:35:38Z", "hours": 0.5411, "text": "Shipped my Stardance project: Tonic 🚀 → AI-powered Slack bot → Slash command interface → Runs 24/7 on Nest → Built with Node.js + Slack APIs Probably spent more time debugging auth tokens than writing features 😭 Worth it."}]...
|
Title: My first slack bot! by @Namaami | Stardance Title: My first slack bot! by @Namaami | Stardance
Devlogs:
Shipped my Stardance project: Tonic 🚀 → AI-powered Slack bot → Slash command interface → Runs 24/7 on Nest → Built with Node.js + Slack APIs Probably spent more time debugging auth tokens than writing features 😭 Worth it.
Ships:
I made a 24/7 slack bot which responds to slash commands. Overall, there were no significant issues faced by me and deploying it through Nest was a very fun process...
|
1792972100.4703898
|
1793058500.4703898
|
|
4843
|
Apoplexy by @czapla | Stardance
|
czapla
|
1
|
43.34
|
360
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-15T20:43:36Z", "hours": 20.0, "multiplier": 19.11, "payout": 360, "blessing": "neutral", "text": "I have reached a point in development where I can’t wait any longer to finally show everyone what I’ve been working on! The game is clearly still pretty barebones, but it is enough for a MVP. I would love to see you guys try it out, and all my progress has been THOROUGHLY documented in previous devlogs, so I encourage you to have a look at those as well! Please enjoy!", "repo": "https://github.com/dawc17/Apoplexy", "demo": "https://github.com/dawc17/Apoplexy/releases/"}]...
|
[{"post_id": 20891, "ts": "202 [{"post_id": 20891, "ts": "2026-07-02T16:51:41Z", "hours": 1.1667, "text": "APOPLEXY patch notes The one about maps Updated WIP for a new map layout! I’ve come to realize that I am not the greatest level designer, but I will try my best anyway. If anyone is interested in helping, reach out!"}, {"post_id": 20198, "ts": "2026-07-01T19:03:26Z", "hours": 1.0297, "text": "APOPLEXY patch notes The one where enemies became more alive New features Enemies now utilize a mix of custom pathfinding and Unity’s Nav Mesh system Patrol points for enemies which leads them to just walk around and chill at some spots Updated Skybox Enemy AI is fun. Until it isn’t. Try it yourself!"}, {"post_id": 20132, "ts": "2026-07-01T17:46:30Z", "hours": 2.2492, "text": "APOPLEXY patch notes The one about particles New features Raylib build-like particles using Unity’s Particle System™ Updated Touched up on UI and made the code for it cleaner. Gameplay updates coming SOON™!"}, {"post_id": 19972, "ts": "2026-07-01T13:17:59Z", "hours": 1.2689, "text": "APOPLEXY announcement The one where I apologize???? Sorry for the lack of content recently, I’ve gotten a bit busy. I don’t have much to show at the moment, but I promise some saucy stuff is in the works. You will not be disappointed!"}, {"post_id": 16415, "ts": "2026-06-26T18:20:45Z", "hours": 2.0456, "text": "APOPLEXY patch notes The one where the port was (mostly) complete. New features None! Updated Added in all missing content from the latest raylib build. (UI still in progress.) This took a while. Sorry to keep you waiting!"}, {"post_id": 14083, "ts": "2026-06-23T02:06:22Z", "hours": 5.3347, "text": "APOPLEXY patch notes The one where the universe itself was made anew. New features New PSX shader which I think looks quite nice! Worse UI! Updated Engine switch from in-house to Unity 6.5 Tweaked animations (mostly shotgun) I would say the game will soon be on complete feature parity with the Raylib version. A lot of the code was virtually the same, so this rewrite moved way quicker than I initially expected…. I already feel like I’m moving so much faster compared to my Raylib attempt."}, {"post_id": 13732, "ts": "2026-06-22T14:50:35Z", "hours": 1.3175, "text": "APOPLEXY I whipped up a quick script that would parse the old JSON levels and make them into unity scenes, and rewrote my old character controller. So far so good!"}, {"post_id": 13656, "ts": "2026-06-22T12:36:58Z", "hours": 2.6675, "text": "IMPORTANT APOPLEXY ANNOUNCEMENT Hello guys! I have come to a realization recently. That is the realization that using Raylib is holding me down. I have been trying really hard to bring my vision to life for these hours I’ve been working on it, but it’s all just taking too long. And in the end, I keep reinventing the wheel and making something that already exists (and is better) in a game engine. I also have some other frustrations with Raylib and how the library limits programmers in some ways, which I won’t go in to in this post. So, I will be porting the project to Unity! That is the tool I’m most comfortable with, and I hope it helps me to iterate faster and bring you guys some interesting gameplay soon. Here are some screenshots from the last Raylib build. See you guys soon!"}, {"post_id": 12567, "ts": "2026-06-20T14:58:52Z", "hours": 1.5383, "text": "APOPLEXY patch notes The one about levels New features Early main menu with level selector Speaking of levels, added a new level, called the “Stealth Compound” (this will not make it into the beta build lol it’s still a testing map) Updated Project updated to C++26 (from C++17) Footstep sounds (went from looping 5 second clip to separate footstep files to easier align with movement speed) Bumped version number on in-game overlay"}, {"post_id": 10926, "ts": "2026-06-17T22:04:44Z", "hours": 2.5814, "text": "APOPLEXY A ship won’t stop me from further updates ;) New features UI “framework” that helps me iterate even quicker (a bunch of stuff is still hardcoded though) Decals, more about that in a future update Slow motion win sequence for dramatic effect xd Updated Old “bio-link” panel gone, replaced by a more subtle healthbar at the bottom of the screen General codebase cleanup and removal of old files Revised PSX shader I hyperfixated a bit too much on the aesthetics, I promise that the next few updates will actually be gameplay related."}, {"post_id": 10126, "ts": "2026-06-16T18:45:37Z", "hours": 2.1403, "text": "APOPLEXY New features: Redesigned UI No updates otherwise. I spent most of this time on a quick refactor to make my life a bit easier, then sketching out a proper UI on paper. This is how it turned out:"}, {"post_id": 9472, "ts": "2026-06-15T20:34:38Z", "hours": 0.9119, "text": "APOPLEXY PRE SHIP UPDATE Some finishing touches on the enemy AI, they can now hear you a lot better when you shoot the shotty, and I added a little grace timer if you’re in the enemy field of view to get time to move out of the way. The enemy AI is still far from perfect, but I thought it good enough for a PRE PRE PRE PRE PRE PRE alpha build. :D"}, {"post_id": 9280, "ts": "2026-06-15T16:07:53Z", "hours": 2.2644, "text": "APOPLEXY New features: Weapon swapping animation Shotgun reload rework Quick melee system (+ shotgun reload pushback and damage) Live noise testing for enemy AI Updated: Smarter AI, react to noise and being hurt Platform-agnostic build system (except macOS) I’ve now decided a bit more on the direction of this game. I want to create an atmospheric stealth first person shooter, with a big emphasis on the stealth part, and optionally a “go loud” playstyle. Expect future updates to work towards that goal!"}, {"post_id": 7633, "ts": "2026-06-12T19:10:59Z", "hours": 3.2106, "text": "APOPLEXY New features: New “Killhouse” map featuring some cheap lighting and wonky walls! New enemy pathfinding built from the ground up (ability to walk around walls and avoid clumping into eachother) Eyes. Dynamic spread on all weapons based on horizontal movement speed New shotgun utilizing this spread system, shoots multiple pellets that have random spread New dynamic crosshair More sounds Updated: Idle animation"}, {"post_id": 6364, "ts": "2026-06-10T18:34:08Z", "hours": 1.9408, "text": "APOPLEXY New features: Whole new audio system with 3D audio Sound effects for footsteps, shooting, reloading and hitting enemies Updated: A few collision bugs Other: Started logging my progress on TikTok (czapladaw67) and YouTube (ironfistdaw) as well. the project is looking more and more like a game every day, really proud of it so far. 😇"}, {"post_id": 5642, "ts": "2026-06-09T14:51:32Z", "hours": 0.9933, "text": "APOPLEXY New features: Skybox Updated pistol model, longer reload time Updated: World shader i had a lot of fun adding the skybox, and i think the new model looks SO sick"}, {"post_id": 5504, "ts": "2026-06-09T09:45:07Z", "hours": 2.1825, "text": "added some proper lighting (after a struggle) and some more editor QOL. it’s all coming along very nicely, check out the video below. (also refactored weapon system for futureproofing and more)"}, {"post_id": 4926, "ts": "2026-06-08T15:08:11Z", "hours": 1.8544, "text": "improved the level editor with some easier controls and a new orbital camera instead of orthographic projection, and added raygui to make selections easier. also refined the movement, headbob and weapon sway!"}, {"post_id": 4813, "ts": "2026-06-08T10:00:38Z", "hours": 1.7911, "text": "added a crude level editor controlled with the keyboard! it loads and saves json files that you can edit and then save with f6 in game (or manually if youd like.) im very proud of this one!"}, {"post_id": 2418, "ts": "2026-06-04T21:47:19Z", "hours": 0.6542, "text": "video below, but i added some visual candy to the project. i like my games to feel niceeee"}, {"post_id": 2393, "ts": "2026-06-04T21:00:10Z", "hours": 0.5369, "text": "i added some blood particles to the blood prisms that try to kill you with a custom particle system i wrote"}, {"post_id": 2365, "ts": "2026-06-04T20:24:48Z", "hours": 0.8644, "text": "finally finished the muzzle flash. it was suuuch a pain but adds a lot to the feel of the gun."}, {"post_id": 2329, "ts": "2026-06-04T19:23:19Z", "hours": 1.1958, "text": "added hitflash, started working on muzzle flash but disabled for now. also rethinking if the game should be black and white so its disabled for now."}, {"post_id": 862, "ts": "2026-06-02T16:02:18Z", "hours": 0.6136, "text": "i tweaked the shader some more because the other one was an unreadable mess. also added display of current position, will be useful for later! next, i want to work on more of the actual gameplay, i think this look is fine for now (maybe ill make the enemies fully white with a black outline)"}, {"post_id": 812, "ts": "2026-06-02T14:23:08Z", "hours": 1.2922, "text": "I got some hit detection and crude logging up (std::cout). The game is coming along nicely, and raylib is so pleasant to work with. [NOTE: this project was started yesterday when i found out about stardance]"}]...
|
Title: Apoplexy by @czapla | Stardance
Devlogs:
I Title: Apoplexy by @czapla | Stardance
Devlogs:
I got some hit detection and crude logging up (std::cout). The game is coming along nicely, and raylib is so pleasant to work with. [NOTE: this project was started yesterday when i found out about stardance]
i tweaked the shader some more because the other one was an unreadable mess. also added display of current position, will be useful for later! next, i want to work on more of the actual gameplay, i think this look is fine for now (maybe ill make the enemies fully white with a black outline)
added hitflash, started working on muzzle flash but disabled for now. also rethinking if the game should be black and white so its disabled for now.
finally finished the muzzle flash. it was suuuch a pain but adds a lot to the feel of the gun.
i added some blood particles to the blood prisms that try to kill you with a custom particle system i wrote
video below, but i added some visual candy to the project. i like my games to feel niceeee
added a crude level editor controlled with the keyboard! it loads and saves json files that you can edit and then save with f6 in game (or manually if youd like.) im very proud of this one!
improved the level editor with some easier controls and a new orbital camera instead of orthographic projection, and added raygui to make selections easier. also refined the movement, headbob and weapon sway!
added some proper lighting (after a struggle) and some more editor QOL. it’s all coming along very nicely, check out the video below. (also refactored weapon system for futureproofing and more)
APOPLEXY New features: Skybox Updated pistol model, longer reload time Updated: World shader i had a lot of fun adding the skybox, and i think the new model looks SO sick
APOPLEXY New features: Whole new audio system with 3D audio Sound effects for footsteps, shooting, reloading and hitting enemies Updated: A few collision bugs Other: Started logging my progress on TikTok (czapladaw67) and YouTube (ironfistdaw) as well. the project is looking more and more like a game every day, really proud of it so far. 😇
APOPLEXY New features: New “Killhouse” map featuring some cheap lighting and wonky walls! New enemy pathfinding built from the ground up (ability to walk around walls and avoid clumping into eachother) Eyes. Dynamic spread on all weapons based on horizontal movement speed New shotgun utilizing this spread system, shoots multiple pellets that have random spread New dynamic crosshair More sounds Updated: Idle animation
APOPLEXY New features: Weapon swapping animation Shotgun reload rework Quick melee system (+ shotgun reload pushback and damage) Live noise testing for enemy AI Updated: Smarter AI, react to noise and being hurt Platform-agnostic build system (except macOS) I’ve now decided a bit more on the direction of this game. I want to create an atmospheric stealth first person shooter, with a big emphasis on the stealth part, and optionally a “go loud” playstyle. Expect future updates to work towards that goal!
APOPLEXY PRE SHIP UPDATE Some finishing touches on the enemy AI, they can now hear you a lot better when you shoot the shotty, and I added a little grace timer if you’re in the enemy field of view to get time to move out of the way. The enemy AI is still far from perfect, but I thought it good enough for a PRE PRE PRE PRE PRE PRE alpha build. :D
APOPLEXY New features: Redesigned UI No updates otherwise. I spent most of this time on a quick refactor to make my life a bit easier, then sketching out a proper UI on paper. This is how it turned out:
APOPLEXY A ship won’t stop me from further updates ;) New features UI “framework” that helps me iterate even quicker (a bunch of stuff is still hardcoded though) Decals, more about that in a future update Slow motion win sequence for dramatic effect xd Updated Old “bio-link” panel gone, replaced by a more subtle healthbar at the bottom of the screen General codebase cleanup and removal of old files Revised PSX shader I hyperfixated a bit too much on the aesthetics, I promise that the next few updates will actually be gameplay related.
APOPLEXY patch notes The one about levels New features Early main menu with level selector Speaking of levels, added a new level, called the “Stealth Compound” (this will not make it into the beta build lol it’s still a testing map) Updated Project updated to C++26 (from C++17) Footstep sounds (went from looping 5 second clip to separate footstep files to easier align with movement speed) Bumped version number on in-game overlay
IMPORTANT APOPLEXY ANNOUNCEMENT Hello guys! I have come to a realization recently. That is the realization that using Raylib is holding me down. I have been trying really hard to bring my vision to life for these hours I’ve been working on it, but it’s all just taking too long. And in the end, I keep reinventing the wheel and making something that already exists (and is better) in a game engine. I also have some other frustrations with Raylib and how the library limits programmers in some ways, which I won’t go in to in this post. So, I will be porting the project to Unity! That is the tool I’m most comfortable with, and I hope it helps me to iterate faster and bring you guys some interesting gameplay soon. Here are some screenshots from the last Raylib build. See you guys soon!
APOPLEXY I whipped up a quick script that would parse the old JSON levels and make them into unity scenes, and rewrote my old character controller. So far so good!
APOPLEXY patch notes The one where the universe itself was made anew. New features New PSX shader which I think looks quite nice! Worse UI! Updated Engine switch from in-house to Unity 6.5 Tweaked animations (mostly shotgun) I would say the game will soon be on complete feature parity with the Raylib version. A lot of the code was virtually the same, so this rewrite moved way quicker than I initially expected…. I already feel like I’m moving so much faster compared to my Raylib attempt.
APOPLEXY patch notes The one where the port was (mostly) complete. New features None! Updated Added in all missing content from the latest raylib build. (UI still in progress.) This took a while. Sorry to keep you waiting!
APOPLEXY announcement The one where I apologize???? Sorry for the lack of content recently, I’ve gotten a bit busy. I don’t have much to show at the moment, but I promise some saucy stuff is in the works. You will not be disappointed!
APOPLEXY patch notes The one about particles New features Raylib build-like particles using Unity’s Particle System™ Updated Touched up on UI and made the code for it cleaner. Gameplay updates coming SOON™!
APOPLEXY patch notes The one where enemies became more alive New features Enemies now utilize a mix of custom pathfinding and Unity’s Nav Mesh system Patrol points for enemies which leads them to just walk around and chill at some spots Updated Skybox Enemy AI is fun. Until it isn’t. Try it yourself!
APOPLEXY patch notes The one about maps Updated WIP for a new map layout! I’ve come to realize that I am not the greatest level designer, but I will try my best anyway. If anyone is interested in helping, reach out!
Ships:
I have reached a point in development where I can’t wait any longer to finally show everyone what I’ve been working on! The game is clearly still pretty barebones, but it is enough for a MVP. I would love to see you guys try it out, and all my progress has been THOROUGHLY documented in previous devlogs, so I encourage you to have a look at those as well! Please enjoy!...
|
1792975779.178711
|
1793062179.178711
|
|
4852
|
Public Transportation Map by @ray120424 | Stardanc Public Transportation Map by @ray120424 | Stardance...
|
ray120424
|
1
|
0.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-03T05:34:11Z", "hours": 0.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I just create taichung, kaohsiung MRT and Taiwan High Speed Rail in my map.", "repo": "https://github.com/HaKexva/public_transportation_map", "demo": "https://public-transportation-map.up.railway.app/"}]...
|
[{"post_id": 786, "ts": "2026- [{"post_id": 786, "ts": "2026-06-02T13:35:31Z", "hours": 0.4342, "text": "Create Taichung and Kaohsiung MRT"}]...
|
Title: Public Transportation Map by @ray120424 | S Title: Public Transportation Map by @ray120424 | Stardance
Devlogs:
Create Taichung and Kaohsiung MRT
Ships:
I just create taichung, kaohsiung MRT and Taiwan High Speed Rail in my map....
|
1792972494.3257515
|
1793058894.3257515
|
|
4859
|
Nook by @Eleco | Stardance
|
Eleco
|
1
|
39.85
|
57
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-06T00:24:19Z", "hours": 5.0, "multiplier": 10.72, "payout": 57, "blessing": "neutral", "text": "I have made the MVP (Just the skeleton) of a Focus/Study app Called Nook! I really hope this will get further more developed, and aiming to work on it alongside YC, and here in StarDance, I will activelly share and blog about my progress over the app, and when i’ll finalize the design and the underlying engineering of the way I’ll treat the problem of distraction and also “Working with understimulation” unlike Duolingo or other study apps that rewards you with small dopamine bursts, this app will focus solelly on self fulfilment, deep focus and also a niche community where students and builders could get to connect and work together too!", "repo": "https://github.com/adamsaou/Nook", "demo": "https://nook-study.vercel.app"}]...
|
[{"post_id": 28847, "ts": "202 [{"post_id": 28847, "ts": "2026-07-15T12:04:56Z", "hours": 22.7239, "text": "So Hello stardance! These days have been GRUELLING, and honestly I post right now because for the past month, i was not only working on Nook, but carefully using every single feedback from the rating as seriously as possible :D Updates: -Was accepted as the only teenager in Morocco onto the biggest AI hackathon in the COUNTRY called “RallyAI” -I got myself a Co-founder on this project, since after careful consideration, I realised very few people actually TRY to tackle the problem of ‘Focus’ in a wholistic point of view, and I am here for it! -Also (sadly) I started Using AI more for developpement, since the project will be a BIG monorepo project, and also to accelerate the rate of not only deliverring features, but also trying to make this and official solution to focus in our world. This might seem very “delusional” and “unrealistic” But I really DO believe on it working, not for me as a project or a potential start-up, but as a solution in our real world :D Also, yes VOICE ROOMS ARE HOSTED VIA MY OWN TURN SERVERS :D (totally didn’t spend days fixing my laptops, and also learning about WebRTC, and also configuring both laptops to ACTUALLY stay alive lol) Also, again, Thanks you Stardance for letting me have a chance to build something that MATTERS <3 (Cool funny pic where i was being interviewed :p )"}, {"post_id": 9844, "ts": "2026-06-16T09:32:58Z", "hours": 3.8489, "text": "After a LOT of hustle and bustle, I present to you: Nook’s (current) TURN servers! Also while researching about WebRTC and Peer-to-Peer connections, I found out i can just host my own TURN servers locally, and honestly, they are doing their job well! I tested with a lot of friends and realised these bad boys can support approximately more than 1000-2000 people in different voice rooms :O Crazy for real, now onto working to finish off the MVP and also making new changes, also refining the source code’s licence, then after the MVP is made, I will work on cross-platform support!"}, {"post_id": 6214, "ts": "2026-06-10T13:15:01Z", "hours": 5.8294, "text": "YES, TOOK ME 5 HOURS FOR MY 1ST LAPTOP TO WORK AND FINALLY BOOTED Xubuntu ON IT Also for info, I am currently configuring 2 of my old Laptops to be the server for my Website, and in the future an entire software Ecosystem for my project called “Nook”! The specs of the Laptops of my “Pheonix Server”: HP ProBook 640 G1: CPU: i5-4300M 2.60Ghz RAM: 8gb GPU: Integrated Intel HD graphics 4600 Storage: 250gb -LG A530: CPU: i7-2630QM 2.0Ghz RAM: 6gb GPU: NVIDIA GeForce dedicated AND a GT 555M Also I will name the “Pheonix x” of each ‘new’ additions to my (future) servers will be called in order of which on was setten up :D"}, {"post_id": 4405, "ts": "2026-06-07T18:41:39Z", "hours": 2.4506, "text": "Finally made the voice rooms feature on Nook 😍 Now I will keep on testing locally, to keep fishing for potential bugs, and also try to tackle optimization and also stress test that feature 👍"}, {"post_id": 3099, "ts": "2026-06-06T00:20:34Z", "hours": 2.7864, "text": "Nook is FINALLY and offcially alive. Spent this last session locking down the core framework because I’m tired of productivity apps that treat your brain like a slot machine with streaks and badges. Built this for pure understimulation and fast starts. Next.js + Supabase stack is running smoothly. Check the live demo link! https://nook-study.vercel.app"}, {"post_id": 2244, "ts": "2026-06-04T17:03:09Z", "hours": 2.5883, "text": "Hello StarDance! I am currently working on a simple student app, generic right? Well, Nook is different, why you may ask? Because I am actively designing it in such way that it will make the essence of studying and working on “something” more productive and LESS stimulating; unlike for example DuoLingo, where small dopamine bursts and streaks, and an “addictive” based design to keep you engaged and dependent on their app, my website (even app in the future) is going to focus on accountability, responsibility, calm and the social essence! So far, I am still developing the MVP and actively working on developing a core theme of the website! Later, I would love to get feedback on usage and also how can I improve it Also thank you StarDance for this wonderful opportunity to get creative, and create"}]...
|
Title: Nook by @Eleco | Stardance
Devlogs:
Hello Title: Nook by @Eleco | Stardance
Devlogs:
Hello StarDance! I am currently working on a simple student app, generic right? Well, Nook is different, why you may ask? Because I am actively designing it in such way that it will make the essence of studying and working on “something” more productive and LESS stimulating; unlike for example DuoLingo, where small dopamine bursts and streaks, and an “addictive” based design to keep you engaged and dependent on their app, my website (even app in the future) is going to focus on accountability, responsibility, calm and the social essence! So far, I am still developing the MVP and actively working on developing a core theme of the website! Later, I would love to get feedback on usage and also how can I improve it Also thank you StarDance for this wonderful opportunity to get creative, and create
Nook is FINALLY and offcially alive. Spent this last session locking down the core framework because I’m tired of productivity apps that treat your brain like a slot machine with streaks and badges. Built this for pure understimulation and fast starts. Next.js + Supabase stack is running smoothly. Check the live demo link! https://nook-study.vercel.app
Finally made the voice rooms feature on Nook 😍 Now I will keep on testing locally, to keep fishing for potential bugs, and also try to tackle optimization and also stress test that feature 👍
YES, TOOK ME 5 HOURS FOR MY 1ST LAPTOP TO WORK AND FINALLY BOOTED Xubuntu ON IT Also for info, I am currently configuring 2 of my old Laptops to be the server for my Website, and in the future an entire software Ecosystem for my project called “Nook”! The specs of the Laptops of my “Pheonix Server”: HP ProBook 640 G1: CPU: i5-4300M 2.60Ghz RAM: 8gb GPU: Integrated Intel HD graphics 4600 Storage: 250gb -LG A530: CPU: i7-2630QM 2.0Ghz RAM: 6gb GPU: NVIDIA GeForce dedicated AND a GT 555M Also I will name the “Pheonix x” of each ‘new’ additions to my (future) servers will be called in order of which on was setten up :D
After a LOT of hustle and bustle, I present to you: Nook’s (current) TURN servers! Also while researching about WebRTC and Peer-to-Peer connections, I found out i can just host my own TURN servers locally, and honestly, they are doing their job well! I tested with a lot of friends and realised these bad boys can support approximately more than 1000-2000 people in different voice rooms :O Crazy for real, now onto working to finish off the MVP and also making new changes, also refining the source code’s licence, then after the MVP is made, I will work on cross-platform support!
So Hello stardance! These days have been GRUELLING, and honestly I post right now because for the past month, i was not only working on Nook, but carefully using every single feedback from the rating as seriously as possible :D Updates: -Was accepted as the only teenager in Morocco onto the biggest AI hackathon in the COUNTRY called “RallyAI” -I got myself a Co-founder on this project, since after careful consideration, I realised very few people actually TRY to tackle the problem of ‘Focus’ in a wholistic point of view, and I am here for it! -Also (sadly) I started Using AI more for developpement, since the project will be a BIG monorepo project, and also to accelerate the rate of not only deliverring features, but also trying to make this and official solution to focus in our world. This might seem very “delusional” and “unrealistic” But I really DO believe on it working, not for me as a project or a potential start-up, but as a solution in our real world :D Also, yes VOICE ROOMS ARE HOSTED VIA MY OWN TURN SERVERS :D (totally didn’t spend days fixing my laptops, and also learning about WebRTC, and also configuring both laptops to ACTUALLY stay alive lol) Also, again, Thanks you Stardance for letting me have a chance to build something that MATTERS <3 (Cool funny pic where i was being interviewed :p )
Ships:
I have made the MVP (Just the skeleton) of a Focus/Study app Called Nook! I really hope this will get further more developed, and aiming to work on it alongside YC, and here in StarDance, I will activelly share and blog about my progress over the app, and when i’ll finalize the design and the underlying engineering of the way I’ll treat the problem of distraction and also “Working with understimulation” unlike Duolingo or other study apps that rewards you with small dopamine bursts, this app will focus solelly on self fulfilment, deep focus and also a niche community where students and builders could get to connect and work together too!...
|
1792972455.7596536
|
1793058855.7596536
|
|
4874
|
OrangeDL by @MisplacedOrange | Stardance
|
MisplacedOrange
|
1
|
14.35
|
118
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-13T00:41:54Z", "hours": 9.0, "multiplier": 16.59, "payout": 118, "blessing": "neutral", "text": "I think debugging was the toughest part definitely, everything was breaking at one point", "repo": "https://github.com/MisplacedOrange/OrangeDL", "demo": "https://github.com/misplacedorange/orangedl/releases/latest/download/orangedl.exe"}]...
|
[{"post_id": 17371, "ts": "202 [{"post_id": 17371, "ts": "2026-06-28T04:03:16Z", "hours": 3.4125, "text": "Refactoring some unnecessary code Forgot to mention: Updated Github README Added a Contributing MD (not updated yet) accidently broke the window dragging Rust 🦀minor fixes boring stuff: Deleted UpdateSettingsRequest Function and related calls Deleted leftover SVG Deleted normalize_theme function Unused tests Debugging CI workflow Tiny other chores NEXT: Fix UI – Placeholder rn (Forgive me for the vibecoded UI 😳😳) update all the documentation"}, {"post_id": 12107, "ts": "2026-06-19T19:36:20Z", "hours": 1.9406, "text": "Added move and resume actions for completed downloads, in the UI and as new Tauri commands Fixed a task-leak bug: a panicking download task could leave a stale entry in the running-tasks map, permanently blocking resume and consuming a concurrency slot. Other Security + Vulnerability Fixes Chores"}, {"post_id": 7759, "ts": "2026-06-12T23:17:15Z", "hours": 6.5586, "text": "Adds five built-in color themes (Creamsicle, Midnight Marmalade, Peach Fizz, Mint Squeeze, Bubblegum) with instant apply and DB persistence. Adds yt-dlp video download support via a new media_extractor module and VideoDownloadModal: automatic yt-dlp detection and install, thumbnail preview, quality selector, and progress tracking. Adds settings export/import as JSON. Bug fixes: resume now re-fetches the full file when ETag/Last-Modified changes on the server; progress events no longer overwrite terminal download states; app settings are loaded in a single batched DB query."}, {"post_id": 2863, "ts": "2026-06-05T18:44:51Z", "hours": 2.8753, "text": "Updated Github Repo description README"}]...
|
Title: OrangeDL by @MisplacedOrange | Stardance
D Title: OrangeDL by @MisplacedOrange | Stardance
Devlogs:
Updated Github Repo description README
Adds five built-in color themes (Creamsicle, Midnight Marmalade, Peach Fizz, Mint Squeeze, Bubblegum) with instant apply and DB persistence. Adds yt-dlp video download support via a new media_extractor module and VideoDownloadModal: automatic yt-dlp detection and install, thumbnail preview, quality selector, and progress tracking. Adds settings export/import as JSON. Bug fixes: resume now re-fetches the full file when ETag/Last-Modified changes on the server; progress events no longer overwrite terminal download states; app settings are loaded in a single batched DB query.
Added move and resume actions for completed downloads, in the UI and as new Tauri commands Fixed a task-leak bug: a panicking download task could leave a stale entry in the running-tasks map, permanently blocking resume and consuming a concurrency slot. Other Security + Vulnerability Fixes Chores
Refactoring some unnecessary code Forgot to mention: Updated Github README Added a Contributing MD (not updated yet) accidently broke the window dragging Rust 🦀minor fixes boring stuff: Deleted UpdateSettingsRequest Function and related calls Deleted leftover SVG Deleted normalize_theme function Unused tests Debugging CI workflow Tiny other chores NEXT: Fix UI – Placeholder rn (Forgive me for the vibecoded UI 😳😳) update all the documentation
Ships:
I think debugging was the toughest part definitely, everything was breaking at one point...
|
1792972226.8536415
|
1793058626.8536415
|
|
4881
|
Media Review Webpage by @nic | Stardance
|
nic
|
1
|
5.0
|
41
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-07-24T01:00:17Z", "hours": 5.0, "multiplier": 8.68, "payout": 41, "blessing": "neutral", "text": "A small webpage built with HTML, CSS, and a speck of JavaScript for my personal TV show/movie anime reviews! Inspired by old website aesthetics from the y2k era. Presented like a personal blog, and used to track my currently watched/watching shows as well as occasionally sharing my thoughts about recently finished movies. [created in mind with the indie web movement on neocities]", "repo": "https://github.com/sodahaunted/sodahaunt.reviews", "demo": "https://sodahaunt.neocities.org/reviews"}]...
|
[{"post_id": 33196, "ts": "202 [{"post_id": 33196, "ts": "2026-07-22T21:44:56Z", "hours": 1.7128, "text": "Media Review Webpage #3 After a long time procrastinating, I’m finally done with the concept/prototype of my webpage. I wrote one full review for a recent movie I watched (Obsession), formatted it, added photos, and made sure the two lines of JavaScript code work properly. Not sure how to add more pages, though. I’ll figure that out for a future update (though if you know how, please lmk) The fundamentals of this page are pretty much finished! It has a watchlist which I can use to track shows/movies I’m watching, a (mostly) responsive layout, and all the CSS features I intended to add. Unfortunately lost an hour or two here and there because I forgot to unpause my recording, but oh well. The GIT repo for this page unfortunately doesn’t have many commits, since I wasn’t using GitHub to make this and was pretty unfamiliar with it when I started this project. It has all the code, just no visible edits/changes. Sorry about that. I used Neocities for the entirety of this site, which is what I mainly use to publish html/css projects."}, {"post_id": 15446, "ts": "2026-06-25T03:17:46Z", "hours": 2.5336, "text": "Media Review Webpage | Devlog #2 After a long hiatus, I came back to this project with a bit more motivation and inspiration than last time. I had a ton of ideas for what I wanted to do, but I wasn’t sure my skill level was high enough to program them. I only know HTML, CSS, and a bit of JavaScript, so even doing small things like showing/hiding elements takes me a long time. Challenges I wanted to make multiple pages using just one HTML file, since I wasn’t sure how many reviews I’d end up writing, and I wanted everything to be in one document. I got the text at the bottom to work properly like I wanted to, but I still don’t know how to show/hide more than one element at a time. Using Flexbox was also a pain since my images never resize how I want them to, and I want to make this page mobile-friendly. I might look back at my code from a previous project to try and figure that out in the next devlog. Additions I mainly focused on resizing everything to look a bit cleaner, and also because the previous layout was just a 500px box that barely showed any info. I changed the banner at the top and the background to something more library-themed."}, {"post_id": 4603, "ts": "2026-06-07T23:28:41Z", "hours": 0.5278, "text": "Media Review Webpage | Devlog #1 I had an idea for a while to make my own movie review/blog page, but I never really got around to doing it. Stardance was a good excuse for me to start making a lot of projects I’d procrastinated on for the past few months. short update to test lapse/hackatime changed the colours and fixed some sizing issues, planning to replace the photos and redo the actual layout next The majority of the code is carried over from a previous project I started in the past, which I’m planning to revamp and complete during Stardance."}]...
|
Title: Media Review Webpage by @nic | Stardance
D Title: Media Review Webpage by @nic | Stardance
Devlogs:
Media Review Webpage | Devlog #1 I had an idea for a while to make my own movie review/blog page, but I never really got around to doing it. Stardance was a good excuse for me to start making a lot of projects I’d procrastinated on for the past few months. short update to test lapse/hackatime changed the colours and fixed some sizing issues, planning to replace the photos and redo the actual layout next The majority of the code is carried over from a previous project I started in the past, which I’m planning to revamp and complete during Stardance.
Media Review Webpage | Devlog #2 After a long hiatus, I came back to this project with a bit more motivation and inspiration than last time. I had a ton of ideas for what I wanted to do, but I wasn’t sure my skill level was high enough to program them. I only know HTML, CSS, and a bit of JavaScript, so even doing small things like showing/hiding elements takes me a long time. Challenges I wanted to make multiple pages using just one HTML file, since I wasn’t sure how many reviews I’d end up writing, and I wanted everything to be in one document. I got the text at the bottom to work properly like I wanted to, but I still don’t know how to show/hide more than one element at a time. Using Flexbox was also a pain since my images never resize how I want them to, and I want to make this page mobile-friendly. I might look back at my code from a previous project to try and figure that out in the next devlog. Additions I mainly focused on resizing everything to look a bit cleaner, and also because the previous layout was just a 500px box that barely showed any info. I changed the banner at the top and the background to something more library-themed.
Media Review Webpage #3 After a long time procrastinating, I’m finally done with the concept/prototype of my webpage. I wrote one full review for a recent movie I watched (Obsession), formatted it, added photos, and made sure the two lines of JavaScript code work properly. Not sure how to add more pages, though. I’ll figure that out for a future update (though if you know how, please lmk) The fundamentals of this page are pretty much finished! It has a watchlist which I can use to track shows/movies I’m watching, a (mostly) responsive layout, and all the CSS features I intended to add. Unfortunately lost an hour or two here and there because I forgot to unpause my recording, but oh well. The GIT repo for this page unfortunately doesn’t have many commits, since I wasn’t using GitHub to make this and was pretty unfamiliar with it when I started this project. It has all the code, just no visible edits/changes. Sorry about that. I used Neocities for the entirety of this site, which is what I mainly use to publish html/css projects.
Ships:
A small webpage built with HTML, CSS, and a speck of JavaScript for my personal TV show/movie anime reviews! Inspired by old website aesthetics from the y2k era. Presented like a personal blog, and used to track my currently watched/watching shows as well as occasionally sharing my thoughts about recently finished movies. [created in mind with the indie web movement on neocities]...
|
1793054939.9933853
|
1793141339.9933853
|
|
4884
|
Spottr by @BrunoGG | Stardance
|
BrunoGG
|
1
|
49.59
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-16T18:36:43Z", "hours": 47.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "SPOTTR is an open-source indoor presence tracking system built on ESP32-C3 and Bluetooth Low Energy. Wear a badge, walk into a room, show up on the map.", "repo": "https://github.com/BrunoGG69/Spottr", "demo": ""}]...
|
[{"post_id": 77148, "ts": "202 [{"post_id": 77148, "ts": "2026-10-05T19:42:35Z", "hours": 2.5883, "text": "DEVLOG #9 - BADGE CASE REDESIGNED, PRINTED AND ASSEMBLED Website : https://spottr.brunogg.in Work Done: Redesigned the badge enclosure from scratch in Fusion 360 to fit the new battery, which got thicker but smaller in footprint while the badge had to stay credit-card sized at 86 x 54 mm Made the whole model parametric , so every dimension falls out of a handful of named values and the next component change is a one-number edit instead of another rebuild Added the Spottr logo embossed on the lid and a USB-C cutout sized off the actual connector Got it printed through #printing-legion and it came out clean Assembled the hardware into it : XIAO ESP32-C3, LiPo and status LED all sit flat in the cavity with the lid seating properly on top"}, {"post_id": 48356, "ts": "2026-08-16T17:46:13Z", "hours": 5.61, "text": "DEVLOG #8 - MQTT AUTH, POWER-FAILURE RECOVERY, DASHBOARD REDESIGNED FROM SCRATCH Website : https://spottr.brunogg.in Work Done: Added MQTT username and password support across the whole stack. The captive portal now has optional auth fields, the credentials save to NVS with the rest of the config, and the pi-bridge authenticates the same way. Leaving them blank keeps the old anonymous behaviour, so nothing broke for existing setups Fixed a bug where every scanner broadcast the same setup network name . The AP name is built from the last two bytes of the device MAC, but it was being read from the WiFi driver before the interface existed, so every board came up as Spottr-Scanner-0000 . Reading the MAC directly from efuse fixed it, and each scanner now shows its real suffix, unique per device and stable across reboots Fixed a power-failure recovery bug that only showed up in the real deployment. When the power came back, the scanners booted in about two seconds but the router took closer to a minute, so the scanners found no network, assumed they were unconfigured, and dropped into the config portal. Every node had to be manually restarted. The logic was treating “can’t connect right now” as “isn’t set up”. Now a scanner with credentials in NVS retries WiFi indefinitely and only ever opens the portal if there are genuinely no credentials or the command is given over serial Added a WiFi watchdog to the main loop, so a dropout during normal operation reconnects on its own instead of leaving the scanner stuck retrying MQTT over a dead network Fixed the OTA status LED never actually animating . ledSet() only records the state, and the pin write happens in ledUpdate() , which runs from the main loop, but the OTA download blocks that loop entirely. So the LED just froze at whatever brightness it had. Driving it from httpUpdate ’s progress callback fixed it, and the pattern is twice as fast now so a quick update is still visible Redesigned the dashboard from scratch. Went for a design language closer to Nothing and Apple’s dark mode, so the whole thing is monochrome with mono uppercase labels, thin tabular numerals and a lot of empty space. Stripped out the animated gradient orbs, the dot-grid background and the glassmorphism, since that look is everywhere now and reads as generic. Cards are visible because they’re lighter than the page rather than because they have a border, and colour only appears where it means something, so a room lighting up when someone walks in is the only saturated thing on screen Rebuilt the Overview page as three columns, with stats and occupied rooms on the left, the floor map in the middle, and a badge rail on the right where every badge can be searched, edited, disabled or deleted without leaving the page. Added pan and zoom to the map Fixed a bug where any badge added through the dashboard would never show a location. New badges were saved with an uppercase MAC while the pi-bridge writes location keys in lowercase, so the two never matched. Pulled the MAC handling into a shared module so both pages normalise the same way Replaced the component-library sidebar with a custom animated one , and moved the shared liveness and badge logic into lib/status.js and lib/badges.js . The duplicated copies of that logic are exactly what let the floor map and the overview page drift apart and disagree about which scanners were online Future Work Build the Scanners Management page to assign rooms to auto-registered scanners and a Logs Page to view the history of every action performed Add offline buffering to the scanner firmware so badge detections aren’t lost if WiFi drops, and flush them once reconnected Add checksum verification to the OTA process so a corrupted download can’t be flashed to a scanner"}, {"post_id": 30368, "ts": "2026-07-17T20:52:22Z", "hours": 7.6561, "text": "DEVLOG #7 - OTA FULLY IMPLEMENTED WITH AUTO-UPDATES, CAPTIVE PORTAL ADDED, FIRMWARE REFACTORED & STATUS LED Website : https://spottr.brunogg.in Work Done: Fully implemented Over-The-Air (OTA) updates for the scanner nodes. The pi-bridge watches Firebase for a new firmware version and publishes it over MQTT, each scanner compares it against its own version and only updates if it’s newer, then downloads, flashes and reboots itself. The version check runs on each scanner, so one publish updates every outdated node automatically Set up automatic releases using a GitHub Action, so publishing a new release on GitHub writes the version and download URL to Firebase on its own, which then cascades down to every scanner. Now a single release publish updates the whole fleet with no manual steps Added a WiFi captive portal for first-time scanner setup. On first boot the scanner hosts its own network and serves a 4-step wizard (name the room, connect WiFi, set the broker, confirm) styled to match the website. Config is saved to NVS after every step and the portal won’t let a scanner boot into normal mode until setup is fully complete, so one firmware image now works for every scanner without editing code Refactored the scanner firmware from one large file into separate modules ( config , portal , scanner , ota , led and globals ) for cleaner, more maintainable code Added a status LED on the scanner so its state can be read at a glance without a serial monitor - blinking while connecting, solid when online, a slow breathing fade while in the config portal, and a distinct pattern during an OTA update Fixed a bug where the dashboard counted an offline scanner as online, by trusting the health status set by the pi-bridge instead of guessing from the last-seen timestamp Future Work Build the Scanners Management page to assign rooms to auto-registered scanners and a Logs Page to view the history of every action performed Add offline buffering to the scanner firmware so badge detections aren’t lost if WiFi drops, and flush them once reconnected Add checksum verification to the OTA process so a corrupted download can’t be flashed to a scanner"}, {"post_id": 17080, "ts": "2026-06-27T18:48:35Z", "hours": 7.1619, "text": "DEVLOG #6 - SCANNER HEALTH CHECKS IMPLEMENTED, IDENTIFY SCANNERS VIA MAC, BADGE MANAGEMENT & OTA GROUNDWORK SET Website : https://spottr.brunogg.in Work Done: Built an active scanner health-check system - pi-bridge pings each scanner every 15s over MQTT, scanner replies with a pong , and a missed pong marks it offline within a few seconds. This replaced the old passive system where the scanner sent a heartbeat every 30 seconds to update its status Switched scanner identity to its MAC Address . with the pi-bridge verifying each scanner’s MAC and registering unknown scanners into Firebase as unassigned Refactored pi-bridge from one single large file into multiple sub-files ( config.py , handlers.py , health.py , presence.py , registry.py , state.py and main.py ) Started work on the Badges Management Page where the admin can add, edit, delete or enable/disable badges , where each row shows the live status of each badge as online/offline and current room, along with confirmation dialog boxes for destructive actions like deletion or disabling badges Laid the groundwork for OTA firmware updates for the scanner nodes, where I switched the scanner partition table to support two app slots, added semantic version tracking and comparison, and wrote the OTA update function (yet to be implemented properly) Future Work Fully implement the OTA function where the pi-bridge triggers the update by publishing the new firmware version over MQTT and automatically flash it to the scanners Add a captive portal where the scanners can be configured (Adding WiFi and Scanner IDs) without editing the code Build the Scanners Management page to assign rooms to auto-registered scanners and Logs Page to view history of every action performed"}, {"post_id": 12997, "ts": "2026-06-21T07:48:49Z", "hours": 5.1617, "text": "DEVLOG #5 — STARTED WORK ON ADMIN DASHBOARD, IMPLEMENTED LIVE FLOOR MAP Website: https://spottr.brunogg.in Work Done: Started work on the admin dashboard Built the floor map feature and made it show in which room a badge is currently in Live badge dots render directly on the floor map, positioned in the room they were last detected in Added StatCards to the Overview page -> Badges Online, Scanners Online, Rooms Occupied, Total Badges Future Work Add dynamically updating status for scanners where pi-bridge sends a heartbeat and scanner-node responds to it Add sections to admin dashboard to add, remove or manage badges and scanners, along with a logs section to log any changes"}, {"post_id": 9494, "ts": "2026-06-15T20:54:45Z", "hours": 5.8011, "text": "DEVLOG #4 - LOGIN PAGE, BUG FIXES AND OVERHALL BADGE AND SCANNER FIRMWARE ALONG WITH CHANGES IN PI-BRIDGE Website: https://spottr.brunogg.in Work Done: Implemented a login page with Firebase Auth which supports but Google Sign-In as well as via Email & Password (Added a test user with its credentials posted on login page for future testing and for public showcase of the project) Added Protected routes - dashboard will remain inaccessible without logging in Switched the badge identification from using device_id ex. SPOTTR_BADGE_0XX to a MAC Address based identification coz its much more reliable and harder to spook Fixed some major and minor bugs Worked on the pi-bridge code to get readings of MAC Address . Set up Firebase RTDB badges/ node — each badge registered by MAC address with label, owner name and active status. This will be used in the dashboard to display owner names instead of raw MAC addresses and also used to assign a badge to a user and block or allow access Future Work: Build the admin dashboard with live floor map giving location data for each badge user Continue work on the landing page"}, {"post_id": 7635, "ts": "2026-06-12T19:12:56Z", "hours": 6.6208, "text": "DEVLOG #3 — WEBSITE POLISH + PI BRIDGE COMPLETE Website: https://spottr.brunogg.in Work Done Built floating navbar with sliding hover pill animation on desktop Added hamburger menu for mobile with smooth open/close animations and click-outside-to-close Logo centers on mobile, left-aligns on desktop Fixed SPOTTR intro animation to be properly centered on all screen sizes Made hero section fully responsive for mobile Pi Bridge now pushes live badge locations to Firebase RTDB and logs history to Firestore Added online/offline detection for both scanner nodes and badges with 60 second timeout Future Work Build admin dashboard with live floor map pulling from Firebase RTDB Add How It Works, Hardware and Software sections to landing page Add Firebase Auth to protect the dashboard Flash second scanner node and test strongest-signal room detection across multiple rooms Deep sleep badge firmware for battery life"}, {"post_id": 4817, "ts": "2026-06-08T10:04:57Z", "hours": 4.1131, "text": "DEVLOG #2 — HARDWARE ARRIVES, FIRMWARE WORK BEGINS Finally the hardware arrived and I started work straight away… First time diving into this deep of C++ programming… Dam it was tough fr Website: https://spottr.brunogg.in/ Work Done Set up PlatformIO in VS Code for programming the ESP32 Boards Flashed badge firmware on ESP32-C3 to continuously advertise via BLE with ID SPOTTR_BADGE_0XX Built scanner node firmware for ESP32-C6 to scan for BLE Devices with ID starting from SPOTTR_ Set up Raspberry Pi OS and installed MQTT broker Improved Scanner Node range by using antennas salvaged from old WiFi routers Added 30 second heartbeat from scanner to monitor online/offline status Future Work Write code for Python Pi Bridge to receive MQTT data and push to Firebase Continue work on landing page of the website"}, {"post_id": 2951, "ts": "2026-06-05T21:10:53Z", "hours": 4.8175, "text": "DEVLOG #1 — WEBSITE WORK BEGINS Note: Hardware arrives on 7th June, the real work starts then Website: https://spottr.brunogg.in Work Done Designed a model for the badge using Fusion 360 and logo using Canva Got Hero Section working Added 3D model of the product in website using React Three Fiber Added Intro animation to the website using AceternityUI where the SPOTTR text draws itself across the full screen with color gradient stroke on load, then fades to reveal the hero content. (Took alot longer to perfect and get timings as well as colors right 💀) Future Work Start hardware work the moment it arrives on 7th June Get the Pi Bridge system up and collecting RSSI data from scanner nodes"}]...
|
Title: Spottr by @BrunoGG | Stardance
Devlogs:
DE Title: Spottr by @BrunoGG | Stardance
Devlogs:
DEVLOG #1 — WEBSITE WORK BEGINS Note: Hardware arrives on 7th June, the real work starts then Website: https://spottr.brunogg.in Work Done Designed a model for the badge using Fusion 360 and logo using Canva Got Hero Section working Added 3D model of the product in website using React Three Fiber Added Intro animation to the website using AceternityUI where the SPOTTR text draws itself across the full screen with color gradient stroke on load, then fades to reveal the hero content. (Took alot longer to perfect and get timings as well as colors right 💀) Future Work Start hardware work the moment it arrives on 7th June Get the Pi Bridge system up and collecting RSSI data from scanner nodes
DEVLOG #2 — HARDWARE ARRIVES, FIRMWARE WORK BEGINS Finally the hardware arrived and I started work straight away… First time diving into this deep of C++ programming… Dam it was tough fr Website: https://spottr.brunogg.in/ Work Done Set up PlatformIO in VS Code for programming the ESP32 Boards Flashed badge firmware on ESP32-C3 to continuously advertise via BLE with ID SPOTTR_BADGE_0XX Built scanner node firmware for ESP32-C6 to scan for BLE Devices with ID starting from SPOTTR_ Set up Raspberry Pi OS and installed MQTT broker Improved Scanner Node range by using antennas salvaged from old WiFi routers Added 30 second heartbeat from scanner to monitor online/offline status Future Work Write code for Python Pi Bridge to receive MQTT data and push to Firebase Continue work on landing page of the website
DEVLOG #3 — WEBSITE POLISH + PI BRIDGE COMPLETE Website: https://spottr.brunogg.in Work Done Built floating navbar with sliding hover pill animation on desktop Added hamburger menu for mobile with smooth open/close animations and click-outside-to-close Logo centers on mobile, left-aligns on desktop Fixed SPOTTR intro animation to be properly centered on all screen sizes Made hero section fully responsive for mobile Pi Bridge now pushes live badge locations to Firebase RTDB and logs history to Firestore Added online/offline detection for both scanner nodes and badges with 60 second timeout Future Work Build admin dashboard with live floor map pulling from Firebase RTDB Add How It Works, Hardware and Software sections to landing page Add Firebase Auth to protect the dashboard Flash second scanner node and test strongest-signal room detection across multiple rooms Deep sleep badge firmware for battery life
DEVLOG #4 - LOGIN PAGE, BUG FIXES AND OVERHALL BADGE AND SCANNER FIRMWARE ALONG WITH CHANGES IN PI-BRIDGE Website: https://spottr.brunogg.in Work Done: Implemented a login page with Firebase Auth which supports but Google Sign-In as well as via Email & Password (Added a test user with its credentials posted on login page for future testing and for public showcase of the project) Added Protected routes - dashboard will remain inaccessible without logging in Switched the badge identification from using device_id ex. SPOTTR_BADGE_0XX to a MAC Address based identification coz its much more reliable and harder to spook Fixed some major and minor bugs Worked on the pi-bridge code to get readings of MAC Address . Set up Firebase RTDB badges/ node — each badge registered by MAC address with label, owner name and active status. This will be used in the dashboard to display owner names instead of raw MAC addresses and also used to assign a badge to a user and block or allow access Future Work: Build the admin dashboard with live floor map giving location data for each badge user Continue work on the landing page
DEVLOG #5 — STARTED WORK ON ADMIN DASHBOARD, IMPLEMENTED LIVE FLOOR MAP Website: https://spottr.brunogg.in Work Done: Started work on the admin dashboard Built the floor map feature and made it show in which room a badge is currently in Live badge dots render directly on the floor map, positioned in the room they were last detected in Added StatCards to the Overview page -> Badges Online, Scanners Online, Rooms Occupied, Total Badges Future Work Add dynamically updating status for scanners where pi-bridge sends a heartbeat and scanner-node responds to it Add sections to admin dashboard to add, remove or manage badges and scanners, along with a logs section to log any changes
DEVLOG #6 - SCANNER HEALTH CHECKS IMPLEMENTED, IDENTIFY SCANNERS VIA MAC, BADGE MANAGEMENT & OTA GROUNDWORK SET Website : https://spottr.brunogg.in Work Done: Built an active scanner health-check system - pi-bridge pings each scanner every 15s over MQTT, scanner replies with a pong , and a missed pong marks it offline within a few seconds. This replaced the old passive system where the scanner sent a heartbeat every 30 seconds to update its status Switched scanner identity to its MAC Address . with the pi-bridge verifying each scanner’s MAC and registering unknown scanners into Firebase as unassigned Refactored pi-bridge from one single large file into multiple sub-files ( config.py , handlers.py , health.py , presence.py , registry.py , state.py and main.py ) Started work on the Badges Management Page where the admin can add, edit, delete or enable/disable badges , where each row shows the live status of each badge as online/offline and current room, along with confirmation dialog boxes for destructive actions like deletion or disabling badges Laid the groundwork for OTA firmware updates for the scanner nodes, where I switched the scanner partition table to support two app slots, added semantic version tracking and comparison, and wrote the OTA update function (yet to be implemented properly) Future Work Fully implement the OTA function where the pi-bridge triggers the update by publishing the new firmware version over MQTT and automatically flash it to the scanners Add a captive portal where the scanners can be configured (Adding WiFi and Scanner IDs) without editing the code Build the Scanners Management page to assign rooms to auto-registered scanners and Logs Page to view history of every action performed
DEVLOG #7 - OTA FULLY IMPLEMENTED WITH AUTO-UPDATES, CAPTIVE PORTAL ADDED, FIRMWARE REFACTORED & STATUS LED Website : https://spottr.brunogg.in Work Done: Fully implemented Over-The-Air (OTA) updates for the scanner nodes. The pi-bridge watches Firebase for a new firmware version and publishes it over MQTT, each scanner compares it against its own version and only updates if it’s newer, then downloads, flashes and reboots itself. The version check runs on each scanner, so one publish updates every outdated node automatically Set up automatic releases using a GitHub Action, so publishing a new release on GitHub writes the version and download URL to Firebase on its own, which then cascades down to every scanner. Now a single release publish updates the whole fleet with no manual steps Added a WiFi captive portal for first-time scanner setup. On first boot the scanner hosts its own network and serves a 4-step wizard (name the room, connect WiFi, set the broker, confirm) styled to match the website. Config is saved to NVS after every step and the portal won’t let a scanner boot into normal mode until setup is fully complete, so one firmware image now works for every scanner without editing code Refactored the scanner firmware from one large file into separate modules ( config , portal , scanner , ota , led and globals ) for cleaner, more maintainable code Added a status LED on the scanner so its state can be read at a glance without a serial monitor - blinking while connecting, solid when online, a slow breathing fade while in the config portal, and a distinct pattern during an OTA update Fixed a bug where the dashboard counted an offline scanner as online, by trusting the health status set by the pi-bridge instead of guessing from the last-seen timestamp Future Work Build the Scanners Management page to assign rooms to auto-registered scanners and a Logs Page to view the history of every action performed Add offline buffering to the scanner firmware so badge detections aren’t lost if WiFi drops, and flush them once reconnected Add checksum verification to the OTA process so a corrupted download can’t be flashed to a scanner
DEVLOG #8 - MQTT AUTH, POWER-FAILURE RECOVERY, DASHBOARD REDESIGNED FROM SCRATCH Website : https://spottr.brunogg.in Work Done: Added MQTT username and password support across the whole stack. The captive portal now has optional auth fields, the credentials save to NVS with the rest of the config, and the pi-bridge authenticates the same way. Leaving them blank keeps the old anonymous behaviour, so nothing broke for existing setups Fixed a bug where every scanner broadcast the same setup network name . The AP name is built from the last two bytes of the device MAC, but it was being read from the WiFi driver before the interface existed, so every board came up as Spottr-Scanner-0000 . Reading the MAC directly from efuse fixed it, and each scanner now shows its real suffix, unique per device and stable across reboots Fixed a power-failure recovery bug that only showed up in the real deployment. When the power came back, the scanners booted in about two seconds but the router took closer to a minute, so the scanners found no network, assumed they were unconfigured, and dropped into the config portal. Every node had to be manually restarted. The logic was treating “can’t connect right now” as “isn’t set up”. Now a scanner with credentials in NVS retries WiFi indefinitely and only ever opens the portal if there are genuinely no credentials or the command is given over serial Added a WiFi watchdog to the main loop, so a dropout during normal operation reconnects on its own instead of leaving the scanner stuck retrying MQTT over a dead network Fixed the OTA status LED never actually animating . ledSet() only records the state, and the pin write happens in ledUpdate() , which runs from the main loop, but the OTA download blocks that loop entirely. So the LED just froze at whatever brightness it had. Driving it from httpUpdate ’s progress callback fixed it, and the pattern is twice as fast now so a quick update is still visible Redesigned the dashboard from scratch. Went for a design language closer to Nothing and Apple’s dark mode, so the whole thing is monochrome with mono uppercase labels, thin tabular numerals and a lot of empty space. Stripped out the animated gradient orbs, the dot-grid background and the glassmorphism, since that look is everywhere now and reads as generic. Cards are visible because they’re lighter than the page rather than because they have a border, and colour only appears where it means something, so a room lighting up when someone walks in is the only saturated thing on screen Rebuilt the Overview page as three columns, with stats and occupied rooms on the left, the floor map in the middle, and a badge rail on the right where every badge can be searched, edited, disabled or deleted without leaving the page. Added pan and zoom to the map Fixed a bug where any badge added through the dashboard would never show a location. New badges were saved with an uppercase MAC while the pi-bridge writes location keys in lowercase, so the two never matched. Pulled the MAC handling into a shared module so both pages normalise the same way Replaced the component-library sidebar with a custom animated one , and moved the shared liveness and badge logic into lib/status.js and lib/badges.js . The duplicated copies of that logic are exactly what let the floor map and the overview page drift apart and disagree about which scanners were online Future Work Build the Scanners Management page to assign rooms to auto-registered scanners and a Logs Page to view the history of every action performed Add offline buffering to the scanner firmware so badge detections aren’t lost if WiFi drops, and flush them once reconnected Add checksum verification to the OTA process so a corrupted download can’t be flashed to a scanner
DEVLOG #9 - BADGE CASE REDESIGNED, PRINTED AND ASSEMBLED Website : https://spottr.brunogg.in Work Done: Redesigned the badge enclosure from scratch in Fusion 360 to fit the new battery, which got thicker but smaller in footprint while the badge had to stay credit-card sized at 86 x 54 mm Made the whole model parametric , so every dimension falls out of a handful of named values and the next component change is a one-number edit instead of another rebuild Added the Spottr logo embossed on the lid and a USB-C cutout sized off the actual connector Got it printed through #printing-legion and it came out clean Assembled the hardware into it : XIAO ESP32-C3, LiPo and status LED all sit flat in the cavity with the lid seating properly on top
Ships:
SPOTTR is an open-source indoor presence tracking system built on ESP32-C3 and Bluetooth Low Energy. Wear a badge, walk into a room, show up on the map....
|
1792976182.6645687
|
1793062582.6645687
|
|
4906
|
spot-electricity-display by @viivi | Stardance
|
viivi
|
1
|
5.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-19T11:25:22Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "spot-electricity-display It’s a small ESP-8266 project for displaying the current spot electricity price. I used Arduino IDE for coding the code to fetch and update the data displayed on the screen. I also 3D modelled a case for it with Tinkercad but I haven’t tried to actually print or build it because I don’t have a 3D printer or materials for it. The first photo is an edited demonstration photo how it could look like (perspectives failed). The second photo shows what I actually have. I made this because it could make life easier. Instead of opening an app it would be much easier to check this to see the price. It wasn’t easy to make this because I felt like everything was against me. Libraries weren’t the easiest to use, the screen tweaked all the time and there isn’t many guides for this specific board because it’s quite rare.", "repo": "https://github.com/ViLP357/spot-electricity-display", "demo": ""}]...
|
[{"post_id": 70552, "ts": "202 [{"post_id": 70552, "ts": "2026-09-19T11:11:43Z", "hours": 0.4169, "text": "#4 devlog I guessed it rght, on the next day it worked again. One possible reason it didn’t work then was that the text wasn’t set to white, though it should be white as default. I finished readme and filmed a short demo video."}, {"post_id": 55666, "ts": "2026-08-27T17:01:57Z", "hours": 1.4514, "text": "#3 devlog Today I… tried to add timing for API requests, and I think it works but now my oled screen won’t display anything. There’s 50/50 chance it works tomorrow with exact same code :(. Finished 3D modelling by making a back plate for the case. Wrote something to the README"}, {"post_id": 33636, "ts": "2026-07-23T18:27:06Z", "hours": 2.0792, "text": "#2 devlog Coding Lot of time, no progress. I spent quite a long time trying to make buttons on my board work with my code. I couldn’t make them work :) . Instead of buttons I might make text change with specific a frequence. 3D-modelling I started making box case for simple electronics (the board and battery case). I used Tinkercad for modelling. I had used Tinkercad before but it’s been long time since I used it last time. I really liked that Tinkercad has ready models of electronics even though it didn’t have the ones I’m using. That’s why I had to use components as close as possible to my actual components."}, {"post_id": 9143, "ts": "2026-06-15T09:47:02Z", "hours": 0.9778, "text": "#1 devlog, days 1-2 This project has now officially started. Git and github are set up and the core feature works! Currently the arduino (it’s actually Wemos, not arduino) is able to show current price. I use free API to get spot electricity price (it’s price in Finland). https://api.spot-hinta.fi/JustNow The board I use is Lolin D1 mini Pro V2.0.0 My plan for this project: make the screen display current spot electricity price design and maybe build box/casing for electronics add leds to indicate how cheap or expensive electricity is now add buttons for scrolling future prices"}]...
|
Title: spot-electricity-display by @viivi | Starda Title: spot-electricity-display by @viivi | Stardance
Devlogs:
#1 devlog, days 1-2 This project has now officially started. Git and github are set up and the core feature works! Currently the arduino (it’s actually Wemos, not arduino) is able to show current price. I use free API to get spot electricity price (it’s price in Finland). https://api.spot-hinta.fi/JustNow The board I use is Lolin D1 mini Pro V2.0.0 My plan for this project: make the screen display current spot electricity price design and maybe build box/casing for electronics add leds to indicate how cheap or expensive electricity is now add buttons for scrolling future prices
#2 devlog Coding Lot of time, no progress. I spent quite a long time trying to make buttons on my board work with my code. I couldn’t make them work :) . Instead of buttons I might make text change with specific a frequence. 3D-modelling I started making box case for simple electronics (the board and battery case). I used Tinkercad for modelling. I had used Tinkercad before but it’s been long time since I used it last time. I really liked that Tinkercad has ready models of electronics even though it didn’t have the ones I’m using. That’s why I had to use components as close as possible to my actual components.
#3 devlog Today I… tried to add timing for API requests, and I think it works but now my oled screen won’t display anything. There’s 50/50 chance it works tomorrow with exact same code :(. Finished 3D modelling by making a back plate for the case. Wrote something to the README
#4 devlog I guessed it rght, on the next day it worked again. One possible reason it didn’t work then was that the text wasn’t set to white, though it should be white as default. I finished readme and filmed a short demo video.
Ships:
spot-electricity-display It’s a small ESP-8266 project for displaying the current spot electricity price. I used Arduino IDE for coding the code to fetch and update the data displayed on the screen. I also 3D modelled a case for it with Tinkercad but I haven’t tried to actually print or build it because I don’t have a 3D printer or materials for it. The first photo is an edited demonstration photo how it could look like (perspectives failed). The second photo shows what I actually have. I made this because it could make life easier. Instead of opening an app it would be much easier to check this to see the price. It wasn’t easy to make this because I felt like everything was against me. Libraries weren’t the easiest to use, the screen tweaked all the time and there isn’t many guides for this specific board because it’s quite rare....
|
1793004560.3871546
|
1793090960.3871546
|
|
4961
|
My awesome macropad! by @anton_carlens | Stardance
|
anton_carlens
|
1
|
3.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-05T20:23:07Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Okay so just a headds up i might be doing this wrong. But from what i have read this is the way to submit macropad projects (and recive the pcb) since the old way is down. Please let me know if im wrong.", "repo": "https://github.com/Antoncarlens-code/Hexpad-macropad", "demo": "https://antoncarlens-code.github.io/Hexpad-macropad/"}]...
|
[{"post_id": 2868, "ts": "2026 [{"post_id": 2868, "ts": "2026-06-05T18:55:04Z", "hours": 3.1711, "text": "Quick heads-up before I dive in: I had some trouble getting devlogs to actually post for a while, so this is my first one even though the project’s already finished. Because of that I’m packing everything into this single post — the whole build, start to finish, with the details for each stage. What it is Hexpad is a 6-key macropad (a 3×2 cluster) with a rotary encoder up top, running on a Seeed XIAO RP2040. It’s a clipboard/editing pad with a volume knob — front row is Copy/Paste/Cut, rear row is Undo/Redo/Save, and the encoder does volume (press to mute). Step 1 — The case (CAD) The enclosure is a 3D-printed top plate + bottom case. The plate holds the MX switches (standard 14 mm cutouts), has a 7 mm hole for the EC11 encoder, and four corner posts that the bottom case screws into with M2 screws. This is where I hit my first real problem. My original top-plate model was malformed — the plate solid had a stray slab fused 74 mm beneath it, so in the slicer the plate looked like it was floating/sinking. There was no source file to go back to, so I reverse-engineered the actual dimensions straight from the STEP geometry and rebuilt the entire plate as a clean part. Now the whole thing generates — plate is 76 × 74 mm, 3 mm thick, switches on a 19.05 mm grid, mounts at ±31 mm. I also engraved “Hexpad” into the front margin of the plate, 0.6 mm deep. Step 2 — The electronics (schematic + PCB) Because there are only 7 inputs (6 keys + 1 encoder), I skipped the matrix completely — every switch wires straight to its own GPIO using the RP2040’s internal pull-ups, so there’s not a single diode on the board. The pin map: Switches → D0, D1, D2, D3, D6, D7 Encoder A/B/push → D8, D9, D10 D4/D5 (SDA/SCL) left free in case I ever add an OLED Instead of hand-drawing the board, I generated the PCB programmatically with KiCad’s pcbnew API from one coordinate spec — same numbers that drive the CAD. That guarantees the switches, encoder, and mounting holes line up exactly with the printed plate, no manual alignment. I did the schematic the same way, then went back and added wire stubs so the net labels actually read cleanly instead of piling on top of the symbols. The board is 2-layer, 76 × 74 mm (well under the 100 mm limit), DRC clean (0 errors, 0 unconnected), with “Hexpad” on the silkscreen and the Gerbers exported and zipped, ready for fab. Step 3 — The firmware KMK (CircuitPython) on the XIAO RP2040. The keymap just maps each GPIO to a keycode and the encoder to volume up/down + mute. Easy to remap since it’s all in one code.py. Where it’s at Everything’s done and in the repo: parametric CAD, generated PCB + Gerbers, clean schematic, KMK firmware, and a full BOM. Next up is ordering the board, printing the case, and soldering it all together. Sorry again for the radio silence on devlogs — at least this one covers the whole story in one go. 🚀"}]...
|
Title: My awesome macropad! by @anton_carlens | St Title: My awesome macropad! by @anton_carlens | Stardance
Devlogs:
Quick heads-up before I dive in: I had some trouble getting devlogs to actually post for a while, so this is my first one even though the project’s already finished. Because of that I’m packing everything into this single post — the whole build, start to finish, with the details for each stage. What it is Hexpad is a 6-key macropad (a 3×2 cluster) with a rotary encoder up top, running on a Seeed XIAO RP2040. It’s a clipboard/editing pad with a volume knob — front row is Copy/Paste/Cut, rear row is Undo/Redo/Save, and the encoder does volume (press to mute). Step 1 — The case (CAD) The enclosure is a 3D-printed top plate + bottom case. The plate holds the MX switches (standard 14 mm cutouts), has a 7 mm hole for the EC11 encoder, and four corner posts that the bottom case screws into with M2 screws. This is where I hit my first real problem. My original top-plate model was malformed — the plate solid had a stray slab fused 74 mm beneath it, so in the slicer the plate looked like it was floating/sinking. There was no source file to go back to, so I reverse-engineered the actual dimensions straight from the STEP geometry and rebuilt the entire plate as a clean part. Now the whole thing generates — plate is 76 × 74 mm, 3 mm thick, switches on a 19.05 mm grid, mounts at ±31 mm. I also engraved “Hexpad” into the front margin of the plate, 0.6 mm deep. Step 2 — The electronics (schematic + PCB) Because there are only 7 inputs (6 keys + 1 encoder), I skipped the matrix completely — every switch wires straight to its own GPIO using the RP2040’s internal pull-ups, so there’s not a single diode on the board. The pin map: Switches → D0, D1, D2, D3, D6, D7 Encoder A/B/push → D8, D9, D10 D4/D5 (SDA/SCL) left free in case I ever add an OLED Instead of hand-drawing the board, I generated the PCB programmatically with KiCad’s pcbnew API from one coordinate spec — same numbers that drive the CAD. That guarantees the switches, encoder, and mounting holes line up exactly with the printed plate, no manual alignment. I did the schematic the same way, then went back and added wire stubs so the net labels actually read cleanly instead of piling on top of the symbols. The board is 2-layer, 76 × 74 mm (well under the 100 mm limit), DRC clean (0 errors, 0 unconnected), with “Hexpad” on the silkscreen and the Gerbers exported and zipped, ready for fab. Step 3 — The firmware KMK (CircuitPython) on the XIAO RP2040. The keymap just maps each GPIO to a keycode and the encoder to volume up/down + mute. Easy to remap since it’s all in one code.py. Where it’s at Everything’s done and in the repo: parametric CAD, generated PCB + Gerbers, clean schematic, KMK firmware, and a full BOM. Next up is ordering the board, printing the case, and soldering it all together. Sorry again for the radio silence on devlogs — at least this one covers the whole story in one go. 🚀
Ships:
Okay so just a headds up i might be doing this wrong. But from what i have read this is the way to submit macropad projects (and recive the pcb) since the old way is down. Please let me know if im wrong....
|
1793051730.2467165
|
1793138130.2467165
|
|
4994
|
Tamagochi pet by @S0l4Ce | Stardance
|
S0l4Ce
|
1
|
52.03
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-20T05:08:22Z", "hours": 45.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a tamagotchi pet (i am aware that throughout the project, the spelling of it has been inconsistent) But anyway, what i found most challenging was having to look through the loop constantly making adjustments based off minor errors during each test run and incorrect wiring making me feel like i had the code wrong. I am proud that I learned surprisingly a lot. The screenshot is merely just part of it and you should check it out yourself! both the source for the software and hardware is in there. The latest software build is in a separate branch and you may need to scope around for the latest hardware build. PLEASE note that all of the hardware additions - if you truly want to build it yourself, is pushing the limits of the esp32 so please run it while using a powerful cable.", "repo": "https://github.com/mootonlee/tamagotchi-", "demo": ""}]...
|
[{"post_id": 81143, "ts": "202 [{"post_id": 81143, "ts": "2026-10-20T02:14:13Z", "hours": 1.0578, "text": "spent this hour troubleshooting and figuring out how to add wires. was super unsucessful and wasted my time. im pretty annoyed"}, {"post_id": 80851, "ts": "2026-10-19T00:50:55Z", "hours": 2.3, "text": "Finished adding modules like the LEDs, resistors, etc. All i need now is the wiring which i heard is tedious"}, {"post_id": 80585, "ts": "2026-10-18T07:04:57Z", "hours": 1.4167, "text": "Im very proud of my work! i finished up the screen, fixed misalignments, ensured precision, and in the end, everything fit perfectly!"}, {"post_id": 80513, "ts": "2026-10-17T22:48:45Z", "hours": 2.26, "text": "got mad countless times. Im doing my CAD for my project because youll now get permanently rejected if you miss it and i never knew. Im making the screen myself because i cant find it online. Below is a picture of how its assembled so far, and i would post the part im making right now but this just looks better. Also, does the CAD have to be fully accurate? ive never done a CAD before so parts i make myself may look off but ill try my best to make the measurements right."}, {"post_id": 70980, "ts": "2026-09-20T04:48:45Z", "hours": 6.0014, "text": "finally finished the 2nd personality. will be shipping my project. only thing left to do is fix bugs (i already scanned software and hardware for bugs. though the code seems somewhat contradictory to itself, it still works but please report bugs under this one’s comment and check out my submission and the demo video!"}, {"post_id": 63407, "ts": "2026-09-07T07:10:06Z", "hours": 1.4625, "text": "im starting work on the radiobuttons for interchangable personality to wrap up the project. im using placeholders so the face looks red if the radiobuttons are selected so it would look unpleasant to see but yeah"}, {"post_id": 59986, "ts": "2026-09-02T02:11:14Z", "hours": 2.4203, "text": "Got back on track, finally! It now gets visibly dim below 50 value on light, and dark below 25, along with squint and sleep. Im now going to begin working on the other expressions after I finish adding the dim to smile and alone faces. This thing is ending soon so idk if i will be able to add the computer control functions as promised :( I also switched to cachyos so Idk how that would go either. Check out the hardware version on my page though! its finished"}, {"post_id": 52633, "ts": "2026-08-22T21:16:19Z", "hours": 0.5211, "text": "My windows OS broke, not sure how, so im running on my second SSD and my most recent work has been erased! (software version) random thumbnail ig but im gonna be re-doing whatever has been erased.."}, {"post_id": 41108, "ts": "2026-08-05T03:07:48Z", "hours": 3.4297, "text": "finally added a sleep system, dimming system, and a fully fixed and functional lonely system. when lights are at or below 50, the lights will go dim, and below 25, they will go even dimmer, and it will sleep (software) I will the face variants next, and then actual interactive computer controls. shy and moody are still not ready yet"}, {"post_id": 34593, "ts": "2026-07-25T13:29:57Z", "hours": 2.5967, "text": "added lonely, smile, and neutral, also added placeholders for the soon to be added personalities and a brightness slider. Both are unfunctional and i only have the 3 faces for now. go check out my hardware version, its fully functional"}, {"post_id": 32247, "ts": "2026-07-21T09:09:49Z", "hours": 1.2072, "text": "working on a software version of my project 🔥 I main micropython but I’m adjusting to python for this and learning the different ways things are written, and figuring out how to make faces. Can anyone tell me if theres a designer that gives you the code when you draw something on a canvas? similar to lopaka?? The software version is projected to have more features for computer control than the hardware version. After finishing the faces and overall logic, I will add the additional side controls for it, like light and stuff"}, {"post_id": 32144, "ts": "2026-07-21T03:23:42Z", "hours": 9.8794, "text": "built an extension for the pet. It connects to the pet using gnd and 4 labeled gpio pins, though the 4th one connects to 0 and not 40. It works somewhat like a stream deck; It opens 2 games, 2 code editors, a browser, and shuts off or closes tabs on my computer without needing special permissions, it is built for windows though. Most of the hours logged came from trial and error. Most of the time the buttons wouldnt register, spam the same commands, double clicks wouldnt register, and it was a mess for hours. did some bugfixes involving screen bugs during personality swaps, and the pet “forgetting” its personality. please suggest additional ideas."}, {"post_id": 30476, "ts": "2026-07-18T02:37:34Z", "hours": 1.7375, "text": "Rewired to remove clutter. Back isn’t looking too good but the front is, when I run out of ideas ill probably build a shell for it please make recommendations"}, {"post_id": 30124, "ts": "2026-07-17T13:22:42Z", "hours": 2.4481, "text": "Added another personality, shy. added “cores” that determine the personality when plugged in, red for moody and blue for shy. unplug for normal. The shy personality features new unique faces. led colors and shaken face remain same"}, {"post_id": 29977, "ts": "2026-07-17T06:07:54Z", "hours": 1.6644, "text": "Ignore devlog: Tried making online demo but i pressed a button and all my tabs refreshed all at once and reset my work. Im publishing the devlog because i still did the work and i dont want it to go to waste (IGNORE THIS DEVLOG)"}, {"post_id": 29812, "ts": "2026-07-16T23:08:57Z", "hours": 3.2333, "text": "Added extra personality. If you plug a red LED in, it will get a more of a moody personality. It will look angry, sleep angry, and will usually just be angry (shaken face does not change.) unplugging the red LED will make it instantly revert to default personality let me know other interchangeable personalities I should add, or other software and hardware suggestions. Thanks."}, {"post_id": 28868, "ts": "2026-07-15T13:02:50Z", "hours": 2.6472, "text": "Added a gyroscope so the pet can become dizzy when shook. It features a red backlight, and remains dizzy for about 5 seconds. It was really a 20-30 minute setup after learning how to code and use one, and installing the libraries, but that extra addition turned into hours of additional troubleshooting since I was unfamiliar with the hardware. I eventually got it working after plenty of trial and error, and the real issue was just a couple lines of code. I’m unfortunately not getting much views, which is discouraging, but if you do come across this and decide to click on it, please suggest something in the comments. Thanks."}, {"post_id": 28151, "ts": "2026-07-14T08:19:06Z", "hours": 0.6217, "text": "Added status lights; finishing off full basic functionality for the pet. any additional features would be improvements, hardware additions, and wiring. full explanation of functions below: The “pet” is a TFT resistive touchscreen. Its face, as you can see, is a simple white and black pixelated look. 4 functions (for now): lonely - after 30 seconds of no interaction, after waking up or not being pet, it will become lonely, which is a sad face of course. The backlight glows a gloomy blue, slightly purple. neutral - base face, the pet is neutral when it isn’t lonely, had just woken up, and had recently been pet. the 3 other moods can occur when it is neutral. the backlight is white. sleeping - when the ambient light is low enough the pet will sleep. It cannot be disturbed and cannot become lonely until woken up. This is what i personally thought was a nice addition to the pet and would bring more realism and life to the pet. This is done by having a photocell near the face for most light accuracy. the backlight features a light purple blue. happy - when you pet it (or interact with the screen), it will smile. the blush being blue and not red was both intentional and unintentional feature. The color system is inverted same with the screen rotation. I did not know how to correct it but i felt the blue looked different and I kinda liked it so I didn’t spend extra time troubleshooting. the backlight features a bright hot pink color. PLEASE add any suggestions and I will likely consider, like adding a thermistor, weather, USB OTG, etc. When i feel like it, I may add a USB mode where it can do things on my computer when plugged in, like opening an app or powering off my computer. (the 35 minutes logged was for fixing the code and adding the lights. Not the full code itself.)"}, {"post_id": 27970, "ts": "2026-07-13T22:34:39Z", "hours": 3.7561, "text": "added functionality to the pet and added made a separate smaller one. It now has multiple moods with the ability to sleep when lights are dimmed enough."}, {"post_id": 16541, "ts": "2026-06-26T22:02:40Z", "hours": 1.0939, "text": "working on the wiring of the tomogachi pet n stuff no coding yet has a touchscreen now"}]...
|
Title: Tamagochi pet by @S0l4Ce | Stardance
Devlo Title: Tamagochi pet by @S0l4Ce | Stardance
Devlogs:
working on the wiring of the tomogachi pet n stuff no coding yet has a touchscreen now
added functionality to the pet and added made a separate smaller one. It now has multiple moods with the ability to sleep when lights are dimmed enough.
Added status lights; finishing off full basic functionality for the pet. any additional features would be improvements, hardware additions, and wiring. full explanation of functions below: The “pet” is a TFT resistive touchscreen. Its face, as you can see, is a simple white and black pixelated look. 4 functions (for now): lonely - after 30 seconds of no interaction, after waking up or not being pet, it will become lonely, which is a sad face of course. The backlight glows a gloomy blue, slightly purple. neutral - base face, the pet is neutral when it isn’t lonely, had just woken up, and had recently been pet. the 3 other moods can occur when it is neutral. the backlight is white. sleeping - when the ambient light is low enough the pet will sleep. It cannot be disturbed and cannot become lonely until woken up. This is what i personally thought was a nice addition to the pet and would bring more realism and life to the pet. This is done by having a photocell near the face for most light accuracy. the backlight features a light purple blue. happy - when you pet it (or interact with the screen), it will smile. the blush being blue and not red was both intentional and unintentional feature. The color system is inverted same with the screen rotation. I did not know how to correct it but i felt the blue looked different and I kinda liked it so I didn’t spend extra time troubleshooting. the backlight features a bright hot pink color. PLEASE add any suggestions and I will likely consider, like adding a thermistor, weather, USB OTG, etc. When i feel like it, I may add a USB mode where it can do things on my computer when plugged in, like opening an app or powering off my computer. (the 35 minutes logged was for fixing the code and adding the lights. Not the full code itself.)
Added a gyroscope so the pet can become dizzy when shook. It features a red backlight, and remains dizzy for about 5 seconds. It was really a 20-30 minute setup after learning how to code and use one, and installing the libraries, but that extra addition turned into hours of additional troubleshooting since I was unfamiliar with the hardware. I eventually got it working after plenty of trial and error, and the real issue was just a couple lines of code. I’m unfortunately not getting much views, which is discouraging, but if you do come across this and decide to click on it, please suggest something in the comments. Thanks.
Added extra personality. If you plug a red LED in, it will get a more of a moody personality. It will look angry, sleep angry, and will usually just be angry (shaken face does not change.) unplugging the red LED will make it instantly revert to default personality let me know other interchangeable personalities I should add, or other software and hardware suggestions. Thanks.
Ignore devlog: Tried making online demo but i pressed a button and all my tabs refreshed all at once and reset my work. Im publishing the devlog because i still did the work and i dont want it to go to waste (IGNORE THIS DEVLOG)
Added another personality, shy. added “cores” that determine the personality when plugged in, red for moody and blue for shy. unplug for normal. The shy personality features new unique faces. led colors and shaken face remain same
Rewired to remove clutter. Back isn’t looking too good but the front is, when I run out of ideas ill probably build a shell for it please make recommendations
built an extension for the pet. It connects to the pet using gnd and 4 labeled gpio pins, though the 4th one connects to 0 and not 40. It works somewhat like a stream deck; It opens 2 games, 2 code editors, a browser, and shuts off or closes tabs on my computer without needing special permissions, it is built for windows though. Most of the hours logged came from trial and error. Most of the time the buttons wouldnt register, spam the same commands, double clicks wouldnt register, and it was a mess for hours. did some bugfixes involving screen bugs during personality swaps, and the pet “forgetting” its personality. please suggest additional ideas.
working on a software version of my project 🔥 I main micropython but I’m adjusting to python for this and learning the different ways things are written, and figuring out how to make faces. Can anyone tell me if theres a designer that gives you the code when you draw something on a canvas? similar to lopaka?? The software version is projected to have more features for computer control than the hardware version. After finishing the faces and overall logic, I will add the additional side controls for it, like light and stuff
added lonely, smile, and neutral, also added placeholders for the soon to be added personalities and a brightness slider. Both are unfunctional and i only have the 3 faces for now. go check out my hardware version, its fully functional
finally added a sleep system, dimming system, and a fully fixed and functional lonely system. when lights are at or below 50, the lights will go dim, and below 25, they will go even dimmer, and it will sleep (software) I will the face variants next, and then actual interactive computer controls. shy and moody are still not ready yet
My windows OS broke, not sure how, so im running on my second SSD and my most recent work has been erased! (software version) random thumbnail ig but im gonna be re-doing whatever has been erased..
Got back on track, finally! It now gets visibly dim below 50 value on light, and dark below 25, along with squint and sleep. Im now going to begin working on the other expressions after I finish adding the dim to smile and alone faces. This thing is ending soon so idk if i will be able to add the computer control functions as promised :( I also switched to cachyos so Idk how that would go either. Check out the hardware version on my page though! its finished
im starting work on the radiobuttons for interchangable personality to wrap up the project. im using placeholders so the face looks red if the radiobuttons are selected so it would look unpleasant to see but yeah
finally finished the 2nd personality. will be shipping my project. only thing left to do is fix bugs (i already scanned software and hardware for bugs. though the code seems somewhat contradictory to itself, it still works but please report bugs under this one’s comment and check out my submission and the demo video!
got mad countless times. Im doing my CAD for my project because youll now get permanently rejected if you miss it and i never knew. Im making the screen myself because i cant find it online. Below is a picture of how its assembled so far, and i would post the part im making right now but this just looks better. Also, does the CAD have to be fully accurate? ive never done a CAD before so parts i make myself may look off but ill try my best to make the measurements right.
Im very proud of my work! i finished up the screen, fixed misalignments, ensured precision, and in the end, everything fit perfectly!
Finished adding modules like the LEDs, resistors, etc. All i need now is the wiring which i heard is tedious
spent this hour troubleshooting and figuring out how to add wires. was super unsucessful and wasted my time. im pretty annoyed
Ships:
I made a tamagotchi pet (i am aware that throughout the project, the spelling of it has been inconsistent) But anyway, what i found most challenging was having to look through the loop constantly making adjustments based off minor errors during each test run and incorrect wiring making me feel like i had the code wrong. I am proud that I learned surprisingly a lot. The screenshot is merely just part of it and you should check it out yourself! both the source for the software and hardware is in there. The latest software build is in a separate branch and you may need to scope around for the latest hardware build. PLEASE note that all of the hardware additions - if you truly want to build it yourself, is pushing the limits of the esp32 so please run it while using a powerful cable....
|
1793004735.0102348
|
1793091135.0102348
|
|
5003
|
Browse++ by @kallenseelo | Stardance
|
kallenseelo
|
1
|
165.0
|
3160
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-29T03:43:00Z", "hours": 165.0, "multiplier": 19.1, "payout": 3160, "blessing": "neutral", "text": "Browse++ A C++ Browser Engine from Scratch. Overview: Over the course of 2 months and almost 300 hours (165 coding) of work, I built a browser engine that can download, parse, and render websites with tab handling and a lot of other cool features, from almost complete scratch! What’s a Browser Engine? A basic definition of a browser engine is a program that pulls content from a website, then takes that content, gives the elements the properties assigned in the CSS, and then renders the content on the screen. They end up being very difficult to build, as HTML and CSS can run and be run without errors, so that makes it super hard to build an engine that can properly handle, parse, and render a site with a lot of errors. How to use this? If you would like to use my browser engine, there is quite a few ways to do so! NOTE: I do not have an actual Linux laptop, so the Linux version is super buggy (and does not have any networking), but I really hope to fix that in the future, but you can use the more outdated web demo! If you don’t want to download anything, you can use the Web Demo , its a bit behind, but it shows it nicely. If you are willing to download, and you are on windows , you can go to the github here and download to try it! If you want to see the real thing, I have a video going through it here. What am I most proud of? I think the thing I’m most proud of was the amount of browser systems i was able to build from scratch , this was a super fun thing to build, but it had a lot of challenges and ups and down, and a lot of hours fixing bugs that make no sense at all lol! The other thing I’m most proud of is not using any AI on the main engine; there was a bit of AI used for the web demo, as that wasn’t my main focus, but the browser engine overall used absolutely no AI! AI usage GLM 5.2 was used to convert the Windows code to a web server for Linux (way before I supported Linux). Any code changes are clearly marked with ( // CHANGED WITH AI: ... ) if they have been changed with AI, and very little has been changed.", "repo": "https://github.com/k754a/C-Plus-Plus-Web-Engine", "demo": "https://k754a.hackclub.app/"}]...
|
[{"post_id": 56948, "ts": "202 [{"post_id": 56948, "ts": "2026-08-28T23:53:05Z", "hours": 4.8833, "text": "Final work on the readme, getting a standalone windows build! Over the last few days, I’ve been hard at work getting the readme finished up, it was super tedious but now its in a good spot for a ship, and looks awesome! I’ve also gotten the windows build to be standalone! this took a lot of googling, but now with CMake, it now can run on anyone’s computer, without needing anything else!! Other than that, its been a bit of work on the Linux side, i attempted to get some sort of https working, but because its a vm, its super screwy, and i hope to be able to have a computer that has Linux on it for use, but we will see ig. Also made a YT vid https://www.youtube.com/watch?v=I-mCh9xSYeg&t=8s Overall a good day!"}, {"post_id": 54642, "ts": "2026-08-25T17:49:57Z", "hours": 4.9522, "text": "Linux support!!! Over the last few days, I’ve been working on migrating the project from MSBuild to CMake, allowing it to run on both Linux and macOS (though I haven’t been able to test it lol). Linux has been tested, however, and everything works on it (except I haven’t migrated the networking, so that’s still to do!!), so there are still some things that need to be done, but it boots on my Debian VM and renders! So I’m super happy for that. Some other changes were that I got autocompletion (you’ll see it in a sec) as well as getting the open in a new tab working a bit better for both Windows and Linux!! Overall a good day!"}, {"post_id": 52150, "ts": "2026-08-22T07:40:12Z", "hours": 6.0289, "text": "Updated context menu, Desktop Logo, Hover effects, Rework of the input bar, and bug fixes! Ok, its like 1:30 am rn lol, so im going to try to do this fast. First, i updated the context menu, the menu now has a nice drop shadow, and looks so much nicer than before (lemme know what you think about it). second, i added a basic desktop logo (a grayish black circle) that changes based on light or dark mode (the vid shows it well). Another change was hover effects! now hovering over buttons changes the color slighly, making it a bit simpler to see that your over something, and aswell as being a bit more reactive! the input bar rework allows clicking onto the bar, rather than always typing on the bar (for ctr-F coming soon!). Finally, bug fixes, i had a lot of issues with having both custom x pos, and custom y pos, but thats all fixed now! aswell as the backgrounds not updating per tab (thats now fixed too!). Finally II, i worked on the readme a bit! Overall it was a good day (with over 10 hours of work lol), and i still have a few features to add! so yeah, thanks for reading! (as well as excuse the spelling mistakes, there might be a lot lol)"}, {"post_id": 51922, "ts": "2026-08-21T20:50:43Z", "hours": 6.1733, "text": "More HTML style options, browser history, and work on the Readme.md Ok, so over the last 6 hours this is what I worked on. First, I worked on adding more style options, so now you can set font size (another way) and set font boldness (like normal HTML), and you can now add custom number values to the vertical alignment (that in the vid is shown on the homepage!). I also worked on the browser history now, saving it to a txt file. You can scroll back through what you’ve searched before (and add a button to clear it next update).I also was working on the readme, making it clear and better before the ship. Overall a good day, and I think I’ll try to do the settings menu, aswell as support for buttons in the viewer (though they probably won’t do anything thanks to not having JavaScript), so yeah!"}, {"post_id": 51394, "ts": "2026-08-21T02:14:27Z", "hours": 5.9358, "text": "More text formatting and positioning. (and LOTS of bug fixing) Today was a great day of work; I got height adjusting working, and this took way longer than I thought, just with all the bugs and problems I ran into, with old code I had created, but I was able to solve it all. The other notable thing is having another way to color text and the bg of text, but also, I fixed it so that none of the text falls off the edge in the positioning, so overall a good day! I’m actually so close to being done; I’ve wanted to go to 200 hours, then kind of just chill and slow down, and I’m at 14 hours left of that! Then I’ll ship. But I do want to finish the history menu, though I may leave the settings menu on pause. (for now). So yeah!"}, {"post_id": 50790, "ts": "2026-08-20T05:38:54Z", "hours": 5.1342, "text": "HTML text-align handling, history tab, and settings. Ok, I’m going to be honest, I looked at that settings menu and genuinely did NOTHING. It’s going to be a pain, so I’m just avoiding it till I have no choice. Something HUGE, though, I’ve gotten working is getting proper styling so that text can render in the middle and right (with way more text-align and style options to come)! This really opens the door for much more dynamic rendering text, though there are still a few bugs with it (large text goes off screen, and the home screen doesn’t apply the settings), so there is still a lot to fix, but honestly, I didn’t even think it was possible, so this is awesome! Overall a good day; I’m going to continue working on history and styles and then the settings lol."}, {"post_id": 49986, "ts": "2026-08-19T00:38:26Z", "hours": 6.455, "text": "Add context menu and startup URL (and fixed a LOT of bugs)! Sorry it’s been like 2 weeks, but after finishing my other project, I’m back at it! Over the last 2 days, I worked a LOT on the context menu and bug fixes (like loading text files into the engine, and old ones I caught working on this!). The context menu changes its options based on what things you right-click (like a real context menu), so for example, when I click a link, I get way more different options than if I clicked a tab. This allows for a lot of customization, and it’s basically fully implemented (minus a few features I want to add). The startup URL is kind of a part of that; when clicking a link, you have the choice to open it in a new window, and getting a URL that can change on startup really made it easy to add the feature! So overall a good day. What I’m going to work on next is the settings menu. Thanks for reading!"}, {"post_id": 41749, "ts": "2026-08-06T04:16:16Z", "hours": 5.6256, "text": "Settings button, bug fixes, scroll bar drag, and a context menu! This update was just a crazy number of features! I ended up shifting around the top area to make room for a settings button (that I will deal with soon), then I decided to allow scroll bar drag so that you can scroll through a page with the bar, not just your wheel! The big thing was the context menu; this took the most time and was the most difficult, as it was just a pain to get 2 windows rendering, but now, it works super well! I also attempted to work on getting a better layout, but I just screwed a lot of stuff up lol, so that didn’t really work out, but that’s ok!"}, {"post_id": 39793, "ts": "2026-08-03T00:24:38Z", "hours": 3.6864, "text": "Done all comments and released 0.1.0 ! If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine I ended up going on a camping trip with the homies, so I didn’t work on this for a bit, but when I came back, I fixed a few more bugs, ended up finishing all the comments for GUI.cpp, and created release 0.1. 0! This is huge, as I was able to fix all known bugs and get a working version out! For version 1.0.0, I want to fully fix the layout engine to render close to a modern browser, add a settings page, fix performance, and add things like buttons and checkboxes on websites! Thanks for reading!"}, {"post_id": 35496, "ts": "2026-07-26T23:35:45Z", "hours": 3.4192, "text": "Quality of life improvements, more comments, and finally fixed the crashes If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine Ok, so first off, the huge crash I was getting was because of using a global variable for holding the link and not a local variable, and when 2 threads attempted to use it at the same time, my app would freeze and crash, so now it runs great! Some of the QofL improvements are adding keyboard shortcuts and the ability to close tabs by pressing the middle button down, like a real browser! Then there were a lot more comments that I am so close to being done! Overall a decent 2 days; I’m definitely getting a bit bored of the comments, so my plan is to work on my other project for a bit and come back later! But yeah, a good day. :)"}, {"post_id": 33882, "ts": "2026-07-24T04:53:53Z", "hours": 6.0147, "text": "Local file loading, better comments, and crash fixing! If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine Today, I worked a TON; I got through all the comments for the start and collision events for all the buttons and things in GUIRENDER . I also added some new features and fixed some huge bugs! The new feature is file loading! You can now load PNG, JPEG, HTML, TXT, and HTM files straight from the search bar! The main fix, and what took most of my time, was the prerender. as i was working on slimming the new tab create button down, i found a lot of strange bugs, esspicaly with webpages with large amounts of images (like stardance), this lead me down a lot of changes, overall, it was a issue with how i checked to see if i wanted to load it from disk, but it was also a bunch of stuff to do with multithreading, and locking parts, but after a lot of work, i fixed it! I still need to fix up and finish GUIRENDER , but once I’m done with that, it’s off to work on the settings page. Thanks for reading!"}, {"post_id": 33247, "ts": "2026-07-23T00:15:09Z", "hours": 5.6319, "text": "Halfway done rewriting Gui.cpp—Lots of bug fixes and speed improvements! If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine Over the last 2 days, I’ve rewritten about half of GUI.cpp (up to the GUIRENDER function), with changes, bug fixes, and speedups that helped the engine a lot! The main speedup came from changing the way I handled the font so that I loaded it once, not every loop. This allowed a lot less SSD usage and a gradual increase of performance, up to about 50% for large sites! I worked a lot on organization and got it so that different functions are grouped together, even moving some to different scripts that fit better! The final change was reworking how images and the home button worked, and it allowed me to drop a function, as well as have much faster image batch loading times! Going through the code made me realize how many bugs and bad code I did. I fixed a lot of it, but I still got a bit to go! Overall it was a good day. My plan for everything else is to finish the rest of GUI.cpp, start work on a settings page, and try to make the parser faster still! Thanks for reading!"}, {"post_id": 32062, "ts": "2026-07-20T23:17:12Z", "hours": 3.9422, "text": "Lots of bug fixes, quality-of-life changes, and the start of a rewrite! try it out! https://k754a.hackclub.app/ I’ve been still a bit busy, but over the last 2 days, I ended up fixing a lot of bugs with crashing, especially with dealing with multithreaded tab handling. Some of the quality-of-life changes I did were creating a new tab handle that allows you to go back to the new tab in history and other small changes! The biggest bug was where, if you searched something and, while it was loading, switched tabs, it would overwrite your tab to the one you switched to, not the original one you searched in. Now that is fully fixed! Overall a good day! I’m going to fully rewrite and comment all 2500+ lines of the GUI and other functions, fix a LOT of bugs, and then add settings, history, and a few other things! Thanks for reading!"}, {"post_id": 29965, "ts": "2026-07-17T05:38:51Z", "hours": 4.44, "text": "Dark mode and bug fixes (with more bugs) and HTTP error codes Today, I recorded most of my link and search handling to be better at handling URLs and links like /home. I also added a dark mode! (Super helpful on the eyes lol) Unfortunately there is a big bug, some websites will just not work anymore (like hackclub), and also websites take super long to load, this is because the images it is processing are in a buffer, and this buffer needs to finish the images of one page before the other, i think i have an idea to fix it, so I hope I will be able too soon! But overall, this update changed a lot of bugs, and I’m hoping it can be even better for the future!"}, {"post_id": 28606, "ts": "2026-07-14T23:12:44Z", "hours": 6.4553, "text": "Lots of optimization, better comments, and bug fixes! Sorry for not posting for a few days; I was super busy and didn’t really have the time. However, I’m back at it! Over the last week, I’ve been changing and updating lots of stuff. The first one was much better comments for the layout.cpp file! I still have a bit left to do, but I was getting pretty tired, so I moved onto making the engine a bit faster! One of the main things I did was use threading, passing the text off to the GPU rather than going from CPU to GPU, as well as multithreading it. This allows about 2 seconds faster search time, and I have some more ideas for changes too! The reason this took so long is the number of bugs I introduced. The Gui.cpp is huge (2000+ lines), so I want to really rewrite it, as there is SO much junk and bad coding practices lol. Overall though, it was a good day, and I think I want to start tackling JavaScript after adding a lot of QofL and fixes to a ton of bugs! Thanks for reading!"}, {"post_id": 23282, "ts": "2026-07-06T04:43:49Z", "hours": 3.3869, "text": "Performance analyzer and comments for our DOM! Today, I created a performance analyzer that could tell me how many microseconds it takes to get through certain programs. This helped a lot with optimization and making things faster! I also finished and optimized the DOM code! Today was a pretty basic day; I’m a bit busy over this coming week, so it’s going to be a bit more broken up, but overall a good day today!"}, {"post_id": 22558, "ts": "2026-07-05T02:28:53Z", "hours": 4.8858, "text": "Performance increases, and a rewrite of the parser! Today was a nice easy day; I rewrote most of the parser, fixing a lot of bugs, and also learned how to use the performance analyzer in C++! The code is much more documented, with every line describing what it’s doing, making it super easy to follow along! The main change was an increase in speed from about 5% CPU usage to 1% and a 50MB reduction in RAM usage, allowing for 10 tabs at once, with only 61MB overall, rather than the 1000MB of something like Chrome! as well as about a 6% faster parse and load time. There is still a lot to optimize and work on, so I’ll keep doing that!"}, {"post_id": 21750, "ts": "2026-07-03T20:49:12Z", "hours": 5.1881, "text": "The first part is rewritten! Today, I worked on rewriting my network code with better comments, names, and methods. This took a while, as I created so many bugs, but it does work! The long part is still yet to come; however, the main things like the parser and the GUI are going to be a headache, but I should get it done! Overall a good day; ~4 files have been changed, with 6 more to go! Then after this, i want to add a history button, a settings page, and just improve performance, and formatting, then I’m done!"}, {"post_id": 21182, "ts": "2026-07-03T00:10:54Z", "hours": 3.2625, "text": "Updated the web version to the latest! Ok, so the main thing i did today was update the web version, and got it to match the main version overall, with everything! I also tried to get better formatting on the text, but i think my code is just so muddled its gonna be impossible, so my plan is to start rewriting it, with the things I’ve learned, and updating the comments (as i have a lot of them, in many wrong spaces)! that should take a bit, but hopefully will pay off in the future! If you want to try the new version, its here: https://k754a.hackclub.app/"}, {"post_id": 20502, "ts": "2026-07-02T03:18:13Z", "hours": 4.0853, "text": "Scroll bar support, bookmarks, and printing sites! Today I got a lot done; the main things were getting scrollbars, bookmarks, and getting sites to print all working! I ended up running into a lot of bugs (especially with the scroll bar), but now it works, so yeah! Currently the browser portion is far behind, and I want to update it, so I’ll try doing that next! Overall today was a good day; I got a lot done and a lot working! Anyways, thanks for reading! Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ "}, {"post_id": 20310, "ts": "2026-07-01T21:33:17Z", "hours": 3.6294, "text": "New icons and more buttons! Today, I was able to get icons supported into the engine (kind of)! The way I did it was by using a font modifier. I loaded the font I’ve been using and created some custom icons! A lot of the challenge was fixing text, as the new icons had issues with scaling and position, especially the back and forth arrows! Overall it was a great day. I’ll work on getting the printer button and the star button working; then it’s on to improving the engine! (also added a home button!)"}, {"post_id": 19574, "ts": "2026-06-30T22:14:59Z", "hours": 3.1631, "text": "Got Flex and Absolute boxes working on the engine! This took a while, just with fixing all the bugs and the weird reasons why some things would just not work at all lol! It was definitely a learning process for sure, and it should be easier to add more support for everything else in the future! This has to be one of the most difficult projects I’ve ever worked on, but it’s coming along! I want to do something a bit more fun, so my plan is to start work on a UI overall, just to give myself a break from all the crazy stuff! Anyways, thanks for reading! (oh, websites look so much nicer, with the new stuff!)"}, {"post_id": 19420, "ts": "2026-06-30T18:56:13Z", "hours": 4.5111, "text": "Rebuild of the layout engine! Today, I rebuilt a bunch of the layout engine to start support for flexboxes and divs! I mainly switched the code to do 2 passes, first to figure out spacing, size, and position, then to place the elements on it! Overall, this was a kind of boring day; it works basically the exact same rn, so there’s really nothing to show, but I’ll send a screenshot or two of my code! Anyways, the plan next is to get flexboxes working! After that, I might rewrite my engine, as it’s getting a bit ugly and crowded, and I coded some stuff pretty badly the first time around; it probably would only take about 10 hours, working off my code, but I think it would save me time in the future, but I’ll see! Anyways, thanks for reading! Also, if you want to support the project, dropping a star on the GitHub would be awesome; no pressure, though. :) https://github.com/k754a/C-Plus-Plus-Web-Engine"}, {"post_id": 19020, "ts": "2026-06-30T05:52:42Z", "hours": 3.1311, "text": "Lots of bug fixing on the engine! & Making it to the news letter! First of all, I want to thank everyone who has liked, reposted, and checked out my project. I made it to the Stardance newsletter, and it was so awesome :). Thank you so much! Today, I fixed a crazy amount of bugs; the main one was I would have these empty boxes, and it took me a good hour and a half to figure it out, but now text renders so much nicer! The next bug I fixed was clicking links. Up until this point, clicking links did not work at ALL, so now they work! (super happy about that)! History now works for each tab, not just one pool! I’m also starting work on making a YT video for this project. I’ve never made one before, so we will see how it turns out. For tomorrow, I’m going to work on the formatting of the engine, as normal websites have text like how Stardance has the home, notifications, rate, missions, etc, on the side and the main text in the middle, so I’ll hopefully get that working! Anyways, thanks for reading! You can check out my project below. :) Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ "}, {"post_id": 16595, "ts": "2026-06-27T00:22:18Z", "hours": 5.3503, "text": "Images Working for the Browser Engine! I’m going to be honest with you, this has to be the top 10 worst things I’ve ever coded. 😭😭 But images now can load; there are a few bugs, most images don’t load, and the ones that do load in pairs of 2 have weird bounding boxes. However, they do work, and that’s what I’m happy about! I’m going to do a quick side project, just to have a bit of room so I don’t overdo it, but overall it was good. Next I’ll just fix the bugs and start getting like the formatting of texts to start matching websites! The vid below shows them in action."}, {"post_id": 16093, "ts": "2026-06-26T05:07:23Z", "hours": 3.3942, "text": "Rebuilt part of the browser engine to handle tabs! Today, I worked on getting tabs working! It wasn’t as bad as I thought; the worst part was making all the UI elements and handling the inputs for them! I also found a bug; the engine easily uses my entire CPU’s dedicated GPU and causes issues with other apps lol, but I’ll fix it in a bit! Overall it was just bug fixes, quality-of-life improvements, and tabs! Hopefully tomorrow I’ll do images, then I’m taking a break for a bit and doing something else because I’m burnt out, and that’s a tip for all of you too: don’t overwork yourselves! The vid below shows it in action. Thanks for reading! Also, if you want to support the project, dropping a star on the GitHub would be awesome; no pressure, though. :) https://github.com/k754a/C-Plus-Plus-Web-Engine"}, {"post_id": 15935, "ts": "2026-06-25T21:47:30Z", "hours": 3.0242, "text": "Back and forth arrows, reloading, better formatting, and searching on the browser! Today was huge; I was able to get better formatting for text, search for things, and get buttons like back and forth and reloading working! My next task to tackle is images! The vid below shows all of the changes in action! Thanks for reading!"}, {"post_id": 15459, "ts": "2026-06-25T04:13:52Z", "hours": 2.7303, "text": "Links, and better rendering! Today I got links, and rendering improved rendering! Words now render together, rather than making a new line each time. I also got links, and that allows you to browse something like Wikipedia (the video below) much easier! For next time, I’m going to get the back and forward arrow and reload a working website! And may start work on getting the browser to have divs! Thanks for reading!"}, {"post_id": 15204, "ts": "2026-06-24T18:29:06Z", "hours": 2.1114, "text": "Today, I got a bunch of colors working! The browser engine can now render different colored backgrounds, texts, and highlights! This actually wasn’t too bad, as the hardest part was just fixing all the bugs from CSS being such a bad language, but overall it turned out awesome!"}, {"post_id": 14842, "ts": "2026-06-24T03:19:32Z", "hours": 2.5572, "text": "Version 0.1.0 of the Browser Engine! If you don’t know what I’m building, I’m creating a custom browser engine in C++ from scratch, something like Chromium, but a lot more bare bones. Today, I did a bunch of things. I got my first CSS attributes to detect and work! Text now is not hardcoded and dynamically scales based on the CSS! This really wasn’t too hard, so I moved on to the next thing, getting a working UI! The UI I’ve created is basic, but it allows you to search without using the terminal and search multiple things! Overall this was an awesome day for today; my plan over the coming days is to support more CSS and work on fixing performance and overflow bugs! Thanks for reading. :) Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ The video shows the standalone app, and searching 2 different sites."}, {"post_id": 14688, "ts": "2026-06-23T21:39:00Z", "hours": 3.2131, "text": "CSS Parsing! I got CSS working! I was able to get my CSS parser working on the engine and parse properly. This wasn’t as easy as I thought, as my first attempt worked but was dreadfully slow (10+ seconds), so a lot of the time went into rewrites and optimizations, bringing it from 10+ to about 2 seconds for huge CSS (1000+ lines of CSS)! Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ Video below shows it loading the hackclub website!"}, {"post_id": 13373, "ts": "2026-06-21T22:06:37Z", "hours": 2.1894, "text": "The browser now has a GUI! This took a bit and a few tutorials, but now you’re able to browse the web with no styles, one font, and just things like headers, but for now this is super awesome! I’ve been going pretty hard at it the last few days, and I lowkey need a break, or else I’m gonna get super burnt out, so I might just start a side project for the fun of it, something easy when I’m feeling a bit sluggish. When I come back, I’ll work on adding a UI around the browser (to get fully away from the terminal), and then it’s just getting CSS parsed and working, which isn’t too bad at all. You can check out the code and try the project below. C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine"}, {"post_id": 12960, "ts": "2026-06-21T06:40:22Z", "hours": 1.6656, "text": "C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine Got started work on the GUI using SDL3! Today, I worked on getting a GUI up and running; for now it’s just a window, but I’ll get it working! I also started work on a logo, as I felt a bit burnt out during today, but nothing really came of it, as all my designs I tried sucked; the best one I linked below. I also created the first readme!"}, {"post_id": 12643, "ts": "2026-06-20T17:28:53Z", "hours": 0.7358, "text": "This is a super short devlog, I updated the server so that it uses my latest code, and supports HTTPS! you can try it out with the link below. https://k754a.hackclub.app/"}, {"post_id": 12395, "ts": "2026-06-20T07:09:43Z", "hours": 2.2253, "text": "C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine Got the DOM tree working! Ok, in this devlog, I fixed the DOM tree issues; it seemed to be a combo of issues with the parser (I fixed that) and some actually easy fixes from the DOM tree; it just took a rewrite! I was also able to code a way to see the tree: DOM TREE ├── [ROOT] │ ├── [!DOCTYPE] │ │ ├── [html] │ │ │ ├── [body] │ │ │ │ ├── [h1] │ │ │ │ │ └──── \" Heading test \" │ │ │ │ ├── [p] │ │ │ │ │ └──── \" Paragraph test \" │ │ │ │ ├── [p] │ │ │ │ │ └──── \" Multiple \" │ │ │ │ │ ├── [strong] │ │ │ │ │ │ └──── \" Char \" │ │ │ │ │ └──── \" Test \" We are super close to getting our first text on the screen! (Maybe just a devlog or 2). The vid below shows it in action! Thanks for reading :)"}, {"post_id": 12205, "ts": "2026-06-19T22:30:15Z", "hours": 1.7031, "text": "Today I Worked on the DOM tree, for my C++ Web Engine from scratch! Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ Today was my first attempt at building a DOM tree and also learning structure types and building trees. This first attempt, after learning a lot about how trees work, doesn’t really work fully; it seems to have issues when parsing tokens and just processing them overall, so the hope is that I can rebuild this for next time! Overall this was a pretty boring day; hopefully I’ll get the DOM tree working, then it’s straight to rendering!"}, {"post_id": 11748, "ts": "2026-06-19T04:11:02Z", "hours": 2.1842, "text": "Fixed my parser! Today’s update: I fixed my parser. The main issue was that it didn’t parse in order; it would do it like this: Text that should be in <a></a> The problem was that I couldn’t use this for my DOM tree, and getting my DOM program to do this would be slow and inefficient. Also, the cause of this was because I didn’t check for conditions that it was a start, middle, or end tag. I did it so I bunched the start and end together, and this was a huge problem because it ended up being put at the bottom, which wouldn’t work at all! Fixing it took a hot minute, but tomorrow I should have DOM’s working. Ok, thanks for reading that! The before and after are in the images below. Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/"}, {"post_id": 10978, "ts": "2026-06-18T00:22:11Z", "hours": 3.2256, "text": "HTTPS Working I was able to get HTTPS working on the C++ engine and get it to properly parse. Most websites work on it, but they were a bit slow, so I ended up rebuilding parts of the tokenizer to be faster, changing the speed overall from 3+ seconds to under 0.2 seconds. The main problem is Google websites don’t load at all, so I’ll fix that in the future. Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ The video below shows it in action, loading the Hack Club web page super fast."}, {"post_id": 10261, "ts": "2026-06-16T22:03:22Z", "hours": 2.195, "text": "C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine I built a custom tokenizer for HTTP to be able to load and render websites! I’m building a super-fast, pure custom C++ browser engine from scratch, and the thing I built today was an HTML parser! HTML parsers are super hard to code, thanks to HTML being a very loose markup language. There can be tons of stuff, like: Missing divs <div> Hello World! </p></div> Missing end tags <img src= \"image.png\" Even nested divs! <div class= \"container\" ><span> Nested Elements </span></div> So I needed to build a parser that could handle all of it. Another challenge I’ve been trying is forcing myself to stop making variables for everything and trying to be minimal and fast! This new update also added local HTML loading; this lets me test much faster and test certain things, especially for the DOM and render tree! Some struggles I ran into while building this project were just the amount of errors and debugging I had to do to figure out what went wrong, as well as working with large pieces of code with constant changes. This part really taught me about data types, how to find and remove elements from multiple different classes and types, how to make loops efficient, and how to use vectors! My plan for the next devlog will be building a DOM tree or getting HTTPS to work. After doing some research, I found that I can use: #include <wininet.h> to help get this thing working, so that’s my plan! Okay, this was super long. Thanks for looking at it. The video linked below is a demo of it loading and tokenizing some text locally on a machine!"}, {"post_id": 9517, "ts": "2026-06-15T21:46:02Z", "hours": 3.3375, "text": "In this devlog I built the first half of my parser for the web engine; it can go through a website and match tokens! There are a few issues; some things, like conditions (like <a href=> arnt supported), as well as I can’t pull text from things like headers and stuff. I also made an animation so people can see how it works! The animations basically shows how my buffer system, and determining the order of tokens works, to prevent things like mismatches!"}, {"post_id": 8360, "ts": "2026-06-13T21:58:37Z", "hours": 1.1603, "text": "I was able to build a website demo for people to try out. To make this, I ran it on the Nest servers from Hack Club! However, I used a bit of AI, as I had never set up a server, as well as my project being only built for Windows. However, AI still hasn’t and will not be used in the main project. I did this as a bit of a time saver and to not have to commit 40+ times to test it lol. https://k754a.hackclub.app/"}, {"post_id": 7951, "ts": "2026-06-13T08:10:50Z", "hours": 1.3631, "text": "First version of the browser. It is currently all through the terminal; there is no formatting, CSS, JavaScript, fonts, styles, or even structure to the text. However, any HTTP website can now be rendered into readable text, even if it’s a bit hard to see, lol! The next version of this, I’m going to hook up a rendering pipeline (not sure to what yet, though). Then it will be allowing different fonts and structures, and then finally, support for some CSS. What I have just described will probably take 200 hours!"}, {"post_id": 7836, "ts": "2026-06-13T02:24:42Z", "hours": 1.7817, "text": "I update the web browser engine to allow the download of full files from websites in HTTP. This will pave the way to let me parse the website for the next devlog! Some more changes I made were a bit more error handling and also refining some of the output to make it cleaner and retiring some of the older debug logs. The next difficult part will be some basic parsing and pulling out text Then I’ll attempt to render text without position (this will take about ~4 hours), and then I’ll work on formatting."}, {"post_id": 7688, "ts": "2026-06-12T20:48:29Z", "hours": 1.8869, "text": "I built the first version of my web client. It can now pull HTML data from HTTP sites, using a TCP socket. If you don’t know what I’m working on, I’m building a pure C++ browser engine, to load and render websites like google without the use of AI and libraries. Note that it does not work for https, as to build a handshake between the 2 is super difficult, even for a good programmer. The next step will be to pull an entire webpage off and save it in RAM. Thanks for reading, and I hope you follow my journey!"}, {"post_id": 7066, "ts": "2026-06-11T20:43:24Z", "hours": 1.8558, "text": "Using C++ and native windows libraries, i was able to connect to a website and pull some data off of it. this was super difficult, but im super happy it worked, its able to connect to any IPV4, http site. my next plan is to start pulling files, like html into ram from websites. "}, {"post_id": 4053, "ts": "2026-06-07T07:22:15Z", "hours": 1.5675, "text": "The overall of my essay, is just laying out how im going to be building a web engine from scratch. its not going to run JavaScirpt or interface with HTTPS off the bat, as i have to code all of that and it sucks. https://github.com/k754a/C-Plus-Plus-Web-Engine/blob/main/README.md (this is a link to it as i could not upload a pdf file.) Overall, this will be one of the most complex projects I’ve ever tried/attempted to take on, even over https://github.com/k754a/C-Custom-Code-Editor by a long shot. This will 100% test my research, development, and C++ skills, but I believe that even if I’m not able to pull this off, I will learn a lot about how browsers work and good C++ practices. I hope you will follow my progress on GitHub and Stardance as I build this!"}]...
|
Title: Browse++ by @kallenseelo | Stardance
Devlo Title: Browse++ by @kallenseelo | Stardance
Devlogs:
The overall of my essay, is just laying out how im going to be building a web engine from scratch. its not going to run JavaScirpt or interface with HTTPS off the bat, as i have to code all of that and it sucks. https://github.com/k754a/C-Plus-Plus-Web-Engine/blob/main/README.md (this is a link to it as i could not upload a pdf file.) Overall, this will be one of the most complex projects I’ve ever tried/attempted to take on, even over https://github.com/k754a/C-Custom-Code-Editor by a long shot. This will 100% test my research, development, and C++ skills, but I believe that even if I’m not able to pull this off, I will learn a lot about how browsers work and good C++ practices. I hope you will follow my progress on GitHub and Stardance as I build this!
Using C++ and native windows libraries, i was able to connect to a website and pull some data off of it. this was super difficult, but im super happy it worked, its able to connect to any IPV4, http site. my next plan is to start pulling files, like html into ram from websites.
I built the first version of my web client. It can now pull HTML data from HTTP sites, using a TCP socket. If you don’t know what I’m working on, I’m building a pure C++ browser engine, to load and render websites like google without the use of AI and libraries. Note that it does not work for https, as to build a handshake between the 2 is super difficult, even for a good programmer. The next step will be to pull an entire webpage off and save it in RAM. Thanks for reading, and I hope you follow my journey!
I update the web browser engine to allow the download of full files from websites in HTTP. This will pave the way to let me parse the website for the next devlog! Some more changes I made were a bit more error handling and also refining some of the output to make it cleaner and retiring some of the older debug logs. The next difficult part will be some basic parsing and pulling out text Then I’ll attempt to render text without position (this will take about ~4 hours), and then I’ll work on formatting.
First version of the browser. It is currently all through the terminal; there is no formatting, CSS, JavaScript, fonts, styles, or even structure to the text. However, any HTTP website can now be rendered into readable text, even if it’s a bit hard to see, lol! The next version of this, I’m going to hook up a rendering pipeline (not sure to what yet, though). Then it will be allowing different fonts and structures, and then finally, support for some CSS. What I have just described will probably take 200 hours!
I was able to build a website demo for people to try out. To make this, I ran it on the Nest servers from Hack Club! However, I used a bit of AI, as I had never set up a server, as well as my project being only built for Windows. However, AI still hasn’t and will not be used in the main project. I did this as a bit of a time saver and to not have to commit 40+ times to test it lol. https://k754a.hackclub.app/
In this devlog I built the first half of my parser for the web engine; it can go through a website and match tokens! There are a few issues; some things, like conditions (like <a href=> arnt supported), as well as I can’t pull text from things like headers and stuff. I also made an animation so people can see how it works! The animations basically shows how my buffer system, and determining the order of tokens works, to prevent things like mismatches!
C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine I built a custom tokenizer for HTTP to be able to load and render websites! I’m building a super-fast, pure custom C++ browser engine from scratch, and the thing I built today was an HTML parser! HTML parsers are super hard to code, thanks to HTML being a very loose markup language. There can be tons of stuff, like: Missing divs <div> Hello World! </p></div> Missing end tags <img src= "image.png" Even nested divs! <div class= "container" ><span> Nested Elements </span></div> So I needed to build a parser that could handle all of it. Another challenge I’ve been trying is forcing myself to stop making variables for everything and trying to be minimal and fast! This new update also added local HTML loading; this lets me test much faster and test certain things, especially for the DOM and render tree! Some struggles I ran into while building this project were just the amount of errors and debugging I had to do to figure out what went wrong, as well as working with large pieces of code with constant changes. This part really taught me about data types, how to find and remove elements from multiple different classes and types, how to make loops efficient, and how to use vectors! My plan for the next devlog will be building a DOM tree or getting HTTPS to work. After doing some research, I found that I can use: #include <wininet.h> to help get this thing working, so that’s my plan! Okay, this was super long. Thanks for looking at it. The video linked below is a demo of it loading and tokenizing some text locally on a machine!
HTTPS Working I was able to get HTTPS working on the C++ engine and get it to properly parse. Most websites work on it, but they were a bit slow, so I ended up rebuilding parts of the tokenizer to be faster, changing the speed overall from 3+ seconds to under 0.2 seconds. The main problem is Google websites don’t load at all, so I’ll fix that in the future. Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ The video below shows it in action, loading the Hack Club web page super fast.
Fixed my parser! Today’s update: I fixed my parser. The main issue was that it didn’t parse in order; it would do it like this: Text that should be in <a></a> The problem was that I couldn’t use this for my DOM tree, and getting my DOM program to do this would be slow and inefficient. Also, the cause of this was because I didn’t check for conditions that it was a start, middle, or end tag. I did it so I bunched the start and end together, and this was a huge problem because it ended up being put at the bottom, which wouldn’t work at all! Fixing it took a hot minute, but tomorrow I should have DOM’s working. Ok, thanks for reading that! The before and after are in the images below. Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/
Today I Worked on the DOM tree, for my C++ Web Engine from scratch! Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ Today was my first attempt at building a DOM tree and also learning structure types and building trees. This first attempt, after learning a lot about how trees work, doesn’t really work fully; it seems to have issues when parsing tokens and just processing them overall, so the hope is that I can rebuild this for next time! Overall this was a pretty boring day; hopefully I’ll get the DOM tree working, then it’s straight to rendering!
C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine Got the DOM tree working! Ok, in this devlog, I fixed the DOM tree issues; it seemed to be a combo of issues with the parser (I fixed that) and some actually easy fixes from the DOM tree; it just took a rewrite! I was also able to code a way to see the tree: DOM TREE ├── [ROOT] │ ├── [!DOCTYPE] │ │ ├── [html] │ │ │ ├── [body] │ │ │ │ ├── [h1] │ │ │ │ │ └──── " Heading test " │ │ │ │ ├── [p] │ │ │ │ │ └──── " Paragraph test " │ │ │ │ ├── [p] │ │ │ │ │ └──── " Multiple " │ │ │ │ │ ├── [strong] │ │ │ │ │ │ └──── " Char " │ │ │ │ │ └──── " Test " We are super close to getting our first text on the screen! (Maybe just a devlog or 2). The vid below shows it in action! Thanks for reading :)
This is a super short devlog, I updated the server so that it uses my latest code, and supports HTTPS! you can try it out with the link below. https://k754a.hackclub.app/
C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine Got started work on the GUI using SDL3! Today, I worked on getting a GUI up and running; for now it’s just a window, but I’ll get it working! I also started work on a logo, as I felt a bit burnt out during today, but nothing really came of it, as all my designs I tried sucked; the best one I linked below. I also created the first readme!
The browser now has a GUI! This took a bit and a few tutorials, but now you’re able to browse the web with no styles, one font, and just things like headers, but for now this is super awesome! I’ve been going pretty hard at it the last few days, and I lowkey need a break, or else I’m gonna get super burnt out, so I might just start a side project for the fun of it, something easy when I’m feeling a bit sluggish. When I come back, I’ll work on adding a UI around the browser (to get fully away from the terminal), and then it’s just getting CSS parsed and working, which isn’t too bad at all. You can check out the code and try the project below. C++ Browser Engine You can try it online! : https://k754a.hackclub.app/ Source code: https://github.com/k754a/C-Plus-Plus-Web-Engine
CSS Parsing! I got CSS working! I was able to get my CSS parser working on the engine and parse properly. This wasn’t as easy as I thought, as my first attempt worked but was dreadfully slow (10+ seconds), so a lot of the time went into rewrites and optimizations, bringing it from 10+ to about 2 seconds for huge CSS (1000+ lines of CSS)! Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ Video below shows it loading the hackclub website!
Version 0.1.0 of the Browser Engine! If you don’t know what I’m building, I’m creating a custom browser engine in C++ from scratch, something like Chromium, but a lot more bare bones. Today, I did a bunch of things. I got my first CSS attributes to detect and work! Text now is not hardcoded and dynamically scales based on the CSS! This really wasn’t too hard, so I moved on to the next thing, getting a working UI! The UI I’ve created is basic, but it allows you to search without using the terminal and search multiple things! Overall this was an awesome day for today; my plan over the coming days is to support more CSS and work on fixing performance and overflow bugs! Thanks for reading. :) Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/ The video shows the standalone app, and searching 2 different sites.
Today, I got a bunch of colors working! The browser engine can now render different colored backgrounds, texts, and highlights! This actually wasn’t too bad, as the hardest part was just fixing all the bugs from CSS being such a bad language, but overall it turned out awesome!
Links, and better rendering! Today I got links, and rendering improved rendering! Words now render together, rather than making a new line each time. I also got links, and that allows you to browse something like Wikipedia (the video below) much easier! For next time, I’m going to get the back and forward arrow and reload a working website! And may start work on getting the browser to have divs! Thanks for reading!
Back and forth arrows, reloading, better formatting, and searching on the browser! Today was huge; I was able to get better formatting for text, search for things, and get buttons like back and forth and reloading working! My next task to tackle is images! The vid below shows all of the changes in action! Thanks for reading!
Rebuilt part of the browser engine to handle tabs! Today, I worked on getting tabs working! It wasn’t as bad as I thought; the worst part was making all the UI elements and handling the inputs for them! I also found a bug; the engine easily uses my entire CPU’s dedicated GPU and causes issues with other apps lol, but I’ll fix it in a bit! Overall it was just bug fixes, quality-of-life improvements, and tabs! Hopefully tomorrow I’ll do images, then I’m taking a break for a bit and doing something else because I’m burnt out, and that’s a tip for all of you too: don’t overwork yourselves! The vid below shows it in action. Thanks for reading! Also, if you want to support the project, dropping a star on the GitHub would be awesome; no pressure, though. :) https://github.com/k754a/C-Plus-Plus-Web-Engine
Images Working for the Browser Engine! I’m going to be honest with you, this has to be the top 10 worst things I’ve ever coded. 😭😭 But images now can load; there are a few bugs, most images don’t load, and the ones that do load in pairs of 2 have weird bounding boxes. However, they do work, and that’s what I’m happy about! I’m going to do a quick side project, just to have a bit of room so I don’t overdo it, but overall it was good. Next I’ll just fix the bugs and start getting like the formatting of texts to start matching websites! The vid below shows them in action.
Lots of bug fixing on the engine! & Making it to the news letter! First of all, I want to thank everyone who has liked, reposted, and checked out my project. I made it to the Stardance newsletter, and it was so awesome :). Thank you so much! Today, I fixed a crazy amount of bugs; the main one was I would have these empty boxes, and it took me a good hour and a half to figure it out, but now text renders so much nicer! The next bug I fixed was clicking links. Up until this point, clicking links did not work at ALL, so now they work! (super happy about that)! History now works for each tab, not just one pool! I’m also starting work on making a YT video for this project. I’ve never made one before, so we will see how it turns out. For tomorrow, I’m going to work on the formatting of the engine, as normal websites have text like how Stardance has the home, notifications, rate, missions, etc, on the side and the main text in the middle, so I’ll hopefully get that working! Anyways, thanks for reading! You can check out my project below. :) Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/
Rebuild of the layout engine! Today, I rebuilt a bunch of the layout engine to start support for flexboxes and divs! I mainly switched the code to do 2 passes, first to figure out spacing, size, and position, then to place the elements on it! Overall, this was a kind of boring day; it works basically the exact same rn, so there’s really nothing to show, but I’ll send a screenshot or two of my code! Anyways, the plan next is to get flexboxes working! After that, I might rewrite my engine, as it’s getting a bit ugly and crowded, and I coded some stuff pretty badly the first time around; it probably would only take about 10 hours, working off my code, but I think it would save me time in the future, but I’ll see! Anyways, thanks for reading! Also, if you want to support the project, dropping a star on the GitHub would be awesome; no pressure, though. :) https://github.com/k754a/C-Plus-Plus-Web-Engine
Got Flex and Absolute boxes working on the engine! This took a while, just with fixing all the bugs and the weird reasons why some things would just not work at all lol! It was definitely a learning process for sure, and it should be easier to add more support for everything else in the future! This has to be one of the most difficult projects I’ve ever worked on, but it’s coming along! I want to do something a bit more fun, so my plan is to start work on a UI overall, just to give myself a break from all the crazy stuff! Anyways, thanks for reading! (oh, websites look so much nicer, with the new stuff!)
New icons and more buttons! Today, I was able to get icons supported into the engine (kind of)! The way I did it was by using a font modifier. I loaded the font I’ve been using and created some custom icons! A lot of the challenge was fixing text, as the new icons had issues with scaling and position, especially the back and forth arrows! Overall it was a great day. I’ll work on getting the printer button and the star button working; then it’s on to improving the engine! (also added a home button!)
Scroll bar support, bookmarks, and printing sites! Today I got a lot done; the main things were getting scrollbars, bookmarks, and getting sites to print all working! I ended up running into a lot of bugs (especially with the scroll bar), but now it works, so yeah! Currently the browser portion is far behind, and I want to update it, so I’ll try doing that next! Overall today was a good day; I got a lot done and a lot working! Anyways, thanks for reading! Code / Project You can check out the code here: https://github.com/k754a/C-Plus-Plus-Web-Engine And try a older version of it: https://k754a.hackclub.app/
Updated the web version to the latest! Ok, so the main thing i did today was update the web version, and got it to match the main version overall, with everything! I also tried to get better formatting on the text, but i think my code is just so muddled its gonna be impossible, so my plan is to start rewriting it, with the things I’ve learned, and updating the comments (as i have a lot of them, in many wrong spaces)! that should take a bit, but hopefully will pay off in the future! If you want to try the new version, its here: https://k754a.hackclub.app/
The first part is rewritten! Today, I worked on rewriting my network code with better comments, names, and methods. This took a while, as I created so many bugs, but it does work! The long part is still yet to come; however, the main things like the parser and the GUI are going to be a headache, but I should get it done! Overall a good day; ~4 files have been changed, with 6 more to go! Then after this, i want to add a history button, a settings page, and just improve performance, and formatting, then I’m done!
Performance increases, and a rewrite of the parser! Today was a nice easy day; I rewrote most of the parser, fixing a lot of bugs, and also learned how to use the performance analyzer in C++! The code is much more documented, with every line describing what it’s doing, making it super easy to follow along! The main change was an increase in speed from about 5% CPU usage to 1% and a 50MB reduction in RAM usage, allowing for 10 tabs at once, with only 61MB overall, rather than the 1000MB of something like Chrome! as well as about a 6% faster parse and load time. There is still a lot to optimize and work on, so I’ll keep doing that!
Performance analyzer and comments for our DOM! Today, I created a performance analyzer that could tell me how many microseconds it takes to get through certain programs. This helped a lot with optimization and making things faster! I also finished and optimized the DOM code! Today was a pretty basic day; I’m a bit busy over this coming week, so it’s going to be a bit more broken up, but overall a good day today!
Lots of optimization, better comments, and bug fixes! Sorry for not posting for a few days; I was super busy and didn’t really have the time. However, I’m back at it! Over the last week, I’ve been changing and updating lots of stuff. The first one was much better comments for the layout.cpp file! I still have a bit left to do, but I was getting pretty tired, so I moved onto making the engine a bit faster! One of the main things I did was use threading, passing the text off to the GPU rather than going from CPU to GPU, as well as multithreading it. This allows about 2 seconds faster search time, and I have some more ideas for changes too! The reason this took so long is the number of bugs I introduced. The Gui.cpp is huge (2000+ lines), so I want to really rewrite it, as there is SO much junk and bad coding practices lol. Overall though, it was a good day, and I think I want to start tackling JavaScript after adding a lot of QofL and fixes to a ton of bugs! Thanks for reading!
Dark mode and bug fixes (with more bugs) and HTTP error codes Today, I recorded most of my link and search handling to be better at handling URLs and links like /home. I also added a dark mode! (Super helpful on the eyes lol) Unfortunately there is a big bug, some websites will just not work anymore (like hackclub), and also websites take super long to load, this is because the images it is processing are in a buffer, and this buffer needs to finish the images of one page before the other, i think i have an idea to fix it, so I hope I will be able too soon! But overall, this update changed a lot of bugs, and I’m hoping it can be even better for the future!
Lots of bug fixes, quality-of-life changes, and the start of a rewrite! try it out! https://k754a.hackclub.app/ I’ve been still a bit busy, but over the last 2 days, I ended up fixing a lot of bugs with crashing, especially with dealing with multithreaded tab handling. Some of the quality-of-life changes I did were creating a new tab handle that allows you to go back to the new tab in history and other small changes! The biggest bug was where, if you searched something and, while it was loading, switched tabs, it would overwrite your tab to the one you switched to, not the original one you searched in. Now that is fully fixed! Overall a good day! I’m going to fully rewrite and comment all 2500+ lines of the GUI and other functions, fix a LOT of bugs, and then add settings, history, and a few other things! Thanks for reading!
Halfway done rewriting Gui.cpp—Lots of bug fixes and speed improvements! If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine Over the last 2 days, I’ve rewritten about half of GUI.cpp (up to the GUIRENDER function), with changes, bug fixes, and speedups that helped the engine a lot! The main speedup came from changing the way I handled the font so that I loaded it once, not every loop. This allowed a lot less SSD usage and a gradual increase of performance, up to about 50% for large sites! I worked a lot on organization and got it so that different functions are grouped together, even moving some to different scripts that fit better! The final change was reworking how images and the home button worked, and it allowed me to drop a function, as well as have much faster image batch loading times! Going through the code made me realize how many bugs and bad code I did. I fixed a lot of it, but I still got a bit to go! Overall it was a good day. My plan for everything else is to finish the rest of GUI.cpp, start work on a settings page, and try to make the parser faster still! Thanks for reading!
Local file loading, better comments, and crash fixing! If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine Today, I worked a TON; I got through all the comments for the start and collision events for all the buttons and things in GUIRENDER . I also added some new features and fixed some huge bugs! The new feature is file loading! You can now load PNG, JPEG, HTML, TXT, and HTM files straight from the search bar! The main fix, and what took most of my time, was the prerender. as i was working on slimming the new tab create button down, i found a lot of strange bugs, esspicaly with webpages with large amounts of images (like stardance), this lead me down a lot of changes, overall, it was a issue with how i checked to see if i wanted to load it from disk, but it was also a bunch of stuff to do with multithreading, and locking parts, but after a lot of work, i fixed it! I still need to fix up and finish GUIRENDER , but once I’m done with that, it’s off to work on the settings page. Thanks for reading!
Quality of life improvements, more comments, and finally fixed the crashes If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine Ok, so first off, the huge crash I was getting was because of using a global variable for holding the link and not a local variable, and when 2 threads attempted to use it at the same time, my app would freeze and crash, so now it runs great! Some of the QofL improvements are adding keyboard shortcuts and the ability to close tabs by pressing the middle button down, like a real browser! Then there were a lot more comments that I am so close to being done! Overall a decent 2 days; I’m definitely getting a bit bored of the comments, so my plan is to work on my other project for a bit and come back later! But yeah, a good day. :)
Done all comments and released 0.1.0 ! If you want to check out or support this project, you can click the GitHub link! https://github.com/k754a/C-Plus-Plus-Web-Engine I ended up going on a camping trip with the homies, so I didn’t work on this for a bit, but when I came back, I fixed a few more bugs, ended up finishing all the comments for GUI.cpp, and created release 0.1. 0! This is huge, as I was able to fix all known bugs and get a working version out! For version 1.0.0, I want to fully fix the layout engine to render close to a modern browser, add a settings page, fix performance, and add things like buttons and checkboxes on websites! Thanks for reading!
Settings button, bug fixes, scroll bar drag, and a context menu! This update was just a crazy number of features! I ended up shifting around the top area to make room for a settings button (that I will deal with soon), then I decided to allow scroll bar drag so that you can scroll through a page with the bar, not just your wheel! The big thing was the context menu; this took the most time and was the most difficult, as it was just a pain to get 2 windows rendering, but now, it works super well! I also attempted to work on getting a better layout, but I just screwed a lot of stuff up lol, so that didn’t really work out, but that’s ok!
Add context menu and startup URL (and fixed a LOT of bugs)! Sorry it’s been like 2 weeks, but after finishing my other project, I’m back at it! Over the last 2 days, I worked a LOT on the context menu and bug fixes (like loading text files into the engine, and old ones I caught working on this!). The context menu changes its options based on what things you right-click (like a real context menu), so for example, when I click a link, I get way more different options than if I clicked a tab. This allows for a lot of customization, and it’s basically fully implemented (minus a few features I want to add). The startup URL is kind of a part of that; when clicking a link, you have the choice to open it in a new window, and getting a URL that can change on startup really made it easy to add the feature! So overall a good day. What I’m going to work on next is the settings menu. Thanks for reading!
HTML text-align handling, history tab, and settings. Ok, I’m going to be honest, I looked at that settings menu and genuinely did NOTHING. It’s going to be a pain, so I’m just avoiding it till I have no choice. Something HUGE, though, I’ve gotten working is getting proper styling so that text can render in the middle and right (with way more text-align and style options to come)! This really opens the door for much more dynamic rendering text, though there are still a few bugs with it (large text goes off screen, and the home screen doesn’t apply the settings), so there is still a lot to fix, but honestly, I didn’t even think it was possible, so this is awesome! Overall a good day; I’m going to continue working on history and styles and then the settings lol.
More text formatting and positioning. (and LOTS of bug fixing) Today was a great day of work; I got height adjusting working, and this took way longer than I thought, just with all the bugs and problems I ran into, with old code I had created, but I was able to solve it all. The other notable thing is having another way to color text and the bg of text, but also, I fixed it so that none of the text falls off the edge in the positioning, so overall a good day! I’m actually so close to being done; I’ve wanted to go to 200 hours, then kind of just chill and slow down, and I’m at 14 hours left of that! Then I’ll ship. But I do want to finish the history menu, though I may leave the settings menu on pause. (for now). So yeah!
More HTML style options, browser history, and work on the Readme.md Ok, so over the last 6 hours this is what I worked on. First, I worked on adding more style options, so now you can set font size (another way) and set font boldness (like normal HTML), and you can now add custom number values to the vertical alignment (that in the vid is shown on the homepage!). I also worked on the browser history now, saving it to a txt file. You can scroll back through what you’ve searched before (and add a button to clear it next update).I also was working on the readme, making it clear and better before the ship. Overall a good day, and I think I’ll try to do the settings menu, aswell as support for buttons in the viewer (though they probably won’t do anything thanks to not having JavaScript), so yeah!
Updated context menu, Desktop Logo, Hover effects, Rework of the input bar, and bug fixes! Ok, its like 1:30 am rn lol, so im going to try to do this fast. First, i updated the context menu, the menu now has a nice drop shadow, and looks so much nicer than before (lemme know what you think about it). second, i added a basic desktop logo (a grayish black circle) that changes based on light or dark mode (the vid shows it well). Another change was hover effects! now hovering over buttons changes the color slighly, making it a bit simpler to see that your over something, and aswell as being a bit more reactive! the input bar rework allows clicking onto the bar, rather than always typing on the bar (for ctr-F coming soon!). Finally, bug fixes, i had a lot of issues with having both custom x pos, and custom y pos, but thats all fixed now! aswell as the backgrounds not updating per tab (thats now fixed too!). Finally II, i worked on the readme a bit! Overall it was a good day (with over 10 hours of work lol), and i still have a few features to add! so yeah, thanks for reading! (as well as excuse the spelling mistakes, there might be a lot lol)
Linux support!!! Over the last few days, I’ve been working on migrating the project from MSBuild to CMake, allowing it to run on both Linux and macOS (though I haven’t been able to test it lol). Linux has been tested, however, and everything works on it (except I haven’t migrated the networking, so that’s still to do!!), so there are still some things that need to be done, but it boots on my Debian VM and renders! So I’m super happy for that. Some other changes were that I got autocompletion (you’ll see it in a sec) as well as getting the open in a new tab working a bit better for both Windows and Linux!! Overall a good day!
Final work on the readme, getting a standalone windows build! Over the last few days, I’ve been hard at work getting the readme finished up, it was super tedious but now its in a good spot for a ship, and looks awesome! I’ve also gotten the windows build to be standalone! this took a lot of googling, but now with CMake, it now can run on anyone’s computer, without needing anything else!! Other than that, its been a bit of work on the Linux side, i attempted to get some sort of https working, but because its a vm, its super screwy, and i hope to be able to have a computer that has Linux on it for use, but we will see ig. Also made a YT vid https://www.youtube.com/watch?v=I-mCh9xSYeg&t=8s Overall a good day!
Ships:
Browse++ A C++ Browser Engine from Scratch. Overview: Over the course of 2 months and almost 300 hours (165 coding) of work, I built a browser engine that can download, parse, and render websites with tab handling and a lot of other cool features, from almost complete scratch! What’s a Browser Engine? A basic definition of a browser engine is a program that pulls content from a website, then takes that content, gives the elements the properties assigned in the CSS, and then renders the content on the screen. They end up being very difficult to build, as HTML and CSS can run and be run without errors, so that makes it super hard to build an engine that can properly handle, parse, and render a site with a lot of errors. How to use this? If you would like to use my browser engine, there is quite a few ways to do so! NOTE: I do not have an actual Linux laptop, so the Linux version is super buggy (and does not have any networking), but I really hope to fix that in the future, but you can use the more outdated web demo! If you don’t want to download anything, you can use the Web Demo , its a bit behind, but it shows it nicely. If you are willing to download, and you are on windows , you can go to the github here and download to try it! If you want to see the real thing, I have a video going through it here. What am I most proud of? I think the thing I’m most proud of was the amount of browser systems i was able to build from scratch , this was a super fun thing to build, but it had a lot of challenges and ups and down, and a lot of hours fixing bugs that make no sense at all lol! The other thing I’m most proud of is not using any AI on the main engine; there was a bit of AI used for the web demo, as that wasn’t my main focus, but the browser engine overall used absolutely no AI! AI usage GLM 5.2 was used to convert the Windows code to a web server for Linux (way before I supported Linux). Any code changes are clearly marked with ( // CHANGED WITH AI: ... ) if they have been changed with AI, and very little has been changed....
|
1792878475.348404
|
1793742475.348404
|
|
5016
|
StarDancers by @4lvaret | Stardance
|
4lvaret
|
1
|
1.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-04T14:59:23Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "i uhh made a stupid little chat service because my friends wanted me to", "repo": "https://github.com/simpansoftware/stardancers/", "demo": "https://simpansoftware.cc/stardancedemo/"}]...
|
[{"post_id": 2148, "ts": "2026 [{"post_id": 2148, "ts": "2026-06-04T14:17:23Z", "hours": 0.3886, "text": "uhh so like uhhhhh i (or a large language model) updated the js and the python, for which i will take zero credit because i did not make them"}, {"post_id": 880, "ts": "2026-06-02T16:35:02Z", "hours": 0.7917, "text": "got the local version working correctly, getting some clanker to make me a backend because i do not know flask nor do i care enough to learn flask"}]...
|
Title: StarDancers by @4lvaret | Stardance
Devlog Title: StarDancers by @4lvaret | Stardance
Devlogs:
got the local version working correctly, getting some clanker to make me a backend because i do not know flask nor do i care enough to learn flask
uhh so like uhhhhh i (or a large language model) updated the js and the python, for which i will take zero credit because i did not make them
Ships:
i uhh made a stupid little chat service because my friends wanted me to...
|
1792993839.1375492
|
1793080239.1375492
|
|
5020
|
FLOWS by @UntitledMacaw | Stardance
|
UntitledMacaw
|
1
|
34.44
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-21T18:21:49Z", "hours": 29.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is FLOWS. It is a program that takes in terrain data and water infiltration data and finds bowl-like depressions (or simply “basins”). Why is that useful: for each basin, water-height doesn’t change (for the same rainfall). This means we can pre-calculate various rainfall scenarios and store their results, so we can have a simple and quick way of estimating flood risk. Compilation was also made focusing on lower-end hardware, were we avoid feeding the entire data into the RAM, and instead partition the dataset in smart ways so we can make it all fit within our constrains!", "repo": "https://github.com/UntitledMacaw/FLOWS", "demo": "https://github.com/UntitledMacaw/FLOWS/releases/tag/Beta"}]...
|
[{"post_id": 79403, "ts": "202 [{"post_id": 79403, "ts": "2026-10-13T20:29:07Z", "hours": 0.9344, "text": "Alright, so new changes! Today I tried to make a DEMO for my project! Since the user is originally intended to provided topological files (that for demonstration purposes may not be available), I have also packaged inside the .sh file a DEMO version, that has its own very small dataset, so everyone can see the project in action even without the needed files."}, {"post_id": 77692, "ts": "2026-10-07T22:54:32Z", "hours": 0.6186, "text": "Another day and guess what: another feature! I added a new function to the code that takes in a “starting point” for basin compilation. What this does is, given a starting point integer provided by the user (call it S), it skips all basins with an ID lower than S. This is good ’cuz we can stop the code with control + C and later keep on where we left by choosing our last compiled basin as our starting point! I probably should have done this a long time ago instead of right know when I actually needed it, but hey: Better late than never am i right?"}, {"post_id": 74665, "ts": "2026-09-27T22:24:01Z", "hours": 2.655, "text": "YEEEEAAAAH! I decided to try and create an executable for my script, and boy was hard. The problem was that major libraries like gdal and whitebox required a bunch of other system libraries to work. This means I had to try to get them into the executable, and let me tell ya: This took a lot of time. But finally, it works (i hope)! I will be posting the executable (linux only of course) on github later!"}, {"post_id": 74018, "ts": "2026-09-26T15:19:42Z", "hours": 1.2344, "text": "Update on compilation: Well, a lot of stuff happened. I can’t really keep my computer running non stop all day and night, so I was resorting to suspending the laptop so runtime would keep frozen in RAM. But today, after a week of running the program and almost halfway left, I woke up to find the computer out of battery (probably it kept running in suspend mode and just died). That was quite devastating, but the only thing I could do was to update my code with checkpoints so that if that happens again, I won’t need to run everything again like I’m about to do now. I took that chance to also fix some typos in my README and my github pages, so I guess I got something good out of this!"}, {"post_id": 71782, "ts": "2026-09-21T15:16:55Z", "hours": 5.7964, "text": "Making some minor changes so my github before posting my project!"}, {"post_id": 63759, "ts": "2026-09-07T18:33:58Z", "hours": 8.0975, "text": "Finally able to find bowl-like depressions now"}, {"post_id": 40144, "ts": "2026-08-03T15:27:42Z", "hours": 9.9969, "text": "Writing a pdf devlog for my project!"}, {"post_id": 36462, "ts": "2026-07-28T16:19:12Z", "hours": 4.8508, "text": "Just discovered this nice tool called WhiteBoxTools, and was also able to find its user manual! Now I won’t need to process terrain from scratch, and instead get I can all the data I’m looking for without reinventing the wheel."}, {"post_id": 878, "ts": "2026-06-02T16:27:54Z", "hours": 0.3542, "text": "Figured out how to read a digital elevation model with python"}]...
|
Title: FLOWS by @UntitledMacaw | Stardance
Devlog Title: FLOWS by @UntitledMacaw | Stardance
Devlogs:
Figured out how to read a digital elevation model with python
Just discovered this nice tool called WhiteBoxTools, and was also able to find its user manual! Now I won’t need to process terrain from scratch, and instead get I can all the data I’m looking for without reinventing the wheel.
Writing a pdf devlog for my project!
Finally able to find bowl-like depressions now
Making some minor changes so my github before posting my project!
Update on compilation: Well, a lot of stuff happened. I can’t really keep my computer running non stop all day and night, so I was resorting to suspending the laptop so runtime would keep frozen in RAM. But today, after a week of running the program and almost halfway left, I woke up to find the computer out of battery (probably it kept running in suspend mode and just died). That was quite devastating, but the only thing I could do was to update my code with checkpoints so that if that happens again, I won’t need to run everything again like I’m about to do now. I took that chance to also fix some typos in my README and my github pages, so I guess I got something good out of this!
YEEEEAAAAH! I decided to try and create an executable for my script, and boy was hard. The problem was that major libraries like gdal and whitebox required a bunch of other system libraries to work. This means I had to try to get them into the executable, and let me tell ya: This took a lot of time. But finally, it works (i hope)! I will be posting the executable (linux only of course) on github later!
Another day and guess what: another feature! I added a new function to the code that takes in a “starting point” for basin compilation. What this does is, given a starting point integer provided by the user (call it S), it skips all basins with an ID lower than S. This is good ’cuz we can stop the code with control + C and later keep on where we left by choosing our last compiled basin as our starting point! I probably should have done this a long time ago instead of right know when I actually needed it, but hey: Better late than never am i right?
Alright, so new changes! Today I tried to make a DEMO for my project! Since the user is originally intended to provided topological files (that for demonstration purposes may not be available), I have also packaged inside the .sh file a DEMO version, that has its own very small dataset, so everyone can see the project in action even without the needed files.
Ships:
This is FLOWS. It is a program that takes in terrain data and water infiltration data and finds bowl-like depressions (or simply “basins”). Why is that useful: for each basin, water-height doesn’t change (for the same rainfall). This means we can pre-calculate various rainfall scenarios and store their results, so we can have a simple and quick way of estimating flood risk. Compilation was also made focusing on lower-end hardware, were we avoid feeding the entire data into the RAM, and instead partition the dataset in smart ways so we can make it all fit within our constrains!...
|
1793004578.6615663
|
1793090978.6615663
|
|
5033
|
jcd by @moriaan | Stardance
|
moriaan
|
1
|
13.49
|
116
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-10T18:55:24Z", "hours": 9.0, "multiplier": 13.37, "payout": 116, "blessing": "neutral", "text": "I made a cd alternative. The most challenging part was the memory management and all the segfaults. I’m proud that it is now a robust project with a lot of configuration options, and it’s very easy to set up. To install it, you just have to put the binary in your PATH (or use the aur, .deb, .rpm or .tar.gz version) and add this to .zshrc or .bashrc: eval “$(jcd init)” (optionally with config options). More info in the README.md.", "repo": "https://github.com/MnM72809/jcd", "demo": "https://github.com/MnM72809/jcd/releases"}]...
|
[{"post_id": 69384, "ts": "202 [{"post_id": 69384, "ts": "2026-09-16T23:05:50Z", "hours": 3.6139, "text": "The project was kinda messy, so I solved it. I removed a segfault when trying to navigate empty directories, made the error message have cleaner paths when the directory was not found, added malloc checking and clarified an error message further."}, {"post_id": 21099, "ts": "2026-07-02T21:54:45Z", "hours": 0.8761, "text": "I added support for symlinks that point to directories and updated compatibility so jcd now works with filesystems that don’t support d_type (like XFS) by using c stat as a fallback"}, {"post_id": 6319, "ts": "2026-06-10T17:09:33Z", "hours": 0.8847, "text": "Added a custom matching strictness config option for people who make a lot of typos, readme overhaul"}, {"post_id": 6272, "ts": "2026-06-10T15:24:08Z", "hours": 1.7286, "text": "Added a custom alias and a custom back string so you can enter “,” for example to go one directory up instead of “..”"}, {"post_id": 5792, "ts": "2026-06-09T18:26:45Z", "hours": 0.6622, "text": "Add little functions like absolute paths, “-” to go to previous directory, a help message, …"}, {"post_id": 5725, "ts": "2026-06-09T17:00:00Z", "hours": 0.8253, "text": "Added backwards movement with “..”, fixed the init so you can just add ‘eval “$(jcd init)”’ to .zshrc or .bashrc"}, {"post_id": 5594, "ts": "2026-06-09T13:25:43Z", "hours": 0.7103, "text": "Added subcommands"}, {"post_id": 5035, "ts": "2026-06-08T18:11:35Z", "hours": 3.8728, "text": "Implemented basic functionality (no gui so i just screenshotted the code)"}]...
|
Title: jcd by @moriaan | Stardance
Devlogs:
Imple Title: jcd by @moriaan | Stardance
Devlogs:
Implemented basic functionality (no gui so i just screenshotted the code)
Added subcommands
Added backwards movement with “..”, fixed the init so you can just add ‘eval “$(jcd init)”’ to .zshrc or .bashrc
Add little functions like absolute paths, “-” to go to previous directory, a help message, …
Added a custom alias and a custom back string so you can enter “,” for example to go one directory up instead of “..”
Added a custom matching strictness config option for people who make a lot of typos, readme overhaul
I added support for symlinks that point to directories and updated compatibility so jcd now works with filesystems that don’t support d_type (like XFS) by using c stat as a fallback
The project was kinda messy, so I solved it. I removed a segfault when trying to navigate empty directories, made the error message have cleaner paths when the directory was not found, added malloc checking and clarified an error message further.
Ships:
I made a cd alternative. The most challenging part was the memory management and all the segfaults. I’m proud that it is now a robust project with a lot of configuration options, and it’s very easy to set up. To install it, you just have to put the binary in your PATH (or use the aur, .deb, .rpm or .tar.gz version) and add this to .zshrc or .bashrc: eval “$(jcd init)” (optionally with config options). More info in the README.md....
|
1792968786.7563546
|
1793055186.7563546
|
|
5038
|
AI Slack bot by @YoussefTech | Stardance
|
YoussefTech
|
1
|
1.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-03T15:16:02Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made an AI assistant slack bot that you can use for free, it uses the HackClub AI API. To test it out, go to any channel on the HackClub slack workspace and type /asb-ask to prompt the AI, it will take a sec to respond, just give it some time 😁. Available commands: /asb-ping - Check if the bot is working and the latency /asb-joke - Fetch a random joke from the Official Joke API /asb-calc [expression] - Calculate a mathematical expression /asb-ask [question] - Ask the AI a question /asb-whoami - Info about the bot and its developer /asb-quote - Random quote", "repo": "https://github.com/yousseftechdev/AISlackBot", "demo": "https://hackclub.slack.com/archives/C0B8W2LQYD8/p1780861946621539"}]...
|
[{"post_id": 1481, "ts": "2026 [{"post_id": 1481, "ts": "2026-06-03T15:06:54Z", "hours": 0.3664, "text": "Added /asb-whoami command that prints info about the bot and its developer Added /asb-quote command to print a random quote Updated README.md"}, {"post_id": 1395, "ts": "2026-06-03T12:32:18Z", "hours": 0.3936, "text": "Well adding the AI part was easy, I used the HackClub AI API, I picked a free model because I don’t want every user of the bot to input their own API key, though that might be a cool idea for later updates, I placed a system instruction in the beginning of the prompt explaining to the AI model that it’s a slack bot so it doesn’t try to use tables or fancy formatting: SYSTEM INSTRUCTION: You are a slack bot, so follow slack formatting rules and markdown conventions when responding, no tables. The bot is now up and running and I’m trying to find extra features to add to increase the time on this project"}, {"post_id": 1382, "ts": "2026-06-03T11:44:19Z", "hours": 0.5392, "text": "Just finished the guide for the “Make a Slack Bot” mission, I liked it, but i feel like it was too easy, the guide said 1.5h but it only took me 20 minutes for the code and 10 minutes to make it live 24/7 on the Nest container"}]...
|
Title: AI Slack bot by @YoussefTech | Stardance
D Title: AI Slack bot by @YoussefTech | Stardance
Devlogs:
Just finished the guide for the “Make a Slack Bot” mission, I liked it, but i feel like it was too easy, the guide said 1.5h but it only took me 20 minutes for the code and 10 minutes to make it live 24/7 on the Nest container
Well adding the AI part was easy, I used the HackClub AI API, I picked a free model because I don’t want every user of the bot to input their own API key, though that might be a cool idea for later updates, I placed a system instruction in the beginning of the prompt explaining to the AI model that it’s a slack bot so it doesn’t try to use tables or fancy formatting: SYSTEM INSTRUCTION: You are a slack bot, so follow slack formatting rules and markdown conventions when responding, no tables. The bot is now up and running and I’m trying to find extra features to add to increase the time on this project
Added /asb-whoami command that prints info about the bot and its developer Added /asb-quote command to print a random quote Updated README.md
Ships:
I made an AI assistant slack bot that you can use for free, it uses the HackClub AI API. To test it out, go to any channel on the HackClub slack workspace and type /asb-ask to prompt the AI, it will take a sec to respond, just give it some time 😁. Available commands: /asb-ping - Check if the bot is working and the latency /asb-joke - Fetch a random joke from the Official Joke API /asb-calc [expression] - Calculate a mathematical expression /asb-ask [question] - Ask the AI a question /asb-whoami - Info about the bot and its developer /asb-quote - Random quote...
|
1792983043.254171
|
1793069443.254171
|
|
5064
|
Mein erste Mathe Quiz by @fetterDino | Stardance
|
fetterDino
|
1
|
1.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-03T11:53:31Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "es war hart weil es ist eine erst Project aber es hat mir sehr viel spaß gemacht", "repo": "https://gist.github.com/User123lap/819d449d33c68eedbec41f4d941eacfa", "demo": "https://user123lap.github.io/meine-erst-mathe-quiz/"}]...
|
[{"post_id": 884, "ts": "2026- [{"post_id": 884, "ts": "2026-06-02T16:38:11Z", "hours": 1.1631, "text": "Meinem erste Mathe Quiz"}]...
|
Title: Mein erste Mathe Quiz by @fetterDino | Star Title: Mein erste Mathe Quiz by @fetterDino | Stardance
Devlogs:
Meinem erste Mathe Quiz
Ships:
es war hart weil es ist eine erst Project aber es hat mir sehr viel spaß gemacht...
|
1792997473.6385546
|
1793083873.6385546
|
|
5083
|
My personal portfolio by @zayalan | Stardance
|
zayalan
|
1
|
7.0
|
12
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-09T14:45:59Z", "hours": 7.0, "multiplier": 1.83, "payout": 12, "blessing": "neutral", "text": "I made a personal website for myself. It is my first software project so it was so Challenging. I used html and css for making this.", "repo": "https://github.com/sasukeop108/sasukeop108.github.io", "demo": "https://sasukeop108.github.io/"}]...
|
[{"post_id": 5629, "ts": "2026 [{"post_id": 5629, "ts": "2026-06-09T14:38:11Z", "hours": 5.4781, "text": "Today, I started css part of my website. First, I started from the projects part in my website. Then, I did the about me and contact me part and finally added some more features like hover etc. After that, I pushed the files from vs code to the github repo and i deployed github pages for hosting this. As a beginner idk how i even took 5 hours sob. Anyways i got it working after a lot of struggles."}, {"post_id": 3676, "ts": "2026-06-06T18:44:03Z", "hours": 1.1253, "text": "Today, I worked on most of the html part of my personal portfolio. As im an ultimate beginner with vs code and html it took me longer than which i expected."}]...
|
Title: My personal portfolio by @zayalan | Stardan Title: My personal portfolio by @zayalan | Stardance
Devlogs:
Today, I worked on most of the html part of my personal portfolio. As im an ultimate beginner with vs code and html it took me longer than which i expected.
Today, I started css part of my website. First, I started from the projects part in my website. Then, I did the about me and contact me part and finally added some more features like hover etc. After that, I pushed the files from vs code to the github repo and i deployed github pages for hosting this. As a beginner idk how i even took 5 hours sob. Anyways i got it working after a lot of struggles.
Ships:
I made a personal website for myself. It is my first software project so it was so Challenging. I used html and css for making this....
|
1792979256.9343314
|
1793065656.9343314
|
|
5084
|
LUNAR-SCRUB by @AshishPatel | Stardance
|
AshishPatel
|
1
|
1.38
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-03T09:44:06Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "What I Made: I built the code for a Smart Lunar Dust Cleaner rover using an Arduino Uno and an ESP32. Basically, since space dust on the Moon sticks to solar panels and blocks the rover’s only power source, I made a system where a rotating brush automatically sweeps the dust off the panels to keep them clean. It also has a 4WD motor setup to move around and a servo-controlled dust bin to collect and dump out the debris. What Was Challenging: The hardest part was making sure the rover could take driving commands from the ESP32 while constantly checking the sensors at the same time. I had to code a safety system so that if the ultrasonic or IR sensors detect a rock or a crater ledge closer than 15cm, it instantly overrides everything and hits the brakes completely to save the rover from crashing. What I Am Proud Of: I’m super proud of cleaning up the code and putting all the important settings right at the very top. Things like pin numbers, distance limits, and brush timers are just simple numbers now. Anyone can change how the robot behaves without messing up the main logic underneath. How To Test It: Open the Arduino sketch and you can test the auto-braking by just blocking the ultrasonic sensor or triggering the IR pin—the motors will freeze instantly. You can also type commands in the serial monitor like ‘F’ to drive, ‘M’ to start the solar panel brush, and ‘D’ to open the dust flap", "repo": "https://github.com/ashish030810/LUNAR-SCRUB-", "demo": ""}]...
|
[{"post_id": 2645, "ts": "2026 [{"post_id": 2645, "ts": "2026-06-05T09:27:40Z", "hours": 0.3789, "text": "I worked on the core system architecture for the LUNAR-SCRUB automated rover. I successfully mapped out the 16-subsystem hardware matrix, configured the FSM autonomous navigation engine, and fixed critical pin conflicts with the I2C LCD screen and hardware serial lines. The code and detailed documentation are now fully updated on GitHub!"}, {"post_id": 1350, "ts": "2026-06-03T09:38:23Z", "hours": 0.4617, "text": "A smart, automated self-maintenance rover designed for the harsh lunar surface. Because electrostatic lunar regolith (space dust) covers solar panels and blocks their energy source, this project uses an Arduino Uno and an ESP32 to run an automated cleaning loop. When activated, a specialized rotating brush sweeps abrasive dust off the solar cells to restore power generation, while a servo-controlled dust tank opens to collect and safely purge the debris. For navigation safety, the system integrates an ultrasonic sensor and an IR sensor to instantly trigger an emergency stop if the rover encounters deep craters or dangerous rocks"}, {"post_id": 1338, "ts": "2026-06-03T08:56:21Z", "hours": 0.3928, "text": "I am developing the core embedded architecture for a Smart Lunar Dust Cleaner / Solar-Protection Rover. On the Moon, abrasive regolith dust accumulates on solar panels, cutting off the rover’s only source of energy. My project solves this by using a dual-processor setup: an ESP32 to handle custom app data streams, and an Arduino Uno to execute real-time physical routines. In this coding session, I engineered the safety override logic and operational sub-routines. The system coordinates: A 4WD Moon-Terrain Chassis: Controlled via an L298N driver to navigate rough ground. Dual-Sensor Protection Array: Combining an HC-SR04 Ultrasonic sensor and a LiDAR/IR sensor to freeze locomotion before hitting craters or rocks. Automated Solar Panel Brush: A dedicated cleaning motor that sweeps abrasive dust off the solar cells to restore power generation. Servo-Actuated Dirt Tank: Keeps collected regolith safely sealed in a containment box until a serial purge command triggers the servo to open the trapdoor and dump the dust."}]...
|
Title: LUNAR-SCRUB by @AshishPatel | Stardance
De Title: LUNAR-SCRUB by @AshishPatel | Stardance
Devlogs:
I am developing the core embedded architecture for a Smart Lunar Dust Cleaner / Solar-Protection Rover. On the Moon, abrasive regolith dust accumulates on solar panels, cutting off the rover’s only source of energy. My project solves this by using a dual-processor setup: an ESP32 to handle custom app data streams, and an Arduino Uno to execute real-time physical routines. In this coding session, I engineered the safety override logic and operational sub-routines. The system coordinates: A 4WD Moon-Terrain Chassis: Controlled via an L298N driver to navigate rough ground. Dual-Sensor Protection Array: Combining an HC-SR04 Ultrasonic sensor and a LiDAR/IR sensor to freeze locomotion before hitting craters or rocks. Automated Solar Panel Brush: A dedicated cleaning motor that sweeps abrasive dust off the solar cells to restore power generation. Servo-Actuated Dirt Tank: Keeps collected regolith safely sealed in a containment box until a serial purge command triggers the servo to open the trapdoor and dump the dust.
A smart, automated self-maintenance rover designed for the harsh lunar surface. Because electrostatic lunar regolith (space dust) covers solar panels and blocks their energy source, this project uses an Arduino Uno and an ESP32 to run an automated cleaning loop. When activated, a specialized rotating brush sweeps abrasive dust off the solar cells to restore power generation, while a servo-controlled dust tank opens to collect and safely purge the debris. For navigation safety, the system integrates an ultrasonic sensor and an IR sensor to instantly trigger an emergency stop if the rover encounters deep craters or dangerous rocks
I worked on the core system architecture for the LUNAR-SCRUB automated rover. I successfully mapped out the 16-subsystem hardware matrix, configured the FSM autonomous navigation engine, and fixed critical pin conflicts with the I2C LCD screen and hardware serial lines. The code and detailed documentation are now fully updated on GitHub!
Ships:
What I Made: I built the code for a Smart Lunar Dust Cleaner rover using an Arduino Uno and an ESP32. Basically, since space dust on the Moon sticks to solar panels and blocks the rover’s only power source, I made a system where a rotating brush automatically sweeps the dust off the panels to keep them clean. It also has a 4WD motor setup to move around and a servo-controlled dust bin to collect and dump out the debris. What Was Challenging: The hardest part was making sure the rover could take driving commands from the ESP32 while constantly checking the sensors at the same time. I had to code a safety system so that if the ultrasonic or IR sensors detect a rock or a crater ledge closer than 15cm, it instantly overrides everything and hits the brakes completely to save the rover from crashing. What I Am Proud Of: I’m super proud of cleaning up the code and putting all the important settings right at the very top. Things like pin numbers, distance limits, and brush timers are just simple numbers now. Anyone can change how the robot behaves without messing up the main logic underneath. How To Test It: Open the Arduino sketch and you can test the auto-braking by just blocking the ultrasonic sensor or triggering the IR pin—the motors will freeze instantly. You can also type commands in the serial monitor like ‘F’ to drive, ‘M’ to start the solar panel brush, and ‘D’ to open the dust flap...
|
1792979776.9040372
|
1793066176.9040372
|
|
5108
|
Homeserver Assistant by @TGStardancer | Stardance
|
TGStardancer
|
1
|
6.05
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-04T00:30:45Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "It is an initial version where it makes it easier to set up the screen share and the file system for my mac home server. I learned go and wails.", "repo": "https://github.com/CODERTG2/tether", "demo": "https://github.com/CODERTG2/tether/releases/tag/v1"}]...
|
[{"post_id": 2948, "ts": "2026 [{"post_id": 2948, "ts": "2026-06-05T21:07:26Z", "hours": 1.0836, "text": "scanned ports ui is now a table. I added another simple functionality of being able to ssh with just a click. I had to learn a bit about AppleScript to be able to ssh automatically without needing to type the password."}, {"post_id": 2341, "ts": "2026-06-04T19:42:59Z", "hours": 0.5086, "text": "Port scanning integrated into the app!"}, {"post_id": 2316, "ts": "2026-06-04T19:03:23Z", "hours": 1.4614, "text": "Programmed a port scanner and it worked successfully! Time to integrate it into tether."}, {"post_id": 1720, "ts": "2026-06-03T21:45:31Z", "hours": 1.4164, "text": "Did some reorganization of the codebase. Made IP, username, and password stored across sessions where the password is stored via a keychain. The only thing left to make an initial ship is an icon!!"}, {"post_id": 1628, "ts": "2026-06-03T19:16:21Z", "hours": 1.9811, "text": "Learned the basics of go to make a Wails application for macOS. It has the basic functionality like opening screen share and file system of your homeserver."}]...
|
Title: Homeserver Assistant by @TGStardancer | Sta Title: Homeserver Assistant by @TGStardancer | Stardance
Devlogs:
Learned the basics of go to make a Wails application for macOS. It has the basic functionality like opening screen share and file system of your homeserver.
Did some reorganization of the codebase. Made IP, username, and password stored across sessions where the password is stored via a keychain. The only thing left to make an initial ship is an icon!!
Programmed a port scanner and it worked successfully! Time to integrate it into tether.
Port scanning integrated into the app!
scanned ports ui is now a table. I added another simple functionality of being able to ssh with just a click. I had to learn a bit about AppleScript to be able to ssh automatically without needing to type the password.
Ships:
It is an initial version where it makes it easier to set up the screen share and the file system for my mac home server. I learned go and wails....
|
1792972570.5004466
|
1793058970.5004466
|
|
5119
|
Sigma macropad by @Nimoseq | Stardance
|
Nimoseq
|
1
|
0.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-27T17:49:41Z", "hours": 0.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a custom macropad for the Hackpad Challenge! The hardest part for me was writing the firmware and getting it all to work properly.", "repo": "https://github.com/N1mos3q/sigma-pad", "demo": ""}]...
|
[{"post_id": 74579, "ts": "202 [{"post_id": 74579, "ts": "2026-09-27T17:45:35Z", "hours": 0.2697, "text": "today i made little changes to the case"}, {"post_id": 26049, "ts": "2026-07-10T17:11:02Z", "hours": 4.6997, "text": "Hackpad name: Sigmapad GitHub Repo: https://github.com/N1mos3q/sigma-pad Description:custom-built 3x3 macropad powered by the Seeed Studio XIAO RP2040. Designed for productivity and gaming, it features a rotary encoder for precise volume control, a 0.91” OLED display for real-time status updates, and 8 addressable RGB LEDs for dynamic underglow lighting. Fully customizable via QMK firmware."}, {"post_id": 4385, "ts": "2026-06-07T18:18:46Z", "hours": 3.2008, "text": "I am making a macropad for a Hackpad mission. And i am currently working on the pcb."}]...
|
Title: Sigma macropad by @Nimoseq | Stardance
Dev Title: Sigma macropad by @Nimoseq | Stardance
Devlogs:
I am making a macropad for a Hackpad mission. And i am currently working on the pcb.
Hackpad name: Sigmapad GitHub Repo: https://github.com/N1mos3q/sigma-pad Description:custom-built 3x3 macropad powered by the Seeed Studio XIAO RP2040. Designed for productivity and gaming, it features a rotary encoder for precise volume control, a 0.91” OLED display for real-time status updates, and 8 addressable RGB LEDs for dynamic underglow lighting. Fully customizable via QMK firmware.
today i made little changes to the case
Ships:
I made a custom macropad for the Hackpad Challenge! The hardest part for me was writing the firmware and getting it all to work properly....
|
1793004702.199737
|
1793091102.199737
|
|
5134
|
Hbp100 by @Erox | Stardance
|
Erox
|
1
|
25.37
|
314
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-30T08:40:18Z", "hours": 20.0, "multiplier": 15.55, "payout": 314, "blessing": "neutral", "text": "Hbp100 After all the debugging, rewrites, benchmarks, broken builds now Hbp100 v3.1.1 is now release d.. What started as a small python privacy project eventually and became a full Rust implementation with a Python interface. The current version has: A native Rust core Python support through PyO3 Ml-powered contextual privacy decisions Reversible placeholder masking Session-based metadata Extremely low processing latency Releases on GitHub and crates.io There are still edge cases, the extractor can still be improved, and there are plenty of things I want to build next like rayon and multi threaded performance for more speed . It is not like , i have less speed(the current speed is enough to make flash accept defeat) but why not , i use arch btw. and now i can finally sleep at ease .", "repo": "https://github.com/Erox-02/humming-bird-v3", "demo": "https://hbp100-v3-web.vercel.app/"}]...
|
[{"post_id": 67253, "ts": "202 [{"post_id": 67253, "ts": "2026-09-13T10:00:36Z", "hours": 3.2161, "text": "This time i removed all the extractors , and made a new impl to add config from json files or code in python and rust both , it took me a lot of time also i added a website built on hbp100 this time for easier review but dont forget me crate"}, {"post_id": 59769, "ts": "2026-09-01T18:19:08Z", "hours": 2.1569, "text": "This time i fixed the session issue and wrote THE README MYSELF ,took me a lot of time still worth it"}, {"post_id": 57931, "ts": "2026-08-30T08:30:07Z", "hours": 2.0364, "text": "Finally session based metadata added now i can sleep in ease also it is v3.1.1 both on crates and github"}, {"post_id": 54711, "ts": "2026-08-25T19:44:36Z", "hours": 6.9267, "text": "This is probably the most hardcore devlog in this whole session, my task was simply write debug , ask gpt why it didnt work , then deepseek wrote code still didnt work and thts how 7 hrs passed me adding session with persistent memory also with a lot of optimizations , also v3.1.0 is on cargo now , go ahead and check it up for me uWu."}, {"post_id": 53028, "ts": "2026-08-23T12:36:57Z", "hours": 3.2983, "text": "This time it is a huge improvement , it looks like v3 to v3.0.1 but i added pyo3 and python api’s , i mean now even python can use my rust package with rust like speed + safety in python , also i fixed some small bugs in extractor , also added benchmarks (the speed is insane , see on the tagged screenshot ) also the ml is hella fast , in python the ml model only took 3x time than a whole iteration in rust with extractors and pyo3 overhead , also now i have got some more ideas to add in my hbp100 i think those will make it even better and polished.."}, {"post_id": 47281, "ts": "2026-08-15T03:57:56Z", "hours": 5.1125, "text": "today finally i shipped hbp100 v3 on crates “ https://crates.io/crates/hbp100/3.0.0 ” , this time no python runtime full rust even ml in rust thx to lightgbm3 , now it is far faster than the python pkl one , it took me 3+hrs just to train the model and to convert my old python logic into rust , then i had to do the dual readme setup to prevent the bug i came to meet on my last project too , now its fine i made a release on github too , in the crates release there is no “test.rs” but in git release i added tht , the tagged screenshot is result of test"}, {"post_id": 45578, "ts": "2026-08-12T05:11:26Z", "hours": 2.8333, "text": "actually when i started the project i didnt knew abt stardance , still after v2.2 i used it , v2.2 was pure python and really fast but still it didnt convince me , so i went to v3 rust and i tried rust and python hybrid it sucked i am unable to debug the mess i made so i am thinking to write the ml portion in rust too , i have a live website for v2.2 too , i am new to onnx so it might take some time debugging , still my v2.2 was pretty much successful , one can try tht on “ https://github.com/Erox-02/humming-bird-v3/releases/tag/v2.0.0 ” , so next will be v3.0 and i intend to ship the live website as a other project"}]...
|
Title: Hbp100 by @Erox | Stardance
Devlogs:
actua Title: Hbp100 by @Erox | Stardance
Devlogs:
actually when i started the project i didnt knew abt stardance , still after v2.2 i used it , v2.2 was pure python and really fast but still it didnt convince me , so i went to v3 rust and i tried rust and python hybrid it sucked i am unable to debug the mess i made so i am thinking to write the ml portion in rust too , i have a live website for v2.2 too , i am new to onnx so it might take some time debugging , still my v2.2 was pretty much successful , one can try tht on “ https://github.com/Erox-02/humming-bird-v3/releases/tag/v2.0.0 ” , so next will be v3.0 and i intend to ship the live website as a other project
today finally i shipped hbp100 v3 on crates “ https://crates.io/crates/hbp100/3.0.0 ” , this time no python runtime full rust even ml in rust thx to lightgbm3 , now it is far faster than the python pkl one , it took me 3+hrs just to train the model and to convert my old python logic into rust , then i had to do the dual readme setup to prevent the bug i came to meet on my last project too , now its fine i made a release on github too , in the crates release there is no “test.rs” but in git release i added tht , the tagged screenshot is result of test
This time it is a huge improvement , it looks like v3 to v3.0.1 but i added pyo3 and python api’s , i mean now even python can use my rust package with rust like speed + safety in python , also i fixed some small bugs in extractor , also added benchmarks (the speed is insane , see on the tagged screenshot ) also the ml is hella fast , in python the ml model only took 3x time than a whole iteration in rust with extractors and pyo3 overhead , also now i have got some more ideas to add in my hbp100 i think those will make it even better and polished..
This is probably the most hardcore devlog in this whole session, my task was simply write debug , ask gpt why it didnt work , then deepseek wrote code still didnt work and thts how 7 hrs passed me adding session with persistent memory also with a lot of optimizations , also v3.1.0 is on cargo now , go ahead and check it up for me uWu.
Finally session based metadata added now i can sleep in ease also it is v3.1.1 both on crates and github
This time i fixed the session issue and wrote THE README MYSELF ,took me a lot of time still worth it
This time i removed all the extractors , and made a new impl to add config from json files or code in python and rust both , it took me a lot of time also i added a website built on hbp100 this time for easier review but dont forget me crate
Ships:
Hbp100 After all the debugging, rewrites, benchmarks, broken builds now Hbp100 v3.1.1 is now release d.. What started as a small python privacy project eventually and became a full Rust implementation with a Python interface. The current version has: A native Rust core Python support through PyO3 Ml-powered contextual privacy decisions Reversible placeholder masking Session-based metadata Extremely low processing latency Releases on GitHub and crates.io There are still edge cases, the extractor can still be improved, and there are plenty of things I want to build next like rayon and multi threaded performance for more speed . It is not like , i have less speed(the current speed is enough to make flash accept defeat) but why not , i use arch btw. and now i can finally sleep at ease ....
|
1792994004.301144
|
1793080404.301144
|
|
5146
|
SlackBot by @AFJ | Stardance
|
AFJ
|
1
|
1.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-08T03:12:12Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a Slack bot using the guide. Hosted it on Nest. Hosting was the hard part cus i was new to nest so i asked ai about it. And the other thing is that i gave the demo url of a slack community channel so please try it out there I dont know how to give proper demo for this kind of projects", "repo": "https://github.com/AfshinJamseed/Slap-Bot", "demo": "https://app.slack.com/client/E09V59WQY1E/C08D8B0STPE?_gl=1*19jtvtu*_gcl_au*NTE5MTkwNjIxLjE3ODA0MTE3OTcuLS4tLjE3ODYxMDgzNzUuMzQ1ODMyNjMwLjE3ODYxMDgzNzUuMTc4NjE1NjYxNQ.."}]...
|
[{"post_id": 43040, "ts": "202 [{"post_id": 43040, "ts": "2026-08-08T02:55:53Z", "hours": 0.74, "text": "Slap Bot"}, {"post_id": 42673, "ts": "2026-08-07T15:00:49Z", "hours": 0.0825, "text": "working on my slackbot"}]...
|
Title: SlackBot by @AFJ | Stardance
Devlogs:
work Title: SlackBot by @AFJ | Stardance
Devlogs:
working on my slackbot
Slap Bot
Ships:
I made a Slack bot using the guide. Hosted it on Nest. Hosting was the hard part cus i was new to nest so i asked ai about it. And the other thing is that i gave the demo url of a slack community channel so please try it out there I dont know how to give proper demo for this kind of projects...
|
1792875274.450418
|
1793739274.450418
|
|
5187
|
unchild by @hamsal | Stardance
|
hamsal
|
1
|
2.0
|
8
|
[{"ship_num": 1, "hours": 2.0, [{"ship_num": 1, "hours": 2.0, "multiplier": 3.67, "payout": 8, "blessing": "neutral", "text": "i made a biography of a kpop group unchild with a little quiz", "repo": "https://github.com/hamsal39/unchild", "demo": "https://hamsal39.github.io/unchild/", "ts": "2026-07-01T18:55:26Z"}]...
|
[{"post_id": 16486, "ts": "202 [{"post_id": 16486, "ts": "2026-06-26T20:39:38Z", "hours": 0.0, "text": "i just finished the easiest part which is the main part that i just put the basic info by the way in later devlogs u will see that i changed the avatars and tracks"}, {"post_id": 18559, "ts": "2026-06-29T19:08:54Z", "hours": 0.0, "text": "i have been working on the spotify part of my biography of unchild instead of the wrong tracks i put their 2 songs since their debut"}, {"post_id": 19426, "ts": "2026-06-30T19:04:57Z", "hours": 0.0, "text": "memberssssssss"}, {"post_id": 20163, "ts": "2026-07-01T18:23:51Z", "hours": 0.0, "text": "finished! i added a quiz, their music, their members and if you didn’t know about unchild before hope you become a CHACHA after this"}, {"post_id": 20934, "ts": "2026-07-02T17:44:42Z", "hours": 0.0, "text": "Shipping failed soooo……. made some touches"}, {"post_id": 22770, "ts": "2026-07-05T11:02:41Z", "hours": 0.0, "text": "at this point i am ready to quit. but one more try"}]...
|
Title: unchild by @hamsal | Stardance
Devlogs:
i Title: unchild by @hamsal | Stardance
Devlogs:
i just finished the easiest part which is the main part that i just put the basic info by the way in later devlogs u will see that i changed the avatars and tracks
i have been working on the spotify part of my biography of unchild instead of the wrong tracks i put their 2 songs since their debut
memberssssssss
finished! i added a quiz, their music, their members and if you didn’t know about unchild before hope you become a CHACHA after this
Shipping failed soooo……. made some touches
at this point i am ready to quit. but one more try
Ships:
i made a biography of a kpop group unchild with a little quiz...
|
1792878815.4123626
|
1793742815.4123626
|
|
5193
|
MinimaPad! by @RishuKamboj | Stardance
|
RishuKamboj
|
1
|
0.41
|
2
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-06T17:33:31Z", "hours": 0.0, "multiplier": 5.0, "payout": 2, "blessing": "neutral", "text": "I Designed a MacroPad(i call it MinimaPad cuz of the minimal design). Got to learn pcb designing and got better at cad model designing. All i hope is that the link for hackpad comes back online soon so i can test if my not so beautifully arranged pcb works or not. A piece of advice for anyone else starting out is to measure all the components before designing the case for it", "repo": "https://github.com/rydei/HackPad", "demo": ""}]...
|
[{"post_id": 6177, "ts": "2026 [{"post_id": 6177, "ts": "2026-06-10T11:44:16Z", "hours": 0.415, "text": "I had like 30 errors in pcb, fixed em all now."}, {"post_id": 3452, "ts": "2026-06-06T12:12:26Z", "hours": 0.1764, "text": "for anyone wondering this is my very first project and yes i literally forgot to turn on timelapse :’)"}]...
|
Title: MinimaPad! by @RishuKamboj | Stardance
Dev Title: MinimaPad! by @RishuKamboj | Stardance
Devlogs:
for anyone wondering this is my very first project and yes i literally forgot to turn on timelapse :’)
I had like 30 errors in pcb, fixed em all now.
Ships:
I Designed a MacroPad(i call it MinimaPad cuz of the minimal design). Got to learn pcb designing and got better at cad model designing. All i hope is that the link for hackpad comes back online soon so i can test if my not so beautifully arranged pcb works or not. A piece of advice for anyone else starting out is to measure all the components before designing the case for it...
|
1792972458.0581791
|
1793058858.0581791
|
|
5212
|
DONUT PAD :O by @Nemo_Donut | Stardance
|
Nemo_Donut
|
1
|
30.69
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-14T19:37:00Z", "hours": 25.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a macropad called the DONUT PAD (or Nemo’s Hackpad), it is a macropad that functions as game controller/game pad. It has 12 keys, 1 rotary encoder, a 128x32 OLED display, XIAO RP2040. I designed the PCB board and schematic in Kicad, the case in Fusion360, and programmed it using QMK firmware. The most challenging part was the whole project as I have no prior knowledge in PCB making or case making infact i have never even thought of making any sort of hardware lol. But I gotta with consistency and hard work you can achieve anything! If I had to point to some very difficult challenges I faced then it is probably the LEDs because Kicad kept throwing me various errors saying LED pins are too close ;-; I looked far and wide on google and youtube couldn’t solve it so I just removed those LEDs. Also making the QMK firmware was very annoying not that difficult it was just utterly annoying ;-; because it took me like 30 minutes to compile my code and stuff probably because I have a Potato PC. I am proud of the whole project because it is my first hardware project but I am exceptionally proud of the top plate design I made for my case it is inspired from kintsugi! 4 keys control the movement like a D-PAD, 4 keys funtion as the action keys, 2 keys as the left and right shoulder button and the last 2 keys as the start and select button. The rotary encoder’s click feature doesn’t work because of lack of pins but you can rotate it to change volume. The Case uses a sandwich mounting style.", "repo": "https://github.com/adonutartist/Nemos-Hackpad-DONUT-PAD", "demo": ""}]...
|
[{"post_id": 62104, "ts": "202 [{"post_id": 62104, "ts": "2026-09-05T11:02:31Z", "hours": 0.7836, "text": "Build Phase #3 Completed the build phase first i unassembled everything and found out tht my soldering wasn’t the problem i checked with a multimeter but wht i did was greater js a soldering error. it was frikin pcb error. yeh so umm the oled thingie if u check its image on hackpad mission page u will see its pin order is down to up but wht i did in my pcb was tht the order was up to down so thts why it didnt work and reviewers didn’t even notice well its more my mistake than theirs anways so i thought maybe if i can desolder this i solder jumper wires from correct pin to its pad but naw i couldnt even desolder i tried using a desolder pump and a copper wick but it js didnt ;-; this is so dam insane!!!!! well anyways everything works except tht oled so yeh cool macropad successfully done!"}, {"post_id": 61752, "ts": "2026-09-04T20:10:20Z", "hours": 3.1342, "text": "Build Phase #2 Completed most of firmware for all the keys and rotary encoder working… I didn’t use qmk for this cuz of its insanely high compile time idk why my lappy is js old ig but qmk takes age to compile so I js used Arduino IDE. While I was working I got this weird green line of doom despair which means my screen is slowly dieing ;-; man o man. Also i couldn’t get the OLEDA to work idk why I think it’s prolly loose solder or maybe bridging? Well tmrw imma unassemble once and check on tht"}, {"post_id": 61469, "ts": "2026-09-04T12:26:05Z", "hours": 1.7728, "text": "Build Phase #1: Got my PCB today so immediately started the build phase! Soldered all the components and assembled everything. Was pretty easy ngl let’s see how the firmware turns out I js hope all works ;-;"}, {"post_id": 8866, "ts": "2026-06-14T19:15:06Z", "hours": 2.1208, "text": "DEVLOG #12 Hello y’all!! I am so excited to share with you that my first hack club project aka my first hardware project is finally completed!!!! Man not gonna lie I learnt a laaaat from these 2 weeks of grinding lmfao this was such a fabulous experience!! I can’t believe I am done lol xD Also this means it will be my last Devlog of DONUT PAD :p but don’t y’all worry I will be right back with another project!! Here’s the github repository link for DONUT PAD: https://github.com/adonutartist/Nemos-Hackpad-DONUT-PAD Thank you to everyone who liked my devlogs I hope I get my project approved soon so that I can receive that kit to make DONUT PAD a real thing ehehehe!! Cyaaaa!!"}, {"post_id": 8346, "ts": "2026-06-13T21:26:38Z", "hours": 4.4142, "text": "DEVLOG #11 Hello y’all!! Today I grinded like insane lmao xD but it was really fun!! I added kintsugi type design on my case plate! it was quite lot of work because drawing so many lines but it kinda felt satisfying lol xD Also I made the main body of the case the shell where the PCB sits to be transparent so it looks really cool you can see the PCB that is awesome for sure! I have started working on my github repository too so I am sure I can submit it tomorrow!! Yeppp tomorrow it is!!!! I am so excited to finally complete my first hardware project this was surely a fun grind!! Cyaaaa!!! Gooooodnight!!!!"}, {"post_id": 7700, "ts": "2026-06-12T21:07:53Z", "hours": 3.2472, "text": "DEVLOG #10 Hello y’all I am back! Today i completed the QMK firmware part!! To me this part felt like a nightmare because I don’t have any experience with coding and stuff like that :P But after completing QMK with zero errors and .uf2 file I feel coding ain’t that hard lol xD It surely took a laaat of time but it was fun! Compiling takes like 15 minutes though RIP my potato PC X( I am planning to make my case transparent and adding some more cool designs to give some originality and uniqueness so I may hop into fusion again tomorrow :P Cyaaa!! Gooodnight!!!!"}, {"post_id": 7127, "ts": "2026-06-11T22:09:51Z", "hours": 0.5186, "text": "DEVLOG #9.5 QMK MSYS installation and setup completed!"}, {"post_id": 7099, "ts": "2026-06-11T21:30:35Z", "hours": 3.9808, "text": "DEVLOG #9 Hellooo y’all!! I am back with a lot of progress!! First of all I completed the case added USB hole and screw holes. Finally after 4 days of fusion grinding case is done!! I even completed the final rendered photoshoot for the whole case with the PCB and the switches, encoder and the OLED. I also read through the QMK frimware tutorial how to install QMK MSYS how to setup everything took some time but finally done with the installation! Tomorrow I am gonnna try to complete DONUT PAD :O and also ship it hopefully lol xD Cyaaaa!! Gooooodnight!!!"}, {"post_id": 6469, "ts": "2026-06-10T21:41:09Z", "hours": 3.765, "text": "DEVLOG #8 Hello y’all I am back and today I made lots and lots of progress on the case!! I think I am very close to completing my first hackclub project!!! The case is almost done I just need to add holes for screws now and then I can ship it hopefully! I added some decals on the case and text with engraved effect :] I also changed the appearance material of the case and the plate :3 Also added Rectangular hole for the OLED display :> Things left to do are adding screw holes, and USB hole. Cya!! Gooodnight!!!"}, {"post_id": 5911, "ts": "2026-06-09T21:47:26Z", "hours": 3.9575, "text": "DEVLOG #7 Hello y’all I am back after a grind of 4 hours :p Frikin fusion 360 is so hard to understand for my bean brain sighhhhhh…. Anyways made a lot of progress on the case! I added a adapter for the rotary encoder, understood sandwich mount and the basic case is kinda done lol xD I am kinda speedrunning this ig… Gonna make the shelf tomorrow and add cool personal touch to the case! Cyaaaa!! Goooodnight!!!!"}, {"post_id": 5200, "ts": "2026-06-08T21:58:38Z", "hours": 0.2783, "text": "DEVLOG #6 Today I worked on the case but not much because most of my time was spent on learning this new software :p Fusion 360 was hard to integrate with hackatime so my work hours were not properly added but no worries ;-; lost 1 hour of work hour T-T I used a website called keyboard layout editor to make a layout of my macropad similar to the layout of my PCB and then I copied the raw code of the layout pasted it in another website called ai03 plate generator and it gave me a .DXF file which i imported in my fusion as a sketch layer. I wonder if i need to add a adapter step model for the rotary encoder in my case… well will think about that tomorrow. Well anyways cya!! Goodnight!!!"}, {"post_id": 4533, "ts": "2026-06-07T21:30:15Z", "hours": 0.8147, "text": "DEVLOG #5 Hello y’all, I am back yet again with updates on my DonutPad! So firstly I was really frustrated by those LEDs so I took a break from the PCB for one day! Played some D&D too lol xD! Today came back with a fresh mind I removed those LEDs, added a rotary encoder, made the edge cut rectangle size to 100mm x 100mm, did all the wiring yet again and finally completed the PCB!!! This time I made sure to keep the wiring very clean aka comfortable to my brain lol xD!!! I also downloaded Autodesk Fusion 360 which took heck lot of my time but no worries :p I am still figuring out the ways to use this app ;-; I am not the best when it comes to 3D stuff but imma try ma best!! Cya everyone!! Goodnight!!!"}, {"post_id": 2967, "ts": "2026-06-05T21:37:44Z", "hours": 0.4644, "text": "DEVLOG #4 Hello y’all! Today I am feeling so damm tired ;-; Anyways today i fixed all the bugs that were occurring with my PCB well not all cause the LED aperture net link bug was too persistent so i had to just ignore it ;-; I am totally not running away from my responsibilities…. After i was done with dealing with LEDs i went for filling the whole board region with GND but it left gaps at various places hence more bugssss… luckily someone from slack helped me fix this one bug by adding lotsss of vias. Tomorrow I will start working on the case through fusion 360… I am really scared of this part cause 3D stuff ain’t easy to do ;-; Anyways cya! Goodnight!!"}, {"post_id": 2414, "ts": "2026-06-04T21:40:28Z", "hours": 0.3819, "text": "DEVLOG #3 Hello everyone! Nemo here, HOLyyyy today was so dam annoying arranging PCB getting so many errors FRIKIN 161 ERRORS!!! I am frikin so cooked right now its frikin 3am sitting on this for an hour trying to solve this bug but it wont fix (╥﹏╥) First of all there was a bug with the edge cut the rectangle had some stray lines idk how that happened but I deleted those its fine now but still I am left with FRIKIN 116 ERRORS!! It keeps saying some solder aperture bug with all the LEDs from what I can comprehend it’s like one error repeating with all the LEDs and their respective pads seems like it’s saying the LED pins are too close together idk urghhh I will try solving it tomorrow because right now I am so dam sleepy ;-; So bug fixing tomorrow! Cya y’all!! Goodnight :]"}, {"post_id": 1712, "ts": "2026-06-03T21:29:43Z", "hours": 0.8511, "text": "DEVLOG #2 Hello everyone! Nemo here, I am back again with my second devlog!! After hours of struggling I finally completed my schematic! I learnt a better way of connecting stuff without those messy wires :p it’s called net labels it makes everything look much cleaner :) I also used the matrix method to connect the keys/switches. Also added an OLED display thingie and lots of LEDs :> Right now my biggest difficulty seems the LEDs cuz the one given in the care package doesn’t have a footprint so it kept giving me errors when I was clicking assign footprint so I had to download a new symbol and footprint for the same LED model from snapeda ;-; What I am noticing is that both tthe snapeda one and the one from the care package doesn’t have the GND pin as showed in the hackpad guide and so it kept throwing errors saying no power at the point i connected the GND to every LED. I found a easy fix for this it’s called power flag it js tells the system that GND is power and hence error gone :] Still had to assign the footprints manually… I hope it doesn’t cause any complications in the future ⊙﹏⊙ Tomorrow gonna work on the PCB :D cya for now! Goodnight!!!"}, {"post_id": 1030, "ts": "2026-06-02T20:27:31Z", "hours": 0.3864, "text": "DEVLOG #1 Hello everyone! Nemo here with my first ever Devlog :D I am working on one of the beginner course called the hackpad! Its going super smoothly as of now :3 I grasped the basics of PCB and Schematic making, it was hard at first because I didn’t knew the basics :p but i understood the concepts with lots of help from youtube and practice! The course feels easy to follow and I am having fun hiding secret messages on my PCB lol XD Tomorrow imma try to do some tinkering of my own like adding RGB LEDs maybe? It will be fun for sure! Cya for now!! Good Night :]"}]...
|
Title: DONUT PAD :O by @Nemo_Donut | Stardance
De Title: DONUT PAD :O by @Nemo_Donut | Stardance
Devlogs:
DEVLOG #1 Hello everyone! Nemo here with my first ever Devlog :D I am working on one of the beginner course called the hackpad! Its going super smoothly as of now :3 I grasped the basics of PCB and Schematic making, it was hard at first because I didn’t knew the basics :p but i understood the concepts with lots of help from youtube and practice! The course feels easy to follow and I am having fun hiding secret messages on my PCB lol XD Tomorrow imma try to do some tinkering of my own like adding RGB LEDs maybe? It will be fun for sure! Cya for now!! Good Night :]
DEVLOG #2 Hello everyone! Nemo here, I am back again with my second devlog!! After hours of struggling I finally completed my schematic! I learnt a better way of connecting stuff without those messy wires :p it’s called net labels it makes everything look much cleaner :) I also used the matrix method to connect the keys/switches. Also added an OLED display thingie and lots of LEDs :> Right now my biggest difficulty seems the LEDs cuz the one given in the care package doesn’t have a footprint so it kept giving me errors when I was clicking assign footprint so I had to download a new symbol and footprint for the same LED model from snapeda ;-; What I am noticing is that both tthe snapeda one and the one from the care package doesn’t have the GND pin as showed in the hackpad guide and so it kept throwing errors saying no power at the point i connected the GND to every LED. I found a easy fix for this it’s called power flag it js tells the system that GND is power and hence error gone :] Still had to assign the footprints manually… I hope it doesn’t cause any complications in the future ⊙﹏⊙ Tomorrow gonna work on the PCB :D cya for now! Goodnight!!!
DEVLOG #3 Hello everyone! Nemo here, HOLyyyy today was so dam annoying arranging PCB getting so many errors FRIKIN 161 ERRORS!!! I am frikin so cooked right now its frikin 3am sitting on this for an hour trying to solve this bug but it wont fix (╥﹏╥) First of all there was a bug with the edge cut the rectangle had some stray lines idk how that happened but I deleted those its fine now but still I am left with FRIKIN 116 ERRORS!! It keeps saying some solder aperture bug with all the LEDs from what I can comprehend it’s like one error repeating with all the LEDs and their respective pads seems like it’s saying the LED pins are too close together idk urghhh I will try solving it tomorrow because right now I am so dam sleepy ;-; So bug fixing tomorrow! Cya y’all!! Goodnight :]
DEVLOG #4 Hello y’all! Today I am feeling so damm tired ;-; Anyways today i fixed all the bugs that were occurring with my PCB well not all cause the LED aperture net link bug was too persistent so i had to just ignore it ;-; I am totally not running away from my responsibilities…. After i was done with dealing with LEDs i went for filling the whole board region with GND but it left gaps at various places hence more bugssss… luckily someone from slack helped me fix this one bug by adding lotsss of vias. Tomorrow I will start working on the case through fusion 360… I am really scared of this part cause 3D stuff ain’t easy to do ;-; Anyways cya! Goodnight!!
DEVLOG #5 Hello y’all, I am back yet again with updates on my DonutPad! So firstly I was really frustrated by those LEDs so I took a break from the PCB for one day! Played some D&D too lol xD! Today came back with a fresh mind I removed those LEDs, added a rotary encoder, made the edge cut rectangle size to 100mm x 100mm, did all the wiring yet again and finally completed the PCB!!! This time I made sure to keep the wiring very clean aka comfortable to my brain lol xD!!! I also downloaded Autodesk Fusion 360 which took heck lot of my time but no worries :p I am still figuring out the ways to use this app ;-; I am not the best when it comes to 3D stuff but imma try ma best!! Cya everyone!! Goodnight!!!
DEVLOG #6 Today I worked on the case but not much because most of my time was spent on learning this new software :p Fusion 360 was hard to integrate with hackatime so my work hours were not properly added but no worries ;-; lost 1 hour of work hour T-T I used a website called keyboard layout editor to make a layout of my macropad similar to the layout of my PCB and then I copied the raw code of the layout pasted it in another website called ai03 plate generator and it gave me a .DXF file which i imported in my fusion as a sketch layer. I wonder if i need to add a adapter step model for the rotary encoder in my case… well will think about that tomorrow. Well anyways cya!! Goodnight!!!
DEVLOG #7 Hello y’all I am back after a grind of 4 hours :p Frikin fusion 360 is so hard to understand for my bean brain sighhhhhh…. Anyways made a lot of progress on the case! I added a adapter for the rotary encoder, understood sandwich mount and the basic case is kinda done lol xD I am kinda speedrunning this ig… Gonna make the shelf tomorrow and add cool personal touch to the case! Cyaaaa!! Goooodnight!!!!
DEVLOG #8 Hello y’all I am back and today I made lots and lots of progress on the case!! I think I am very close to completing my first hackclub project!!! The case is almost done I just need to add holes for screws now and then I can ship it hopefully! I added some decals on the case and text with engraved effect :] I also changed the appearance material of the case and the plate :3 Also added Rectangular hole for the OLED display :> Things left to do are adding screw holes, and USB hole. Cya!! Gooodnight!!!
DEVLOG #9 Hellooo y’all!! I am back with a lot of progress!! First of all I completed the case added USB hole and screw holes. Finally after 4 days of fusion grinding case is done!! I even completed the final rendered photoshoot for the whole case with the PCB and the switches, encoder and the OLED. I also read through the QMK frimware tutorial how to install QMK MSYS how to setup everything took some time but finally done with the installation! Tomorrow I am gonnna try to complete DONUT PAD :O and also ship it hopefully lol xD Cyaaaa!! Gooooodnight!!!
DEVLOG #9.5 QMK MSYS installation and setup completed!
DEVLOG #10 Hello y’all I am back! Today i completed the QMK firmware part!! To me this part felt like a nightmare because I don’t have any experience with coding and stuff like that :P But after completing QMK with zero errors and .uf2 file I feel coding ain’t that hard lol xD It surely took a laaat of time but it was fun! Compiling takes like 15 minutes though RIP my potato PC X( I am planning to make my case transparent and adding some more cool designs to give some originality and uniqueness so I may hop into fusion again tomorrow :P Cyaaa!! Gooodnight!!!!
DEVLOG #11 Hello y’all!! Today I grinded like insane lmao xD but it was really fun!! I added kintsugi type design on my case plate! it was quite lot of work because drawing so many lines but it kinda felt satisfying lol xD Also I made the main body of the case the shell where the PCB sits to be transparent so it looks really cool you can see the PCB that is awesome for sure! I have started working on my github repository too so I am sure I can submit it tomorrow!! Yeppp tomorrow it is!!!! I am so excited to finally complete my first hardware project this was surely a fun grind!! Cyaaaa!!! Gooooodnight!!!!
DEVLOG #12 Hello y’all!! I am so excited to share with you that my first hack club project aka my first hardware project is finally completed!!!! Man not gonna lie I learnt a laaaat from these 2 weeks of grinding lmfao this was such a fabulous experience!! I can’t believe I am done lol xD Also this means it will be my last Devlog of DONUT PAD :p but don’t y’all worry I will be right back with another project!! Here’s the github repository link for DONUT PAD: https://github.com/adonutartist/Nemos-Hackpad-DONUT-PAD Thank you to everyone who liked my devlogs I hope I get my project approved soon so that I can receive that kit to make DONUT PAD a real thing ehehehe!! Cyaaaa!!
Build Phase #1: Got my PCB today so immediately started the build phase! Soldered all the components and assembled everything. Was pretty easy ngl let’s see how the firmware turns out I js hope all works ;-;
Build Phase #2 Completed most of firmware for all the keys and rotary encoder working… I didn’t use qmk for this cuz of its insanely high compile time idk why my lappy is js old ig but qmk takes age to compile so I js used Arduino IDE. While I was working I got this weird green line of doom despair which means my screen is slowly dieing ;-; man o man. Also i couldn’t get the OLEDA to work idk why I think it’s prolly loose solder or maybe bridging? Well tmrw imma unassemble once and check on tht
Build Phase #3 Completed the build phase first i unassembled everything and found out tht my soldering wasn’t the problem i checked with a multimeter but wht i did was greater js a soldering error. it was frikin pcb error. yeh so umm the oled thingie if u check its image on hackpad mission page u will see its pin order is down to up but wht i did in my pcb was tht the order was up to down so thts why it didnt work and reviewers didn’t even notice well its more my mistake than theirs anways so i thought maybe if i can desolder this i solder jumper wires from correct pin to its pad but naw i couldnt even desolder i tried using a desolder pump and a copper wick but it js didnt ;-; this is so dam insane!!!!! well anyways everything works except tht oled so yeh cool macropad successfully done!
Ships:
I made a macropad called the DONUT PAD (or Nemo’s Hackpad), it is a macropad that functions as game controller/game pad. It has 12 keys, 1 rotary encoder, a 128x32 OLED display, XIAO RP2040. I designed the PCB board and schematic in Kicad, the case in Fusion360, and programmed it using QMK firmware. The most challenging part was the whole project as I have no prior knowledge in PCB making or case making infact i have never even thought of making any sort of hardware lol. But I gotta with consistency and hard work you can achieve anything! If I had to point to some very difficult challenges I faced then it is probably the LEDs because Kicad kept throwing me various errors saying LED pins are too close ;-; I looked far and wide on google and youtube couldn’t solve it so I just removed those LEDs. Also making the QMK firmware was very annoying not that difficult it was just utterly annoying ;-; because it took me like 30 minutes to compile my code and stuff probably because I have a Potato PC. I am proud of the whole project because it is my first hardware project but I am exceptionally proud of the top plate design I made for my case it is inspired from kintsugi! 4 keys control the movement like a D-PAD, 4 keys funtion as the action keys, 2 keys as the left and right shoulder button and the last 2 keys as the start and select button. The rotary encoder’s click feature doesn’t work because of lack of pins but you can rotate it to change volume. The Case uses a sandwich mounting style....
|
1792968977.7902195
|
1793055377.7902195
|
|
5215
|
Draw a Perfect Star by @alark | Stardance
|
alark
|
1
|
3.0
|
19
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-08T18:31:42Z", "hours": 3.0, "multiplier": 10.69, "payout": 19, "blessing": "neutral", "text": "I built a minigame web app where your goal is to draw a perfect star! It’s inspired by Neal.fun’s “Draw a Perfect Circle” challenge (which went viral on YouTube last year) and I wanted to recreate that same simple-but-addictive feeling with a slightly different twist- perfectly fitting for Stardance. The idea is straightforward: you draw a star on screen, and the game scores how close you are to a mathematically perfect star shape. It sounds simple, but it quickly turns into one of those “just one more try” kind of challenges. I built the site using Astro for structure and performance, and styled it with Tailwind CSS to keep the UI design process simple. The drawing system is handled with basic pointer events and canvas logic, where I track the user’s input path and compare it against an ideal star shape using a scoring algorithm- you can check out my devlog for more info! For deployment, I used GitHub Pages, which also forced me to properly understand static builds, routing, and how Astro compiles static projects down for production. That part alone helped me get a lot more comfortable with real-world deployment workflows. This was mostly a fan project, but it ended up being a really useful way to get back into web development after a short break. I brushed up on Git workflows, got more comfortable with CSS animations, and learned a lot about handling user input smoothly in the browser without external libraries. Overall, it’s a small project, but it taught me a surprising amount about building something end-to-end- from idea to deployment. If you enjoyed it or want to see improvements, feel free to star the repo or check it out.", "repo": "https://github.com/alflionel/draw-a-perfect-star", "demo": "https://alfielionel.github.io/draw-a-perfect-star/"}]...
|
[{"post_id": 5026, "ts": "2026 [{"post_id": 5026, "ts": "2026-06-08T17:56:16Z", "hours": 0.6017, "text": "How “Draw a Perfect Star” actually calculates accuracy The goal of this system is not to “recognise” a star visually. It turns both your drawing and a perfect star into comparable point data, then measures how far apart they are. This makes scoring fast, deterministic, and surprisingly stable. Input capture While you draw, the app records raw mouse positions: path = [(x1, y1), (x2, y2), etc etc] This data is noisy and depends heavily on speed and polling/sampling rate. Resampling The stroke is converted into a fixed number of evenly spaced points (120). This removes: drawing speed differences uneven mouse sampling Now every drawing has a consistent structure. Normalisation The shape is transformed so comparison is fair: centred around (0, 0) scaled so max radius = 1 This removes position/size- only shape remains. Reference star A perfect 5-pointed star is generated mathematically using polar coordinates and sine-based radius switching. It is also sampled into 120 points so it matches the user format. Comparison Each user point is compared directly to the corresponding star point- error += distance(user[i], star[i]) This produces an average geometric deviation across the full shape. Scoring Final score is computed as: score = 100 - error * 120 Then clamped between 0 and 100. Summary The system works by converting both shapes into normalized point sequences and measuring their geometric distance."}, {"post_id": 2419, "ts": "2026-06-04T21:51:05Z", "hours": 0.5292, "text": "deployed a prototype build of “draw a perfect star” to github pages! also made it look a little nicer lol :p"}, {"post_id": 1519, "ts": "2026-06-03T16:26:30Z", "hours": 1.3822, "text": "Built a first prototype for my “draw a perfect star” online game! Like if you could do better than me LOL"}]...
|
Title: Draw a Perfect Star by @alark | Stardance
Title: Draw a Perfect Star by @alark | Stardance
Devlogs:
Built a first prototype for my “draw a perfect star” online game! Like if you could do better than me LOL
deployed a prototype build of “draw a perfect star” to github pages! also made it look a little nicer lol :p
How “Draw a Perfect Star” actually calculates accuracy The goal of this system is not to “recognise” a star visually. It turns both your drawing and a perfect star into comparable point data, then measures how far apart they are. This makes scoring fast, deterministic, and surprisingly stable. Input capture While you draw, the app records raw mouse positions: path = [(x1, y1), (x2, y2), etc etc] This data is noisy and depends heavily on speed and polling/sampling rate. Resampling The stroke is converted into a fixed number of evenly spaced points (120). This removes: drawing speed differences uneven mouse sampling Now every drawing has a consistent structure. Normalisation The shape is transformed so comparison is fair: centred around (0, 0) scaled so max radius = 1 This removes position/size- only shape remains. Reference star A perfect 5-pointed star is generated mathematically using polar coordinates and sine-based radius switching. It is also sampled into 120 points so it matches the user format. Comparison Each user point is compared directly to the corresponding star point- error += distance(user[i], star[i]) This produces an average geometric deviation across the full shape. Scoring Final score is computed as: score = 100 - error * 120 Then clamped between 0 and 100. Summary The system works by converting both shapes into normalized point sequences and measuring their geometric distance.
Ships:
I built a minigame web app where your goal is to draw a perfect star! It’s inspired by Neal.fun’s “Draw a Perfect Circle” challenge (which went viral on YouTube last year) and I wanted to recreate that same simple-but-addictive feeling with a slightly different twist- perfectly fitting for Stardance. The idea is straightforward: you draw a star on screen, and the game scores how close you are to a mathematically perfect star shape. It sounds simple, but it quickly turns into one of those “just one more try” kind of challenges. I built the site using Astro for structure and performance, and styled it with Tailwind CSS to keep the UI design process simple. The drawing system is handled with basic pointer events and canvas logic, where I track the user’s input path and compare it against an ideal star shape using a scoring algorithm- you can check out my devlog for more info! For deployment, I used GitHub Pages, which also forced me to properly understand static builds, routing, and how Astro compiles static projects down for production. That part alone helped me get a lot more comfortable with real-world deployment workflows. This was mostly a fan project, but it ended up being a really useful way to get back into web development after a short break. I brushed up on Git workflows, got more comfortable with CSS animations, and learned a lot about handling user input smoothly in the browser without external libraries. Overall, it’s a small project, but it taught me a surprising amount about building something end-to-end- from idea to deployment. If you enjoyed it or want to see improvements, feel free to star the repo or check it out....
|
1793051570.0076904
|
1793137970.0076904
|
|
5234
|
CraftHub by @Axeno | Stardance
|
Axeno
|
1
|
17.89
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-11T21:00:04Z", "hours": 11.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "CraftHub is a unified platform that makes it easy to discover and download Minecraft mods, plugins, modpacks, and more from multiple sources like Modrinth, SpigotMC, in one place.", "repo": "https://github.com/timeobvrt/CraftHub", "demo": "https://crafthub.axeno.me/"}]...
|
[{"post_id": 72214, "ts": "202 [{"post_id": 72214, "ts": "2026-09-22T13:51:22Z", "hours": 5.5394, "text": "I reworked some of page components (again)"}, {"post_id": 69291, "ts": "2026-09-16T19:05:54Z", "hours": 1.3506, "text": "I reworked some of the page components to give them a more human feel, rather than an AI-generated one."}, {"post_id": 66178, "ts": "2026-09-11T20:46:49Z", "hours": 1.0422, "text": "I’ve added a new download modal to simplify downloads and list all available versions in one place"}, {"post_id": 66147, "ts": "2026-09-11T19:37:50Z", "hours": 6.1339, "text": "CraftHub now supports SpigotMC resources alongside Modrinth projects."}, {"post_id": 65113, "ts": "2026-09-10T00:51:56Z", "hours": 3.1531, "text": "I redesigned a large part of the website to give CraftHub cleaner and more consitent look. The search and project pages have been reworked, with better layouts, project cards, filter and overall navigation. The search system has been significantly improved. You can now filter projects by Minecraft version, loader and project type, as well as sort results by relevance, downloads, publish date, … I aso added pagination and improved support for projects that have multiple types such as projects available as both a mod and a plugin. The integration with the Modrinth API v3 has also been improved to better handle project data and filtering."}, {"post_id": 64873, "ts": "2026-09-09T15:56:17Z", "hours": 0.305, "text": "I set up the project using Laravel, Blade and Tailwind CSS, create the first version of homepage and started integrating the Modrinth API for project search."}]...
|
Title: CraftHub by @Axeno | Stardance
Devlogs:
I Title: CraftHub by @Axeno | Stardance
Devlogs:
I set up the project using Laravel, Blade and Tailwind CSS, create the first version of homepage and started integrating the Modrinth API for project search.
I redesigned a large part of the website to give CraftHub cleaner and more consitent look. The search and project pages have been reworked, with better layouts, project cards, filter and overall navigation. The search system has been significantly improved. You can now filter projects by Minecraft version, loader and project type, as well as sort results by relevance, downloads, publish date, … I aso added pagination and improved support for projects that have multiple types such as projects available as both a mod and a plugin. The integration with the Modrinth API v3 has also been improved to better handle project data and filtering.
CraftHub now supports SpigotMC resources alongside Modrinth projects.
I’ve added a new download modal to simplify downloads and list all available versions in one place
I reworked some of the page components to give them a more human feel, rather than an AI-generated one.
I reworked some of page components (again)
Ships:
CraftHub is a unified platform that makes it easy to discover and download Minecraft mods, plugins, modpacks, and more from multiple sources like Modrinth, SpigotMC, in one place....
|
1793004923.2992067
|
1793091323.2992067
|
|
5249
|
Google Sheet Based DB API by @monkeyBanana2048 | S Google Sheet Based DB API by @monkeyBanana2048 | Stardance...
|
monkeyBanana2048
|
1
|
6.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-07-06T03:00:27Z", "hours": 6.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "SheetsDB: Turn google sheets into a functioning backend for your applications! This project uses apps script in order to manipulate and store data on a google sheet that can be edited visually, or through POST requests. In order to use like a database, the user can send POST requests with the type of request (GET, POST, PUT, DELETE) in the body (bypass url limits) to the apps script deployment url. The most challenging part of this project was designing the metadata tables and figuring out the best ways to organize data in the google sheet so it could be accessed more easily by the apps script. The best part about this project was seeing it being able to handle many of the functions that industry databases have, such as renaming tables, queries with parameters such as (sort, where, etc), and handling schema. Detailed instructions on how to use this project can be found in the readme file on the repository. A demo is also available on the website.", "repo": "https://github.com/Arnav-Saraf-Official/sheetsdb/", "demo": "https://sheetsdb.vercel.app"}]...
|
[{"post_id": 23249, "ts": "202 [{"post_id": 23249, "ts": "2026-07-06T02:50:53Z", "hours": 0.5825, "text": "Decided to create an implementation of RLS. It’s kind of sloppy, but it should work for it’s purpose. It works by having hidden columns on every table that dictate what keys have access to the rows, and what permissions those keys have. Service key is able to set RLS status (enabled/disabled) and individual keys are generated per user. I think the project is ready to be shipped, because honestly SheetDB is pretty slow because it uses apps script and google sheets. So if you want to scale up and have multiple users, its better to use Supabase or something of that sort."}, {"post_id": 20458, "ts": "2026-07-02T01:42:34Z", "hours": 0.7642, "text": "Made auth better I didn’t think putting the password as a argument in the URL itself was a good implementation, so I took the liberty to beef things up a bit more. Now: Separate master key Separate read-only key Keys submitted in the body of post requests Additionally, I found a bug with removing rows. It didn’t cascade down leading to holes in indexing so I fixed the indexing part of the script. TODO: Tbh, this is almost complete imo, but if I did have to do some more work, then: Implement RLS Implement indexing/cache (optional ultra pro max)"}, {"post_id": 20126, "ts": "2026-07-01T17:32:49Z", "hours": 4.5722, "text": "Finished all the required stuff to have a sorta working database, still need better auth. I was trying to abstain from AI, but sometimes CORS errors really get on your nerves. People can start using this today, but the authentication is pretty much non-existent. Future updates will probably focus around getting the authentication to be better, and maybe implementing indexing emulation and RLS. Website is deployed here . You can find more details on gh bc I already spent a lot of time writing docs lol."}]...
|
Title: Google Sheet Based DB API by @monkeyBanana2 Title: Google Sheet Based DB API by @monkeyBanana2048 | Stardance
Devlogs:
Finished all the required stuff to have a sorta working database, still need better auth. I was trying to abstain from AI, but sometimes CORS errors really get on your nerves. People can start using this today, but the authentication is pretty much non-existent. Future updates will probably focus around getting the authentication to be better, and maybe implementing indexing emulation and RLS. Website is deployed here . You can find more details on gh bc I already spent a lot of time writing docs lol.
Made auth better I didn’t think putting the password as a argument in the URL itself was a good implementation, so I took the liberty to beef things up a bit more. Now: Separate master key Separate read-only key Keys submitted in the body of post requests Additionally, I found a bug with removing rows. It didn’t cascade down leading to holes in indexing so I fixed the indexing part of the script. TODO: Tbh, this is almost complete imo, but if I did have to do some more work, then: Implement RLS Implement indexing/cache (optional ultra pro max)
Decided to create an implementation of RLS. It’s kind of sloppy, but it should work for it’s purpose. It works by having hidden columns on every table that dictate what keys have access to the rows, and what permissions those keys have. Service key is able to set RLS status (enabled/disabled) and individual keys are generated per user. I think the project is ready to be shipped, because honestly SheetDB is pretty slow because it uses apps script and google sheets. So if you want to scale up and have multiple users, its better to use Supabase or something of that sort.
Ships:
SheetsDB: Turn google sheets into a functioning backend for your applications! This project uses apps script in order to manipulate and store data on a google sheet that can be edited visually, or through POST requests. In order to use like a database, the user can send POST requests with the type of request (GET, POST, PUT, DELETE) in the body (bypass url limits) to the apps script deployment url. The most challenging part of this project was designing the metadata tables and figuring out the best ways to organize data in the google sheet so it could be accessed more easily by the apps script. The best part about this project was seeing it being able to handle many of the functions that industry databases have, such as renaming tables, queries with parameters such as (sort, where, etc), and handling schema. Detailed instructions on how to use this project can be found in the readme file on the repository. A demo is also available on the website....
|
1792972271.8002973
|
1793058671.8002973
|
|
5252
|
Pandakeeb by @panda | Stardance
|
panda
|
1
|
3.0
|
15
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-02T12:23:45Z", "hours": 3.0, "multiplier": 5.0, "payout": 15, "blessing": "neutral", "text": "I finished all the design files for my split keyboard design - from Schematic to PCB to Case. The Keyboard is a classic wireless split Corne Keyboard with a Battery that lasts literal ages - it uses a ergonomic 3x6 key layout with 3 thumb switches per side - thats 21 switches per side, and 42 in total. it also has a physical power switch, a charging circuit, and a 0.91” OLED integrated ! This is my first ship, there will be another when im done with the actual physical build.", "repo": "https://github.com/mail2adnanyazik-bit/Pandakeeb", "demo": ""}]...
|
[{"post_id": 39447, "ts": "202 [{"post_id": 39447, "ts": "2026-08-02T12:18:39Z", "hours": 16.9939, "text": "I dont fully understand why, but some of the time i coded on other projects is showing up here - i only did around 5 hours of work, but 16 hours are showing up. Eh, idk. Anyway, im continuing now - i put together an aliexpress cart, and will order soon !"}, {"post_id": 27095, "ts": "2026-07-12T11:01:15Z", "hours": 2.2603, "text": "EVERYTHING GOT WIPED CAUSE I FORGOT TO SAAAVEEE i spent like waaay too much time learning how ZMK works for my Split Keyboard project, then submitted it, and guess what - i forgot to save (since i recently switched to nvim) AND MY LAPTOP POWERED OFFF. Anyway now i gotta write the code AGAIN T-T the green dot of nvim doom that tells you you haven’t saved changes :"}, {"post_id": 26541, "ts": "2026-07-11T12:42:08Z", "hours": 18.1669, "text": "Actually done this time. Too many mistakes lol check it out at https://github.com/mail2adnanyazik-bit/Splitboard"}, {"post_id": 20229, "ts": "2026-07-01T19:34:46Z", "hours": 1.1436, "text": "Completely Done ! I got my grant :D"}, {"post_id": 18618, "ts": "2026-06-29T20:22:12Z", "hours": 0.8547, "text": "Done with the Project ! All that is left is to tidy everything up in a repo, and im done !"}, {"post_id": 18524, "ts": "2026-06-29T18:22:01Z", "hours": 1.1667, "text": "Done with right side ! I was able to modify the design for the left side enough to make it fit the right side, unfortunately KiCad was being a real beach, and wouldnt let me flip the components on the 3d model properly, so i dont have a 3d model of the PCB on the right side D:"}, {"post_id": 18411, "ts": "2026-06-29T15:33:40Z", "hours": 2.8728, "text": "Case Bottom, and right side assembly Im done with the SplitBoard Case Bottom ! I started by using the PCB as a reference model, then made the outline bigger, symmetrical, added holes, made the inside hollow, and then started to polish : I rounded the edges, added a hole for the USB port thats rounded off (see below), then adjusted the case top to fit the bottom, and added chamfering and polish for the less tall components, while making it match the case body. I also just finished making an approximation of how it will look in the end : Unfortunately, this is only the Assembly and 3D Model for half the Keyboard (the right) - next i will be working on the same thing for the left side"}, {"post_id": 17006, "ts": "2026-06-27T16:20:49Z", "hours": 3.6911, "text": "3D Modeling - Case Top After a long time of being lazy and working on the schematic for my other current project AquaPuck ( Psstt … U should check it out ! Its also on Stardance … ) im back ! I started working on the 3D modeled Case for my SplitBoard ! I had a bit of experience from the PandaPad (My hackpad stardance project) for this part, only difference is, the Hackpad was 6 keys and 2 other Parts - compared to that this thing is MIND BLOWING ! So what i did today was first plan - Just like for the PandaPad, i decided to use just 2 parts : The Case Bottom (A kind of hollow shell with space for the PCB) The Case Top (Basically a flat top for the Case Bottom with holes where the switches and screen or other components can poke through) For now i decided to start with the Case Top, as the Bottom would be a lot complexer than the Top. Im realzing now that could be a mistake. Anyway, to make the Top, this is what i started with - the 3D model for my PCB : I started counting the components that would poke through - these were : The Keyswitches The Power Switch The OLED Screen The screws So i started drawing cutouts for all of them : This is just the first sketch with cutouts, as i will have to make the entire thing bigger later (this is currently only as big as the PCB - Since this attaches to the Case itself it will need to be as big as the case - and the case walls will also have thickness, get it ?) After extruding (just for show !) :"}, {"post_id": 11567, "ts": "2026-06-18T21:05:05Z", "hours": 1.8511, "text": "I started working on 3D Modeling ! Since i wanted a final assembled version of the Splitboard with all components for visualization of the final Project, and just to have some help modeling the Case , i decided to add 3D models of all my components to the PCB directly in KiCad - and damn were these CAD models bloodsuckingly hard to find little things. They eluded me for literal hours while i was searching every damn corner of the web for these things, and when i found them they wer too vague to be used. Only through persistence did i manage to find the correct or at least as good as models as i could find - and now i have a complete model of my PCB, as long as a good guideline for the case, and how it will end up in the final ship. Here is the PCB in KiCad’s built in 3D renderer :"}, {"post_id": 11328, "ts": "2026-06-18T15:11:25Z", "hours": 1.6031, "text": "I finished the PCB ! I changed the Edge.Cuts from just a rectangle to this - it fits the keyboard more, and looks a bit better ! I finished wiring, and it was a CHALLENGE ! It took around 1 and a half hours, and it was a monster - this is only the second PCB im making, and my goal was to not use any vias, because i had’nt needed any for my Hackpad. Unfortunately, i severely underestimated the difficulty jump from a mere 6 key switch matrix with rotary encoder and OLED to this whole ass keyboard. So unfortunately my PCB is littered with via’s, which isnt bad per se, but is still bad practice. I had to sometimes use 6 or more via’s for ONE wire. Anyway, im finally done, and will move on to the case next !"}, {"post_id": 10776, "ts": "2026-06-17T18:04:56Z", "hours": 1.8667, "text": "I arranged all my switches and other components on the PCB meticulously, and drew the Edge.Cuts - its rectangular for now, but i might change that - Im not sure NEXT UP : I have to route the PCB (wire spider nest coming up !)"}, {"post_id": 10196, "ts": "2026-06-16T20:13:07Z", "hours": 4.9786, "text": "Finished the whole Schematic for my Wireless Split keyboard - with ALL components. it was challenging to find the correct symbols and footprints, as for example the microcontroller symbol used physical pins instead of digital pins like normal - i needed to map the physical pins to the corresponding digital pins. Also the battery doesnt actually have a symbol - same with the OLED. I had to use alternatives like using test points or pin headers and assigning different footprints. Next up : The PCB (its gonna be hell)"}, {"post_id": 9238, "ts": "2026-06-15T14:46:43Z", "hours": 2.9831, "text": "I researched on which components are best for a split keyboard, and made Decisions on how the final design will look : What i’ve decided : The Keyboard will be completely wireless It will be split in two symmetrical halves (split keyboard, duh) It will use a Supermini nrf52840 microcontroller for both halves It will follow the standard Corne layout instead of a bigger one - Corne layout means 3x6 switch matrix with 3 thumb keys per half, which means it will have 42 total keys It will use a 110 mAh battery instead of 600, as otherwise it would’nt fit under the microcontroller, and the case could’nt be as low-profile as i want It will have 2 OLED’s - most probably one for layers (im a kb warrior) and one for battery level/connectivity I decided against backlighting as it causes HUGE battery drain, and my microcontroller is cheap, but the tradeoff is a bigger battery consumption im havent decided if i will use the official Cherry mx switches which are expensive (dollar per key) or cheap ones (0.30cts a key) I will use 1 reversible PCB instead of a breakoff pcb that u split down the middle with mousebites Next steps : I will have to first find footprints and symbols for all the components - all i found till now is the symbol and footprint for microcontroller Then i will make my Schematic with all components, then arrange and wire the PCB Then i will depending on my final PCB, I will make a case according to how i want it to feel and how low/high profile it should be, how thick, mounting method, etc."}]...
|
Title: Pandakeeb by @panda | Stardance
Devlogs:
I Title: Pandakeeb by @panda | Stardance
Devlogs:
I researched on which components are best for a split keyboard, and made Decisions on how the final design will look : What i’ve decided : The Keyboard will be completely wireless It will be split in two symmetrical halves (split keyboard, duh) It will use a Supermini nrf52840 microcontroller for both halves It will follow the standard Corne layout instead of a bigger one - Corne layout means 3x6 switch matrix with 3 thumb keys per half, which means it will have 42 total keys It will use a 110 mAh battery instead of 600, as otherwise it would’nt fit under the microcontroller, and the case could’nt be as low-profile as i want It will have 2 OLED’s - most probably one for layers (im a kb warrior) and one for battery level/connectivity I decided against backlighting as it causes HUGE battery drain, and my microcontroller is cheap, but the tradeoff is a bigger battery consumption im havent decided if i will use the official Cherry mx switches which are expensive (dollar per key) or cheap ones (0.30cts a key) I will use 1 reversible PCB instead of a breakoff pcb that u split down the middle with mousebites Next steps : I will have to first find footprints and symbols for all the components - all i found till now is the symbol and footprint for microcontroller Then i will make my Schematic with all components, then arrange and wire the PCB Then i will depending on my final PCB, I will make a case according to how i want it to feel and how low/high profile it should be, how thick, mounting method, etc.
Finished the whole Schematic for my Wireless Split keyboard - with ALL components. it was challenging to find the correct symbols and footprints, as for example the microcontroller symbol used physical pins instead of digital pins like normal - i needed to map the physical pins to the corresponding digital pins. Also the battery doesnt actually have a symbol - same with the OLED. I had to use alternatives like using test points or pin headers and assigning different footprints. Next up : The PCB (its gonna be hell)
I arranged all my switches and other components on the PCB meticulously, and drew the Edge.Cuts - its rectangular for now, but i might change that - Im not sure NEXT UP : I have to route the PCB (wire spider nest coming up !)
I finished the PCB ! I changed the Edge.Cuts from just a rectangle to this - it fits the keyboard more, and looks a bit better ! I finished wiring, and it was a CHALLENGE ! It took around 1 and a half hours, and it was a monster - this is only the second PCB im making, and my goal was to not use any vias, because i had’nt needed any for my Hackpad. Unfortunately, i severely underestimated the difficulty jump from a mere 6 key switch matrix with rotary encoder and OLED to this whole ass keyboard. So unfortunately my PCB is littered with via’s, which isnt bad per se, but is still bad practice. I had to sometimes use 6 or more via’s for ONE wire. Anyway, im finally done, and will move on to the case next !
I started working on 3D Modeling ! Since i wanted a final assembled version of the Splitboard with all components for visualization of the final Project, and just to have some help modeling the Case , i decided to add 3D models of all my components to the PCB directly in KiCad - and damn were these CAD models bloodsuckingly hard to find little things. They eluded me for literal hours while i was searching every damn corner of the web for these things, and when i found them they wer too vague to be used. Only through persistence did i manage to find the correct or at least as good as models as i could find - and now i have a complete model of my PCB, as long as a good guideline for the case, and how it will end up in the final ship. Here is the PCB in KiCad’s built in 3D renderer :
3D Modeling - Case Top After a long time of being lazy and working on the schematic for my other current project AquaPuck ( Psstt … U should check it out ! Its also on Stardance … ) im back ! I started working on the 3D modeled Case for my SplitBoard ! I had a bit of experience from the PandaPad (My hackpad stardance project) for this part, only difference is, the Hackpad was 6 keys and 2 other Parts - compared to that this thing is MIND BLOWING ! So what i did today was first plan - Just like for the PandaPad, i decided to use just 2 parts : The Case Bottom (A kind of hollow shell with space for the PCB) The Case Top (Basically a flat top for the Case Bottom with holes where the switches and screen or other components can poke through) For now i decided to start with the Case Top, as the Bottom would be a lot complexer than the Top. Im realzing now that could be a mistake. Anyway, to make the Top, this is what i started with - the 3D model for my PCB : I started counting the components that would poke through - these were : The Keyswitches The Power Switch The OLED Screen The screws So i started drawing cutouts for all of them : This is just the first sketch with cutouts, as i will have to make the entire thing bigger later (this is currently only as big as the PCB - Since this attaches to the Case itself it will need to be as big as the case - and the case walls will also have thickness, get it ?) After extruding (just for show !) :
Case Bottom, and right side assembly Im done with the SplitBoard Case Bottom ! I started by using the PCB as a reference model, then made the outline bigger, symmetrical, added holes, made the inside hollow, and then started to polish : I rounded the edges, added a hole for the USB port thats rounded off (see below), then adjusted the case top to fit the bottom, and added chamfering and polish for the less tall components, while making it match the case body. I also just finished making an approximation of how it will look in the end : Unfortunately, this is only the Assembly and 3D Model for half the Keyboard (the right) - next i will be working on the same thing for the left side
Done with right side ! I was able to modify the design for the left side enough to make it fit the right side, unfortunately KiCad was being a real beach, and wouldnt let me flip the components on the 3d model properly, so i dont have a 3d model of the PCB on the right side D:
Done with the Project ! All that is left is to tidy everything up in a repo, and im done !
Completely Done ! I got my grant :D
Actually done this time. Too many mistakes lol check it out at https://github.com/mail2adnanyazik-bit/Splitboard
EVERYTHING GOT WIPED CAUSE I FORGOT TO SAAAVEEE i spent like waaay too much time learning how ZMK works for my Split Keyboard project, then submitted it, and guess what - i forgot to save (since i recently switched to nvim) AND MY LAPTOP POWERED OFFF. Anyway now i gotta write the code AGAIN T-T the green dot of nvim doom that tells you you haven’t saved changes :
I dont fully understand why, but some of the time i coded on other projects is showing up here - i only did around 5 hours of work, but 16 hours are showing up. Eh, idk. Anyway, im continuing now - i put together an aliexpress cart, and will order soon !
Ships:
I finished all the design files for my split keyboard design - from Schematic to PCB to Case. The Keyboard is a classic wireless split Corne Keyboard with a Battery that lasts literal ages - it uses a ergonomic 3x6 key layout with 3 thumb switches per side - thats 21 switches per side, and 42 in total. it also has a physical power switch, a charging circuit, and a 0.91” OLED integrated ! This is my first ship, there will be another when im done with the actual physical build....
|
1792972604.243327
|
1793059004.243327
|
|
5265
|
Abohisham-Web by @Abohisham | Stardance
|
Abohisham
|
1
|
4.0
|
7
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-01T15:15:31Z", "hours": 4.0, "multiplier": 1.7, "payout": 7, "blessing": "neutral", "text": "I have mainly focused on fixing some of the issues for this ship, previously i shipped to flavortown, and got a lot of bad comments cuz this didnt work probably on safari browser. so i had to do some internal fixes. Aside from that, i have done some changes in the ui to make this look a lot better.", "repo": "https://github.com/MohamadAminGhanoum/Abohisham-Web", "demo": "https://abohisham-web.vercel.app/index.html"}]...
|
[{"post_id": 58088, "ts": "202 [{"post_id": 58088, "ts": "2026-08-30T13:20:19Z", "hours": 1.8464, "text": "In this session, i have done some changes to the homepage look, especially the navigation bar, made it float, and have a transparent bg. did some small changes to the page paddings to make the bg fit the whole page even when zooming out, and also made padding to the navigation bar, which leaves some distance between the navbar and the contents on the screen. i also did osme changes to the folders, where i made all the images become in one folder, since when i looked in my repo, it really looked messed up. So i got that fixed, but it did ruin some places, where the image would not load, so i will fix that b4 the next devlog."}, {"post_id": 2412, "ts": "2026-06-04T21:34:31Z", "hours": 1.4092, "text": "Pheew, this took long to fix. I finally was able to upload .md files into my hardware projects folder. I just focused right now on configuring how the pictures should load. I will work more on later on how to customize it more."}, {"post_id": 956, "ts": "2026-06-02T18:40:51Z", "hours": 0.8381, "text": "I was just able to add the time into the center of my website, and i managed to do some additional changes in the top navigation bar, so now it is more transparent. I also learned about the overflow-x, because i actually found it really annoying that the page would move left and right, so now it is only moving vertical. I will try to work on the content next time, i will try to make this more useful in a person’s everyday life. So that i can put this on my pc, and use this while studying, to avoid distractions If u have any suggestions, please lmk."}]...
|
Title: Abohisham-Web by @Abohisham | Stardance
De Title: Abohisham-Web by @Abohisham | Stardance
Devlogs:
I was just able to add the time into the center of my website, and i managed to do some additional changes in the top navigation bar, so now it is more transparent. I also learned about the overflow-x, because i actually found it really annoying that the page would move left and right, so now it is only moving vertical. I will try to work on the content next time, i will try to make this more useful in a person’s everyday life. So that i can put this on my pc, and use this while studying, to avoid distractions If u have any suggestions, please lmk.
Pheew, this took long to fix. I finally was able to upload .md files into my hardware projects folder. I just focused right now on configuring how the pictures should load. I will work more on later on how to customize it more.
In this session, i have done some changes to the homepage look, especially the navigation bar, made it float, and have a transparent bg. did some small changes to the page paddings to make the bg fit the whole page even when zooming out, and also made padding to the navigation bar, which leaves some distance between the navbar and the contents on the screen. i also did osme changes to the folders, where i made all the images become in one folder, since when i looked in my repo, it really looked messed up. So i got that fixed, but it did ruin some places, where the image would not load, so i will fix that b4 the next devlog.
Ships:
I have mainly focused on fixing some of the issues for this ship, previously i shipped to flavortown, and got a lot of bad comments cuz this didnt work probably on safari browser. so i had to do some internal fixes. Aside from that, i have done some changes in the ui to make this look a lot better....
|
1793008132.5503554
|
1793094532.5503554
|
|
5287
|
Mars Terrain Classifier by @Gelo | Stardance
|
Gelo
|
1
|
4.0
|
27
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-10T21:25:42Z", "hours": 4.0, "multiplier": 6.75, "payout": 27, "blessing": "neutral", "text": "I made a Mars Terrain Classifier – a deep learning model that identifies 7 types of Martian geological features from orbital satellite images. The categories are: bright dune, crater, dark dune, impact ejecta, slope streak, spider, and swiss cheese. I also built a web interface where anyone can upload an image and get an instant prediction with confidence scores. The model runs on Hugging Face and the frontend is deployed on Netlify. Live demo: https://mars-terrain-classifier.netlify.app The biggest challenge was dataset handling. The official NASA dataset was over 20GB and kept failing to download. I had to find a smaller HiRISE dataset and manually organize it into train/val splits. Git was another nightmare – the trained model file was 216MB and GitHub kept rejecting my push. I had to use .gitignore and rewrite git history to remove it. Also, the model struggles with low-resolution images, weird color tones, and rover photos (since it was trained only on orbiter data). Debugging OpenCV image generation and label creation took way more time than expected. I’m proud that the model achieved 97% validation accuracy despite all the data issues. The web interface looks clean and professional – it has drag-and-drop upload, real-time predictions, and a NASA-inspired design. I’m also proud that I figured out how to deploy the model on Hugging Face and the frontend on Netlify, making it accessible to anyone without installing anything. The project went from a broken script to a fully functional web app that people can actually use. Go to https://mars-terrain-classifier.netlify.app – upload any Mars orbital image (JPG, PNG, TIFF). The model works best on clear, high-contrast satellite photos from HiRISE. It will struggle with low-resolution images, overexposed shots, or photos taken by rovers (Curiosity/Perseverance) because it was only trained on orbiter data. If the prediction confidence is low or seems wrong, it’s probably a resolution or color issue. The GitHub repo has all the code if you want to run it locally: https://github.com/gelo-dev-e/mars-terrain-classifier", "repo": "https://github.com/gelo-dev-e/mars-terrain-classifier", "demo": "https://mars-terrain-classifier.netlify.app"}]...
|
[{"post_id": 6457, "ts": "2026 [{"post_id": 6457, "ts": "2026-06-10T21:21:31Z", "hours": 0.9569, "text": "Final Devlog – Mars Terrain Classifier The Mars Terrain Classifier is now live The model runs on Hugging Face for inference, and the frontend is deployed on Netlify. You can try it here: 🔗 https://mars-terrain-classifier.netlify.app The model works well on clear orbital images from HiRISE, but it struggles with low-resolution photos, overexposed shots, or images with unusual color tones. It also has difficulty with rover-level photos (like from Curiosity or Perseverance) since it was trained only on orbiter data. Categories like spider and swiss cheese have fewer training samples, so predictions there are less confident. Upload a Mars image and see what happens – if it fails, it’s probably a resolution or color issue. The web UI is fully functional with drag-and-drop upload and real-time confidence scores. Live demo: https://mars-terrain-classifier.netlify.app GitHub: https://github.com/gelo-dev-e/mars-terrain-classifier"}, {"post_id": 3436, "ts": "2026-06-06T11:28:04Z", "hours": 0.9633, "text": "Devlog – Web UI for Mars Terrain Classifier Title: Building a Web Interface for the Mars Terrain Classifier After training the model to 97% validation accuracy, I created a web-based user interface to make the classifier accessible to anyone – no command line needed. The UI features: Drag & drop image upload Real-time prediction display 7 terrain categories with visual indicators Clean NASA-inspired design (dark theme, Mars colors) I’m not sure yet if I will deploy this publicly online, but the entire project will remain open source. The code, the training scripts, the web UI, and everything else will be available on GitHub for anyone to use, modify, or improve."}, {"post_id": 2799, "ts": "2026-06-05T16:46:46Z", "hours": 0.7358, "text": "Devlog – Training Complete! After all the dataset struggles, I finally completed the training! Training Results I trained a ResNet50 model for 20 epochs on 7 Mars terrain categories (bright dune, crater, dark dune, impact ejecta, slope streak, spider, swiss cheese). Final metrics: Training Accuracy: 96.41% Validation Accuracy: 96.80% Best Validation Accuracy: 97.00% Training Loss: 0.1261 Validation Loss: 0.0968 The model achieved 97% validation accuracy which is solid for a 7-class classifier on orbital Mars imagery. What Worked Well ResNet50 pretrained on ImageNet was a great base – even with limited data, it learned quickly Freezing early layers and only training layer4 + fc prevented overfitting Dropout (0.4 and 0.3) helped with generalization Data augmentation (random flips, rotations) made the model more robust Next Steps Now that I have a working model at 97% accuracy, here’s what’s next: Test on completely unseen validation data The 97% was measured on the validation split (20% of the original dataset) Next, I need to test on brand new images that the model has never seen – not even in validation Real-world testing Find fresh Mars orbiter images online (not from the original dataset) See if the model can correctly identify terrain types in the wild Identify weak spots Which categories is the model struggling with? Spider and swiss cheese have fewer training samples – likely lower accuracy Confusion matrix will show where mistakes happen Deploy as a demo Build a simple interface Upload any Mars image and get instant terrain prediction Goal Take the 97% validation model and prove it works on real-world, never-before-seen Mars images – not just the test split from the dataset."}, {"post_id": 1680, "ts": "2026-06-03T20:34:42Z", "hours": 0.585, "text": "I initially planned to use 4 simple categories (crater, dusty, rocky, sandy), but I ended up with 7 scientific categories from the HiRISE orbiter dataset: bright dune, crater, dark dune, impact ejecta, slope streak, spider, and swiss cheese. The main challenge was that the official NASA datasets (AI4Mars) had over 50,000 images and were too large to download (around 16-20 GB). Direct download kept failing, and the dataset required heavy preprocessing because it was semantic segmentation, not simple image classification. So instead, I used a smaller HiRISE dataset from Kaggle. The trade-off is that these are orbital telescope images, not rover photos, so the terrain looks different. Also, some categories like spider and swiss cheese are very rare, which makes the dataset imbalanced, and the model might struggle to learn them properly."}, {"post_id": 1418, "ts": "2026-06-03T13:26:55Z", "hours": 0.8628, "text": "Making the dataset (training and validation data) for my model."}]...
|
Title: Mars Terrain Classifier by @Gelo | Stardanc Title: Mars Terrain Classifier by @Gelo | Stardance
Devlogs:
Making the dataset (training and validation data) for my model.
I initially planned to use 4 simple categories (crater, dusty, rocky, sandy), but I ended up with 7 scientific categories from the HiRISE orbiter dataset: bright dune, crater, dark dune, impact ejecta, slope streak, spider, and swiss cheese. The main challenge was that the official NASA datasets (AI4Mars) had over 50,000 images and were too large to download (around 16-20 GB). Direct download kept failing, and the dataset required heavy preprocessing because it was semantic segmentation, not simple image classification. So instead, I used a smaller HiRISE dataset from Kaggle. The trade-off is that these are orbital telescope images, not rover photos, so the terrain looks different. Also, some categories like spider and swiss cheese are very rare, which makes the dataset imbalanced, and the model might struggle to learn them properly.
Devlog – Training Complete! After all the dataset struggles, I finally completed the training! Training Results I trained a ResNet50 model for 20 epochs on 7 Mars terrain categories (bright dune, crater, dark dune, impact ejecta, slope streak, spider, swiss cheese). Final metrics: Training Accuracy: 96.41% Validation Accuracy: 96.80% Best Validation Accuracy: 97.00% Training Loss: 0.1261 Validation Loss: 0.0968 The model achieved 97% validation accuracy which is solid for a 7-class classifier on orbital Mars imagery. What Worked Well ResNet50 pretrained on ImageNet was a great base – even with limited data, it learned quickly Freezing early layers and only training layer4 + fc prevented overfitting Dropout (0.4 and 0.3) helped with generalization Data augmentation (random flips, rotations) made the model more robust Next Steps Now that I have a working model at 97% accuracy, here’s what’s next: Test on completely unseen validation data The 97% was measured on the validation split (20% of the original dataset) Next, I need to test on brand new images that the model has never seen – not even in validation Real-world testing Find fresh Mars orbiter images online (not from the original dataset) See if the model can correctly identify terrain types in the wild Identify weak spots Which categories is the model struggling with? Spider and swiss cheese have fewer training samples – likely lower accuracy Confusion matrix will show where mistakes happen Deploy as a demo Build a simple interface Upload any Mars image and get instant terrain prediction Goal Take the 97% validation model and prove it works on real-world, never-before-seen Mars images – not just the test split from the dataset.
Devlog – Web UI for Mars Terrain Classifier Title: Building a Web Interface for the Mars Terrain Classifier After training the model to 97% validation accuracy, I created a web-based user interface to make the classifier accessible to anyone – no command line needed. The UI features: Drag & drop image upload Real-time prediction display 7 terrain categories with visual indicators Clean NASA-inspired design (dark theme, Mars colors) I’m not sure yet if I will deploy this publicly online, but the entire project will remain open source. The code, the training scripts, the web UI, and everything else will be available on GitHub for anyone to use, modify, or improve.
Final Devlog – Mars Terrain Classifier The Mars Terrain Classifier is now live The model runs on Hugging Face for inference, and the frontend is deployed on Netlify. You can try it here: 🔗 https://mars-terrain-classifier.netlify.app The model works well on clear orbital images from HiRISE, but it struggles with low-resolution photos, overexposed shots, or images with unusual color tones. It also has difficulty with rover-level photos (like from Curiosity or Perseverance) since it was trained only on orbiter data. Categories like spider and swiss cheese have fewer training samples, so predictions there are less confident. Upload a Mars image and see what happens – if it fails, it’s probably a resolution or color issue. The web UI is fully functional with drag-and-drop upload and real-time confidence scores. Live demo: https://mars-terrain-classifier.netlify.app GitHub: https://github.com/gelo-dev-e/mars-terrain-classifier
Ships:
I made a Mars Terrain Classifier – a deep learning model that identifies 7 types of Martian geological features from orbital satellite images. The categories are: bright dune, crater, dark dune, impact ejecta, slope streak, spider, and swiss cheese. I also built a web interface where anyone can upload an image and get an instant prediction with confidence scores. The model runs on Hugging Face and the frontend is deployed on Netlify. Live demo: https://mars-terrain-classifier.netlify.app The biggest challenge was dataset handling. The official NASA dataset was over 20GB and kept failing to download. I had to find a smaller HiRISE dataset and manually organize it into train/val splits. Git was another nightmare – the trained model file was 216MB and GitHub kept rejecting my push. I had to use .gitignore and rewrite git history to remove it. Also, the model struggles with low-resolution images, weird color tones, and rover photos (since it was trained only on orbiter data). Debugging OpenCV image generation and label creation took way more time than expected. I’m proud that the model achieved 97% validation accuracy despite all the data issues. The web interface looks clean and professional – it has drag-and-drop upload, real-time predictions, and a NASA-inspired design. I’m also proud that I figured out how to deploy the model on Hugging Face and the frontend on Netlify, making it accessible to anyone without installing anything. The project went from a broken script to a fully functional web app that people can actually use. Go to https://mars-terrain-classifier.netlify.app – upload any Mars orbital image (JPG, PNG, TIFF). The model works best on clear, high-contrast satellite photos from HiRISE. It will struggle with low-resolution images, overexposed shots, or photos taken by rovers (Curiosity/Perseverance) because it was only trained on orbiter data. If the prediction confidence is low or seems wrong, it’s probably a resolution or color issue. The GitHub repo has all the code if you want to run it locally: https://github.com/gelo-dev-e/mars-terrain-classifier...
|
1792979536.0248022
|
1793065936.0248022
|
|
5297
|
My first slack bot! by @johanm | Stardance
|
johanm
|
1
|
2.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-28T07:36:31Z", "hours": 2.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "my first project is this and i started off with a slack bot but slowly it developed into an ai chatbot. i looked at a lot of tutorials and made something pretty decent for my first attempt. It was really hard to actually make it up and running on a page instead of the slack api or a local host, but with some help, i got it work.", "repo": "https://github.com/johangmekunnel-eng/rslack-bot", "demo": "https://rslack-bot-production.up.railway.app"}]...
|
[{"post_id": 17452, "ts": "202 [{"post_id": 17452, "ts": "2026-06-28T07:29:52Z", "hours": 0.3611, "text": "made it public using railway and works pretty well"}, {"post_id": 16704, "ts": "2026-06-27T04:33:14Z", "hours": 0.3678, "text": "made a frontend to the bot and works like chatpgt or other ai models rn. saves and stores previous conversations and is able to do all the things it mentions. any suggestions on what to add or what to fix"}, {"post_id": 16680, "ts": "2026-06-27T03:36:25Z", "hours": 0.3956, "text": "added a couple new commands. studyguide, summary and quiz. all of these are able to take in text and create something new. this is all connected to the original ai command where you can ask questions or clarifications on any of the created products."}, {"post_id": 16456, "ts": "2026-06-26T19:43:46Z", "hours": 0.3842, "text": "added small commands and connected it to groq ai api to respond"}]...
|
Title: My first slack bot! by @johanm | Stardance
Title: My first slack bot! by @johanm | Stardance
Devlogs:
added small commands and connected it to groq ai api to respond
added a couple new commands. studyguide, summary and quiz. all of these are able to take in text and create something new. this is all connected to the original ai command where you can ask questions or clarifications on any of the created products.
made a frontend to the bot and works like chatpgt or other ai models rn. saves and stores previous conversations and is able to do all the things it mentions. any suggestions on what to add or what to fix
made it public using railway and works pretty well
Ships:
my first project is this and i started off with a slack bot but slowly it developed into an ai chatbot. i looked at a lot of tutorials and made something pretty decent for my first attempt. It was really hard to actually make it up and running on a page instead of the slack api or a local host, but with some help, i got it work....
|
1792990535.0612218
|
1793076935.0612218
|
|
5301
|
My awesome macropad! by @AmeenR-M | Stardance
|
AmeenR-M
|
1
|
9.02
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-20T18:41:48Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This… this is The Rayquaza Macropad. I was replaying pokemon emerald the other day, and i got to sky pillar, i thought, ‘hey i want a sky pillar’ and one of my freinds had recently made a macropad, so i thought, what if i made a macropad, but wait, with a rayquaza circling it just like sky pillar? and thats how this project was made, i made it so i make a macropad, then the rayquaza is sepertley printed, so it drapes above it. i initally started with working around scotto keebs’ macropad, but i eventually switched it up to this bigger design. I hope you enjoy going through my github page, seeing the cool models, and when its fully fleshed out… the final product", "repo": "https://github.com/ameenrahimmuith-alt/The-Rayquaza-Macropad-", "demo": ""}]...
|
[{"post_id": 72827, "ts": "202 [{"post_id": 72827, "ts": "2026-09-23T20:24:33Z", "hours": 0.4169, "text": "Doing some sizing issues"}, {"post_id": 72362, "ts": "2026-09-22T19:08:53Z", "hours": 0.4669, "text": "Even more case desgin work, i might have a lead on issues!"}, {"post_id": 71933, "ts": "2026-09-21T20:13:05Z", "hours": 3.1339, "text": "Even more cadding, touching up the model, keep having sizing issues, whenever i try models it keeps giving errors…"}, {"post_id": 68802, "ts": "2026-09-15T19:33:11Z", "hours": 5.2175, "text": "More cad work, cant be bothered to take a new screen shot sorry"}, {"post_id": 66900, "ts": "2026-09-12T21:02:44Z", "hours": 0.6336, "text": "More case design, touching stuff up, not done yet tho"}, {"post_id": 59811, "ts": "2026-09-01T19:26:01Z", "hours": 1.7531, "text": "Basically, im cadding? i think thats the term, im fixing bugs with the model"}, {"post_id": 37730, "ts": "2026-07-30T17:15:31Z", "hours": 0.3833, "text": "Im working on a porject… jk a 3x3 macro pad with a rayquaza circling it"}]...
|
Title: My awesome macropad! by @AmeenR-M | Stardan Title: My awesome macropad! by @AmeenR-M | Stardance
Devlogs:
Im working on a porject… jk a 3x3 macro pad with a rayquaza circling it
Basically, im cadding? i think thats the term, im fixing bugs with the model
More case design, touching stuff up, not done yet tho
More cad work, cant be bothered to take a new screen shot sorry
Even more cadding, touching up the model, keep having sizing issues, whenever i try models it keeps giving errors…
Even more case desgin work, i might have a lead on issues!
Doing some sizing issues
Ships:
This… this is The Rayquaza Macropad. I was replaying pokemon emerald the other day, and i got to sky pillar, i thought, ‘hey i want a sky pillar’ and one of my freinds had recently made a macropad, so i thought, what if i made a macropad, but wait, with a rayquaza circling it just like sky pillar? and thats how this project was made, i made it so i make a macropad, then the rayquaza is sepertley printed, so it drapes above it. i initally started with working around scotto keebs’ macropad, but i eventually switched it up to this bigger design. I hope you enjoy going through my github page, seeing the cool models, and when its fully fleshed out… the final product...
|
1793004687.0911157
|
1793091087.0911157
|
|
5308
|
MoodGPT by @nathanmanoj | Stardance
|
nathanmanoj
|
1
|
6.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-03T13:36:37Z", "hours": 6.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I built MoodGPT, a chatbot that lets users switch between different personalities like Funny, Angry, Defensive, Friendly, and Chaotic while chatting with AI. The biggest challenge was creating a clean, ChatGPT-style interface in Streamlit while keeping the code simple and making the mood system consistently affect the AI’s responses. I’m most proud of the polished UI and how each mood gives noticeably different answers to the same question. To test the project, users just need to select a mood, enter a message, and start chatting. A Gemini API key is required for the AI responses to work if you host it locally.", "repo": "https://github.com/NathanManoj1/Moodgpt", "demo": "https://docs.google.com/document/d/1eo2EGDzjMZrBZ6AHeIWNIpiH7KemfXBIk0W7fn7vIV8/edit?usp=sharing"}]...
|
[{"post_id": 1419, "ts": "2026 [{"post_id": 1419, "ts": "2026-06-03T13:28:58Z", "hours": 4.3597, "text": "Finished my project and uploaded to github! Test it out here. https://moodgpt.streamlit.app/ I learned a lot about AI and API’s from this project. I also learned how to showcase it through the streamlit app."}, {"post_id": 1051, "ts": "2026-06-02T21:06:32Z", "hours": 1.885, "text": "Built the first version of the MoodGPT UI today! (A fun chatbot where you can experiment with ai) 🎭 The app now has a modern dark theme, a mood selector with five personalities (Funny, Angry, Defensive, Friendly, and Chaotic), a chat window, and a message input area. Most of my time went into making the interface feel clean and easy to use rather than adding lots of functionality. One hurdle was getting the layout to scale properly when resizing the window without elements overlapping or looking cramped. I also spent longer than expected tweaking spacing, colors, and fonts so the app felt more polished. Next up is improving the chatbot itself and adding more advanced features, but for now I’m happy to finally have a solid foundation and design to build on."}]...
|
Title: MoodGPT by @nathanmanoj | Stardance
Devlog Title: MoodGPT by @nathanmanoj | Stardance
Devlogs:
Built the first version of the MoodGPT UI today! (A fun chatbot where you can experiment with ai) 🎭 The app now has a modern dark theme, a mood selector with five personalities (Funny, Angry, Defensive, Friendly, and Chaotic), a chat window, and a message input area. Most of my time went into making the interface feel clean and easy to use rather than adding lots of functionality. One hurdle was getting the layout to scale properly when resizing the window without elements overlapping or looking cramped. I also spent longer than expected tweaking spacing, colors, and fonts so the app felt more polished. Next up is improving the chatbot itself and adding more advanced features, but for now I’m happy to finally have a solid foundation and design to build on.
Finished my project and uploaded to github! Test it out here. https://moodgpt.streamlit.app/ I learned a lot about AI and API’s from this project. I also learned how to showcase it through the streamlit app.
Ships:
I built MoodGPT, a chatbot that lets users switch between different personalities like Funny, Angry, Defensive, Friendly, and Chaotic while chatting with AI. The biggest challenge was creating a clean, ChatGPT-style interface in Streamlit while keeping the code simple and making the mood system consistently affect the AI’s responses. I’m most proud of the polished UI and how each mood gives noticeably different answers to the same question. To test the project, users just need to select a mood, enter a message, and start chatting. A Gemini API key is required for the AI responses to work if you host it locally....
|
1792997402.2470808
|
1793083802.2470808
|
|
5309
|
Project Kobon by @Bennett_Forcier | Stardance
|
Bennett_Forcier
|
1
|
22.0
|
369
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-29T22:44:47Z", "hours": 22.0, "multiplier": 16.89, "payout": 369, "blessing": "neutral", "text": "Project Kobon is finally shipped!!! I made a Python project that searches for Kobon triangle line arrangements, saves the best results, and includes a viewer for loading and visualizing the generated JSON files. The hardest parts were getting the solver logic working, building the DearPyGui viewer, and then fighting with PyInstaller to make the .exe. I’m proud that it now has a full loop: run the solver, generate results, open them in the viewer, and share the app without needing Python installed.", "repo": "https://github.com/MxpleSticks/Project-Kobon", "demo": "https://github.com/MxpleSticks/Project-Kobon/releases"}]...
|
[{"post_id": 18739, "ts": "202 [{"post_id": 18739, "ts": "2026-06-29T22:30:42Z", "hours": 0.9592, "text": "Finally Finished the EXE After a lot of annoying PyInstaller issues, Project Kobon finally works as a standalone Windows executable!!! This definitely took way longer than the 57 minutes that actually got logged."}, {"post_id": 13197, "ts": "2026-06-21T16:51:49Z", "hours": 2.7283, "text": "Project Update Adding Multi-Process Support This update allows Project Kobon to run multiple instances of the solver at the same time, to find more possible solutions and allows the use of more CPU power. Added multiprocessing so that multiple solver processes can run at the same time. Split the work to be done by the solver into separate workers that will run independently of each other. Each solver worker will search for solutions in different ways (due to using different random seeds). The results from each solver worker will be collected and the best solution found will be selected. A way to set the number of solver workers that will be used, depending on the available CPUs on the machine. All results will be reported using the reporter.py script."}, {"post_id": 8740, "ts": "2026-06-14T15:20:05Z", "hours": 3.4075, "text": "Project Update Finally Building the Viewer This update focused on creating viewer.py . A lot of the triangle calculation code was able to be reused from geometry.py , which made development like 1000x easier and let me focus on building the interface. Built the first working version of the viewer using Dear PyGui . Added support for importing the JSON files generated by Project Kobon. Added a visualizer that draws line arrangements and the triangles they create. Added controls for switching between different saved results."}, {"post_id": 7921, "ts": "2026-06-13T06:20:45Z", "hours": 1.1417, "text": "Project Update Improving the Main UI This update focused on improving the UI of main.py . Redesigned the terminal UI to make it cleaner and easier to navigate. Made menu options more readable and easier to understand. Improved the overall look of the program without changing its functionality."}, {"post_id": 7616, "ts": "2026-06-12T18:51:30Z", "hours": 1.2203, "text": "One small step for man, one giant leap for mankind Ok, not really, but this is the first working version of my pipeline :) This update focused on creating the reporting system and getting the different parts of the project working together. Created reporter.py , which sends solver results to a Discord webhook. Added support for saving the best arrangements as a JSON file. Included information like the score, line angles, and line offsets in the output data. Added a results summary showing the upper bound, line count, goal and top scores found by the solver. Tested the full pipeline from generating arrangements to receiving results through Discord. This is the first point in time where Project Kobon can complete a full run and produce a usable output. My next update will be building the viewer so the generated arrangements can be visualized instead of only being viewed as raw data. Don’t even try to use the webhook URL. I already deleted it."}, {"post_id": 6010, "ts": "2026-06-10T02:22:11Z", "hours": 3.0297, "text": "Project Update Adding Simulated Annealing This update was mainly about adding simulated annealing to Project Kobon. Before this, the project could generate random arrangements, but it could not actively search for better solutions. Created annealing.py , which contains the simulated annealing solver used to search for improved arrangements. Connected main.py to the new solver so users can run simulated annealing directly from the program menu. Updated some function names to make the code easier to read and maintain. Added support for running the solver for a fixed number of iterations or until it reaches a target gap from the theoretical upper bound. Tested the project on a freshly reset computer with a new installation of Python and C++. Everything worked correctly, showing that the project can be set up and run on a clean system."}, {"post_id": 4252, "ts": "2026-06-07T14:32:34Z", "hours": 5.2922, "text": "Project Update Building the Geometry System This update focused on developing the geometry system used by Project Kobon. This system takes an arrangement of lines, finds their intersection points, and counts how many Kobon triangles are present. Developed geometry.py , which calculates line intersections and counts triangles in an arrangement. Changed the project to use CPU-based calculations with NumPy . Added requirements.txt to simplify installation of project dependencies. Added a popup window to viewer.py for displaying information and instructions. Updated README.md with project information, installation steps, and usage instructions."}, {"post_id": 2425, "ts": "2026-06-04T22:03:56Z", "hours": 1.5867, "text": "Project Update Building the State System This update focused on creating the state system used by Project Kobon. The state system stores line arrangements and provides a way to make small changes to them. Created state.py and the LineState dataclass to store the angle and offset of each line. Added createRandomState() , which generates a random arrangement of k lines. Added nudge() , which creates a copy of an arrangement and randomly adjusts one line’s angle or offset. Updated main.py to work with the new state system. Tested the new functions to ensure line arrangements could be created and modified correctly."}, {"post_id": 1893, "ts": "2026-06-04T03:34:42Z", "hours": 0.5936, "text": "Project Update Creating the Viewer This update focused on creating the first version of the project viewer. Created viewer.py and set up a basic DearPyGui window. Learned the basics of working with DearPyGui . Added the ability to open a separate viewer window from the project. Removed config.py because it was no longer needed."}, {"post_id": 1836, "ts": "2026-06-04T01:37:40Z", "hours": 0.9683, "text": "Project Update Creating the Main Program This update I just built main.py , which acts as the main menu system for Project Kobon. Created main.py and added the main menu system. Added user input handling for selecting different program options. Added basic input validation. Added a simple way for users to configure solver parameters from the terminal."}, {"post_id": 1232, "ts": "2026-06-03T02:44:28Z", "hours": 0.4108, "text": "Project Update Writing the README This update focused on creating the first version of README.md . Added an overview explaining what Project Kobon is and its goal. Wrote a description of the Kobon Triangle Problem and why it is still unsolved. Added information about how the project relates to finding arrangements of lines with many non-overlapping triangles. Began documenting how the project will be used and expanded in future updates."}, {"post_id": 1157, "ts": "2026-06-03T00:25:04Z", "hours": 0.6092, "text": "Project Update Setting Up the Project This is my first devlog :) it will focus on setting up the initial structure for Project Kobon. Created the project’s basic file and folder layout. Set up the main modules that I will be using throughout development. Added the initial imports and project structure. Organized the codebase to separate the solver, theory, and viewer components. Began planning how the different parts of the project will work together."}]...
|
Title: Project Kobon by @Bennett_Forcier | Stardan Title: Project Kobon by @Bennett_Forcier | Stardance
Devlogs:
Project Update Setting Up the Project This is my first devlog :) it will focus on setting up the initial structure for Project Kobon. Created the project’s basic file and folder layout. Set up the main modules that I will be using throughout development. Added the initial imports and project structure. Organized the codebase to separate the solver, theory, and viewer components. Began planning how the different parts of the project will work together.
Project Update Writing the README This update focused on creating the first version of README.md . Added an overview explaining what Project Kobon is and its goal. Wrote a description of the Kobon Triangle Problem and why it is still unsolved. Added information about how the project relates to finding arrangements of lines with many non-overlapping triangles. Began documenting how the project will be used and expanded in future updates.
Project Update Creating the Main Program This update I just built main.py , which acts as the main menu system for Project Kobon. Created main.py and added the main menu system. Added user input handling for selecting different program options. Added basic input validation. Added a simple way for users to configure solver parameters from the terminal.
Project Update Creating the Viewer This update focused on creating the first version of the project viewer. Created viewer.py and set up a basic DearPyGui window. Learned the basics of working with DearPyGui . Added the ability to open a separate viewer window from the project. Removed config.py because it was no longer needed.
Project Update Building the State System This update focused on creating the state system used by Project Kobon. The state system stores line arrangements and provides a way to make small changes to them. Created state.py and the LineState dataclass to store the angle and offset of each line. Added createRandomState() , which generates a random arrangement of k lines. Added nudge() , which creates a copy of an arrangement and randomly adjusts one line’s angle or offset. Updated main.py to work with the new state system. Tested the new functions to ensure line arrangements could be created and modified correctly.
Project Update Building the Geometry System This update focused on developing the geometry system used by Project Kobon. This system takes an arrangement of lines, finds their intersection points, and counts how many Kobon triangles are present. Developed geometry.py , which calculates line intersections and counts triangles in an arrangement. Changed the project to use CPU-based calculations with NumPy . Added requirements.txt to simplify installation of project dependencies. Added a popup window to viewer.py for displaying information and instructions. Updated README.md with project information, installation steps, and usage instructions.
Project Update Adding Simulated Annealing This update was mainly about adding simulated annealing to Project Kobon. Before this, the project could generate random arrangements, but it could not actively search for better solutions. Created annealing.py , which contains the simulated annealing solver used to search for improved arrangements. Connected main.py to the new solver so users can run simulated annealing directly from the program menu. Updated some function names to make the code easier to read and maintain. Added support for running the solver for a fixed number of iterations or until it reaches a target gap from the theoretical upper bound. Tested the project on a freshly reset computer with a new installation of Python and C++. Everything worked correctly, showing that the project can be set up and run on a clean system.
One small step for man, one giant leap for mankind Ok, not really, but this is the first working version of my pipeline :) This update focused on creating the reporting system and getting the different parts of the project working together. Created reporter.py , which sends solver results to a Discord webhook. Added support for saving the best arrangements as a JSON file. Included information like the score, line angles, and line offsets in the output data. Added a results summary showing the upper bound, line count, goal and top scores found by the solver. Tested the full pipeline from generating arrangements to receiving results through Discord. This is the first point in time where Project Kobon can complete a full run and produce a usable output. My next update will be building the viewer so the generated arrangements can be visualized instead of only being viewed as raw data. Don’t even try to use the webhook URL. I already deleted it.
Project Update Improving the Main UI This update focused on improving the UI of main.py . Redesigned the terminal UI to make it cleaner and easier to navigate. Made menu options more readable and easier to understand. Improved the overall look of the program without changing its functionality.
Project Update Finally Building the Viewer This update focused on creating viewer.py . A lot of the triangle calculation code was able to be reused from geometry.py , which made development like 1000x easier and let me focus on building the interface. Built the first working version of the viewer using Dear PyGui . Added support for importing the JSON files generated by Project Kobon. Added a visualizer that draws line arrangements and the triangles they create. Added controls for switching between different saved results.
Project Update Adding Multi-Process Support This update allows Project Kobon to run multiple instances of the solver at the same time, to find more possible solutions and allows the use of more CPU power. Added multiprocessing so that multiple solver processes can run at the same time. Split the work to be done by the solver into separate workers that will run independently of each other. Each solver worker will search for solutions in different ways (due to using different random seeds). The results from each solver worker will be collected and the best solution found will be selected. A way to set the number of solver workers that will be used, depending on the available CPUs on the machine. All results will be reported using the reporter.py script.
Finally Finished the EXE After a lot of annoying PyInstaller issues, Project Kobon finally works as a standalone Windows executable!!! This definitely took way longer than the 57 minutes that actually got logged.
Ships:
Project Kobon is finally shipped!!! I made a Python project that searches for Kobon triangle line arrangements, saves the best results, and includes a viewer for loading and visualizing the generated JSON files. The hardest parts were getting the solver logic working, building the DearPyGui viewer, and then fighting with PyInstaller to make the .exe. I’m proud that it now has a full loop: run the solver, generate results, open them in the viewer, and share the app without needing Python installed....
|
1792972424.1836338
|
1793058824.1836338
|
|
5330
|
DND initiative Tracker by @Headless48 | Stardance
|
Headless48
|
1
|
3.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-07-03T20:45:10Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is a Dnd initiative tracker made foe dms when they run combat, is easy to use and helps keep all the chaos under contol, even when the wizard casts fireball in a 10 foot by 10 foot room", "repo": "https://github.com/Headless48-Ram/Initiative-Tracker", "demo": "https://github.com/Headless48-Ram/Initiative-Tracker/releases/tag/dnd"}]...
|
[{"post_id": 1071, "ts": "2026 [{"post_id": 1071, "ts": "2026-06-02T21:42:46Z", "hours": 2.005, "text": "DONE"}, {"post_id": 982, "ts": "2026-06-02T19:19:16Z", "hours": 0.8553, "text": "Monster object going crazy"}]...
|
Title: DND initiative Tracker by @Headless48 | Sta Title: DND initiative Tracker by @Headless48 | Stardance
Devlogs:
Monster object going crazy
DONE
Ships:
This is a Dnd initiative tracker made foe dms when they run combat, is easy to use and helps keep all the chaos under contol, even when the wizard casts fireball in a 10 foot by 10 foot room...
|
1792968596.0392613
|
1793054996.0392613
|
|
5347
|
Equiplane by @qqxzew | Stardance
|
qqxzew
|
1
|
14.0
|
217
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-06-15T20:28:36Z", "hours": 14.0, "multiplier": 15.16, "payout": 217, "blessing": "neutral", "text": "I made EquipLane, an industrial maintenance ticketing system where clients can report equipment problems, engineers can manage assigned repair tasks, and admins can control the whole maintenance workflow. The hardest part was coming up with the idea and building the project from scratch without much previous experience. I had to figure out the structure, database, roles, authentication, and the whole workflow step by step. I’m most proud that I was able to finish a working project and also make the GitHub repository look organized and well documented. This is my first major portfolio project, so I’m proud that it turned into something complete. To test it, just open the project link and log in using the demo credentials from the README.", "repo": "https://github.com/qqxzew/equiplane", "demo": "https://klidnapraha.fun/login.php"}]...
|
[{"post_id": 9458, "ts": "2026 [{"post_id": 9458, "ts": "2026-06-15T20:22:33Z", "hours": 0.5267, "text": "have add deployment😀"}, {"post_id": 9388, "ts": "2026-06-15T18:47:23Z", "hours": 1.4058, "text": "What I did: Wrapped up the EquipLane project and prepared it for my portfolio. I containerized the entire application using Docker and Docker Compose, linking a PHP 8.2 server with a MariaDB database so the whole environment can be spun up with a single command. I also set up a CI pipeline using GitHub Actions to automatically lint and check PHP syntax on every push. Finally, I generated a complete Entity-Relationship Diagram (ERD) to visualize the database architecture and wrote a comprehensive README explaining the core mechanics, security features, and the PRG pattern I implemented. The struggles: I definitely reached the limit of what makes sense to build with pure procedural PHP. Refactoring and maintaining this architecture showed me exactly why OOP and modern frameworks exist. It was a great learning experience for understanding the fundamentals, but I am definitely ready to move on to Nette for my next hackathon projects."}, {"post_id": 8946, "ts": "2026-06-14T21:29:13Z", "hours": 3.6275, "text": "What I did: Massive architectural and security overhaul today. I completely rewrote the form submission logic to follow the Post-Redirect-Get (PRG) pattern, integrating session-based Flash messages and strict CSRF token validation across all endpoints. I also implemented “Sticky Forms” so users never lose their detailed text inputs if a validation error occurs. For the administration side, I built full CRUD interfaces to manage personnel roles, corporate clients, and the equipment registry without needing direct database access. Finally, I wrote SQL-level pagination for the main tickets table to keep the application fast and scalable as data grows. The struggles: I finally switched from VS Code to PhpStorm today and I am just in shock at how insanely cool and powerful it is. It instantly highlighted database schema mismatches I missed and forced me to write much cleaner code, though getting used to its strict warnings definitely took some time."}, {"post_id": 6933, "ts": "2026-06-11T16:52:18Z", "hours": 2.3361, "text": "What I did: Expanded the engineer’s resource reporting logic. When resolving a ticket, engineers are now required to input the exact hours spent and the cost of replacement parts. Built a financial calculation module on the backend that automatically aggregates these costs, applies the Czech 21% VAT (DPH), and displays a detailed invoice summary to admins and clients. Also implemented a critical backup request feature: engineers can now submit a “Request Backup” flag along with a specific text reason if they encounter blocking issues on-site. Admins immediately see an approval panel to either accept the request (and assign additional help) or reject it. The struggles: I had no idea for frontend"}, {"post_id": 5086, "ts": "2026-06-08T19:30:11Z", "hours": 1.7997, "text": "Built the ticket creation page with role protection. Clients can now select their equipment, set priorities, and safely submit maintenance requests to the database via PDO prepared statements. The struggles: Broken the SQL query and html :>"}, {"post_id": 4452, "ts": "2026-06-07T19:34:13Z", "hours": 2.2319, "text": "Milestone: From Static UI to Secure Multi-User App What I did: Since the last update on the UI dashboard, I have completely transformed the project from a static frontend into a secure, functional multi-user system using native PHP and MariaDB. Authentication & Session Management: Built a backend login system from scratch. Implemented secure password hashing using bcrypt. Set up native PHP sessions to track users across pages. Security Guards & Logout: Created a centralized guard script to prevent unauthorized URI access. If a user isn’t logged in, they are killed and redirected to the login page. Added a full session-destroying logout mechanism. Role-Based Access Control (RBAC): Differentiated the system for Admins, Engineers, and Clients. The UI now dynamically hides navigation links based on roles, and the backend explicitly throws a 403 Forbidden error if a non-admin tries to access the core control panel. Profile & Password Updates: Built a personal profile page that fetches current user details and handles password modification with server-side validation. The struggles: Ran into multiple syntax walls, including incorrect sql, forgotten POST block brackets, and a lot of typo mismatches. Also had to deal with MariaDB unique constraint violations during database seed testing, which I resolved by writing a structured TRUNCATE routine to clear tables before fresh seeding. Now the app actually feels like a secure industrial tool rather than just a Tailwind template."}, {"post_id": 1647, "ts": "2026-06-03T19:33:34Z", "hours": 0.3758, "text": "After getting the database connected, I built the main dashboard U, also I dont have any idea for design after hard day so I asked AI about help…"}, {"post_id": 1619, "ts": "2026-06-03T19:08:20Z", "hours": 1.1228, "text": "Honestly, it is my first time building a real website in PHP, and I realized I had completely forgotten most of my HTML and CSS. Today I successfully parsed the environment variables, securely connected the MariaDB database via PDO, and built a clean industrial dashboard layout using Tailwind CSS. EquipLane is finally coming to life."}, {"post_id": 1002, "ts": "2026-06-02T19:45:55Z", "hours": 0.9236, "text": "Today I set up the initial structure for Equiplane, an industrial equipment maintenance workflow system I prepared the first part of the database schema for the project, including the base tables for users and companies. The goal is to build a system where clients can report equipment failures, admins can assign engineers, and engineers can manage repair tickets."}]...
|
Title: Equiplane by @qqxzew | Stardance
Devlogs:
Title: Equiplane by @qqxzew | Stardance
Devlogs:
Today I set up the initial structure for Equiplane, an industrial equipment maintenance workflow system I prepared the first part of the database schema for the project, including the base tables for users and companies. The goal is to build a system where clients can report equipment failures, admins can assign engineers, and engineers can manage repair tickets.
Honestly, it is my first time building a real website in PHP, and I realized I had completely forgotten most of my HTML and CSS. Today I successfully parsed the environment variables, securely connected the MariaDB database via PDO, and built a clean industrial dashboard layout using Tailwind CSS. EquipLane is finally coming to life.
After getting the database connected, I built the main dashboard U, also I dont have any idea for design after hard day so I asked AI about help…
Milestone: From Static UI to Secure Multi-User App What I did: Since the last update on the UI dashboard, I have completely transformed the project from a static frontend into a secure, functional multi-user system using native PHP and MariaDB. Authentication & Session Management: Built a backend login system from scratch. Implemented secure password hashing using bcrypt. Set up native PHP sessions to track users across pages. Security Guards & Logout: Created a centralized guard script to prevent unauthorized URI access. If a user isn’t logged in, they are killed and redirected to the login page. Added a full session-destroying logout mechanism. Role-Based Access Control (RBAC): Differentiated the system for Admins, Engineers, and Clients. The UI now dynamically hides navigation links based on roles, and the backend explicitly throws a 403 Forbidden error if a non-admin tries to access the core control panel. Profile & Password Updates: Built a personal profile page that fetches current user details and handles password modification with server-side validation. The struggles: Ran into multiple syntax walls, including incorrect sql, forgotten POST block brackets, and a lot of typo mismatches. Also had to deal with MariaDB unique constraint violations during database seed testing, which I resolved by writing a structured TRUNCATE routine to clear tables before fresh seeding. Now the app actually feels like a secure industrial tool rather than just a Tailwind template.
Built the ticket creation page with role protection. Clients can now select their equipment, set priorities, and safely submit maintenance requests to the database via PDO prepared statements. The struggles: Broken the SQL query and html :>
What I did: Expanded the engineer’s resource reporting logic. When resolving a ticket, engineers are now required to input the exact hours spent and the cost of replacement parts. Built a financial calculation module on the backend that automatically aggregates these costs, applies the Czech 21% VAT (DPH), and displays a detailed invoice summary to admins and clients. Also implemented a critical backup request feature: engineers can now submit a “Request Backup” flag along with a specific text reason if they encounter blocking issues on-site. Admins immediately see an approval panel to either accept the request (and assign additional help) or reject it. The struggles: I had no idea for frontend
What I did: Massive architectural and security overhaul today. I completely rewrote the form submission logic to follow the Post-Redirect-Get (PRG) pattern, integrating session-based Flash messages and strict CSRF token validation across all endpoints. I also implemented “Sticky Forms” so users never lose their detailed text inputs if a validation error occurs. For the administration side, I built full CRUD interfaces to manage personnel roles, corporate clients, and the equipment registry without needing direct database access. Finally, I wrote SQL-level pagination for the main tickets table to keep the application fast and scalable as data grows. The struggles: I finally switched from VS Code to PhpStorm today and I am just in shock at how insanely cool and powerful it is. It instantly highlighted database schema mismatches I missed and forced me to write much cleaner code, though getting used to its strict warnings definitely took some time.
What I did: Wrapped up the EquipLane project and prepared it for my portfolio. I containerized the entire application using Docker and Docker Compose, linking a PHP 8.2 server with a MariaDB database so the whole environment can be spun up with a single command. I also set up a CI pipeline using GitHub Actions to automatically lint and check PHP syntax on every push. Finally, I generated a complete Entity-Relationship Diagram (ERD) to visualize the database architecture and wrote a comprehensive README explaining the core mechanics, security features, and the PRG pattern I implemented. The struggles: I definitely reached the limit of what makes sense to build with pure procedural PHP. Refactoring and maintaining this architecture showed me exactly why OOP and modern frameworks exist. It was a great learning experience for understanding the fundamentals, but I am definitely ready to move on to Nette for my next hackathon projects.
have add deployment😀
Ships:
I made EquipLane, an industrial maintenance ticketing system where clients can report equipment problems, engineers can manage assigned repair tasks, and admins can control the whole maintenance workflow. The hardest part was coming up with the idea and building the project from scratch without much previous experience. I had to figure out the structure, database, roles, authentication, and the whole workflow step by step. I’m most proud that I was able to finish a working project and also make the GitHub repository look organized and well documented. This is my first major portfolio project, so I’m proud that it turned into something complete. To test it, just open the project link and log in using the demo credentials from the README....
|
1792986551.0074582
|
1793072951.0074582
|