|
31171
|
My Personal Site by @Mokshgna | Stardance
|
Mokshgna
|
2
|
6.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-17T04:02:19Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "A small website about me it is small in size but for me as a beginner its as huge the sun!!!", "repo": "https://github.com/mokshgna13-glitch/my_personal_site", "demo": "https://mokshgna13-glitch.github.io/my_personal_site/"}, {"ship_num": 2, "ts": "2026-07-31T06:37:39Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I built my personal website using HTML and CSS. It includes different sections about me, my interests, projects, and goals. I wanted the website to feel modern and personal instead of looking like a basic template. The challenging part was organizing the layout and making the different sections look clean and consistent. I also worked on improving the styling, spacing, colors, and overall design. I’m proud that I built and customized the website myself and turned my ideas into a real website that people can visit online. This project also helped me understand how HTML structures a webpage and how CSS controls its design. To test the project, open the deployed website using the Try project button. You can scroll through the sections and explore the website. I used AI for help with small coding questions, debugging, and improving some parts of the design, but I built and customized the website myself.", "repo": "https://github.com/mokshgna13-glitch/my_personal_site", "demo": "https://mokshgna13-glitch.github.io/my_personal_site/"}]...
|
[{"post_id": 53005, "ts": "202 [{"post_id": 53005, "ts": "2026-08-23T12:03:52Z", "hours": 2.985, "text": "This is my simple dimple WEBSITE!!"}, {"post_id": 38028, "ts": "2026-07-31T05:44:19Z", "hours": 3.305, "text": "My own personal portfolio"}]...
|
Title: My Personal Site by @Mokshgna | Stardance
Title: My Personal Site by @Mokshgna | Stardance
Devlogs:
My own personal portfolio
This is my simple dimple WEBSITE!!
Ships:
I built my personal website using HTML and CSS. It includes different sections about me, my interests, projects, and goals. I wanted the website to feel modern and personal instead of looking like a basic template. The challenging part was organizing the layout and making the different sections look clean and consistent. I also worked on improving the styling, spacing, colors, and overall design. I’m proud that I built and customized the website myself and turned my ideas into a real website that people can visit online. This project also helped me understand how HTML structures a webpage and how CSS controls its design. To test the project, open the deployed website using the Try project button. You can scroll through the sections and explore the website. I used AI for help with small coding questions, debugging, and improving some parts of the design, but I built and customized the website myself.
A small website about me it is small in size but for me as a beginner its as huge the sun!!!...
|
1792842781.491137
|
1792929181.491137
|
|
68239
|
Java Path Tracer by @Robodog81 | Stardance
|
Robodog81
|
1
|
22.22
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-17T03:56:37Z", "hours": 18.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is an early beta of a path tracer that I am working on. I belive there are still a few problems (fuzzy metals not quite right) but overall it still looks ok.", "repo": "https://github.com/Robodog81/Path-Tracer", "demo": "https://github.com/Robodog81/Path-Tracer/releases/tag/Beta"}]...
|
[{"post_id": 81078, "ts": "202 [{"post_id": 81078, "ts": "2026-10-19T19:53:24Z", "hours": 1.4683, "text": "Tonemap Update and Code Reformatting I haven’t done much in the way of large changes since last devlog but I have been reformatting much of my code to make it easier to read and use. The code should now look a lot cleaner. I also fixed the tonemapper as it was over over exposing the brighter spheres. I also added a new tone map option that seems to be significantly better at representing bright colours than my prior two. The first one is purely clamping the HDR value to sRGB. As you may guess this leads to bright lights of most colours appearing white. I did have an alternative Reinhard tonemapper (v / (v + 1)) but that made everything look gray and desaturated as it applied the map to every colour channel individually causing all colours to look similar. The fix was to run the tone map with the brightest colour of the channel. This new screenshot is done with the new tonemapper and is a great example of the new glass refraction. It is a bit dark sorry. This took >30min to render."}, {"post_id": 80880, "ts": "2026-10-19T04:40:56Z", "hours": 2.75, "text": "Java Path-Tracer A simple Java Path-tracer for rendering cool scenes written in a single java class. The main thing I have spent my time on is adding in a glass material. It has proved to be more of a pain than I originally thought. The book series Ray Tracing in One Weekend has once again proved very useful. Anyway, whyle developing it I would repetitively get a material that looks somewhat like glass (or some weird blob) or something that was overly noisy. at one point my glass started emitting blue and yellow light (not much of a clue why that happened. After a good few hours of hassle I finally got it refracting properly. The rest of the features (total internal reflection & reflection) were fairly straightforward after that. Even caustics (the focused light under a glass sphere) work really well. I also found that my metal bounce rays for fuzzie metals weren’t being normalised properly causing weird ring artefacts. That was an easy fix luckily. I think this project is coming along well. Here is a new Hi-Res test scene that I let my laptop suffer on for quite a while. for reference this is an 8th gen i5 laptop and this scene took around 15 minutes to render. I did have a fair bit of other stuff open though. Enjoy. :)"}, {"post_id": 80270, "ts": "2026-10-17T01:58:49Z", "hours": 8.0306, "text": "Over the past few days i have made a few improvements. I have focused a bit more on the performance side of things and implemented (fairly bad) CPU multi threading as it was running single threaded before. This resulted in a 2-3x performance increase even though I went from 1 to 8 threads. I believe this is due to my bad code and the fact I create 8 new Thread objects every frame. Other than performance optimisations I also expanded the functionality of the renderer. I added Lambertian scattering for more accurate matte surfaces. I gave metal a fuzziness propitiate that allows for more surface options. I also started to implement glass (which is an absolute pain) but it is still broken at the moment (see screenshots) :) I also did some general housekeeping and cleaned up the code making it easier to read. The code is now visible on github for anyone who is interested."}, {"post_id": 78982, "ts": "2026-10-12T07:57:37Z", "hours": 10.1758, "text": "This is my shot at making a (somewhat optimised) Path Tracer in Java. I have previously made one in scratch and am trying to make a better foundation to work off of so I can add more advanced features. I had already started making the ray traversal code but forgot to log it; my current time is a little on the low side. I primarily work of the online books ‘Ray Tracing In One Weekend’ as they contain most of the info I need. At the moment only spheres are supported and only can be matte or a light. Even now I have been able to make some cool renders of random spheres. I will soon add more surfaces (mirror, glass, etc), anti aliasing, and multi thread support for better performance. If I can I will add support for polygons and thus 3d models. I hope this is as cool to you as it is to me. Thanks for reading. :)"}]...
|
Title: Java Path Tracer by @Robodog81 | Stardance
Title: Java Path Tracer by @Robodog81 | Stardance
Devlogs:
This is my shot at making a (somewhat optimised) Path Tracer in Java. I have previously made one in scratch and am trying to make a better foundation to work off of so I can add more advanced features. I had already started making the ray traversal code but forgot to log it; my current time is a little on the low side. I primarily work of the online books ‘Ray Tracing In One Weekend’ as they contain most of the info I need. At the moment only spheres are supported and only can be matte or a light. Even now I have been able to make some cool renders of random spheres. I will soon add more surfaces (mirror, glass, etc), anti aliasing, and multi thread support for better performance. If I can I will add support for polygons and thus 3d models. I hope this is as cool to you as it is to me. Thanks for reading. :)
Over the past few days i have made a few improvements. I have focused a bit more on the performance side of things and implemented (fairly bad) CPU multi threading as it was running single threaded before. This resulted in a 2-3x performance increase even though I went from 1 to 8 threads. I believe this is due to my bad code and the fact I create 8 new Thread objects every frame. Other than performance optimisations I also expanded the functionality of the renderer. I added Lambertian scattering for more accurate matte surfaces. I gave metal a fuzziness propitiate that allows for more surface options. I also started to implement glass (which is an absolute pain) but it is still broken at the moment (see screenshots) :) I also did some general housekeeping and cleaned up the code making it easier to read. The code is now visible on github for anyone who is interested.
Java Path-Tracer A simple Java Path-tracer for rendering cool scenes written in a single java class. The main thing I have spent my time on is adding in a glass material. It has proved to be more of a pain than I originally thought. The book series Ray Tracing in One Weekend has once again proved very useful. Anyway, whyle developing it I would repetitively get a material that looks somewhat like glass (or some weird blob) or something that was overly noisy. at one point my glass started emitting blue and yellow light (not much of a clue why that happened. After a good few hours of hassle I finally got it refracting properly. The rest of the features (total internal reflection & reflection) were fairly straightforward after that. Even caustics (the focused light under a glass sphere) work really well. I also found that my metal bounce rays for fuzzie metals weren’t being normalised properly causing weird ring artefacts. That was an easy fix luckily. I think this project is coming along well. Here is a new Hi-Res test scene that I let my laptop suffer on for quite a while. for reference this is an 8th gen i5 laptop and this scene took around 15 minutes to render. I did have a fair bit of other stuff open though. Enjoy. :)
Tonemap Update and Code Reformatting I haven’t done much in the way of large changes since last devlog but I have been reformatting much of my code to make it easier to read and use. The code should now look a lot cleaner. I also fixed the tonemapper as it was over over exposing the brighter spheres. I also added a new tone map option that seems to be significantly better at representing bright colours than my prior two. The first one is purely clamping the HDR value to sRGB. As you may guess this leads to bright lights of most colours appearing white. I did have an alternative Reinhard tonemapper (v / (v + 1)) but that made everything look gray and desaturated as it applied the map to every colour channel individually causing all colours to look similar. The fix was to run the tone map with the brightest colour of the channel. This new screenshot is done with the new tonemapper and is a great example of the new glass refraction. It is a bit dark sorry. This took >30min to render.
Ships:
This is an early beta of a path tracer that I am working on. I belive there are still a few problems (fuzzy metals not quite right) but overall it still looks ok....
|
1792857192.8033333
|
1792943592.8033333
|
|
47888
|
Phone Usage by @explodeywolf | Stardance
|
explodeywolf
|
2
|
96.0
|
200
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-17T02:55:14Z", "hours": 45.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I have updated my app! I saw a lot of people wanted analytics - so I have added analytics! If you hover over the pie chart you can see the labels and exact durations. I made everything a lot more memory efficient by rewriting the service that writes the usage data to the disk in kotlin. I added a final display type! It’s a clock(see the hands? That’s how you can tell) I modeled the clock off of the clock in the google clock app. But, I made it in inkscape, then used Flutter’s custom painters to write down everything else! You can even zoom in! If you have an android phone, please try it out! Thank you!", "repo": "https://gitlab.com/peanutplays61/phone-usage", "demo": "https://gitlab.com/peanutplays61/phone-usage/-/releases"}, {"ship_num": 2, "ts": "2026-08-28T21:38:58Z", "hours": 51.0, "multiplier": 6.68, "payout": 200, "blessing": "neutral", "text": "Phone Usage is an android app that displays when you turned on and off your phone, every day. This can be really useful, not just if you want to track your phone usage, and when it happens. You can also use this information to pinpoint what time, for example, you turned off your phone and went to bed. Unfortunately this app is only available as an apk for now, but I am waiting on f-droid to post it on their store! I also made the app pretty customizable, so you can change the color and layout of the app.", "repo": "https://gitlab.com/peanutplays61/phone-usage", "demo": "https://gitlab.com/peanutplays61/phone-usage/-/releases"}]...
|
[{"post_id": 80280, "ts": "202 [{"post_id": 80280, "ts": "2026-10-17T02:51:56Z", "hours": 6.9019, "text": "I’m finally done! I can finally free myself from this app! I made the clock support a fullscreen mode, where viewing landscape is MUCH better. Look at that zoom! Also, I felt like using the red colorscheme for this picture."}, {"post_id": 78782, "ts": "2026-10-11T16:18:04Z", "hours": 9.9444, "text": "Oh boy! I’m trying to add a new display type: A clock! This was my original dream for this project, so I have to make it work! Luckily, flutter comes with a widget that handles zooming, but I had to implement the text, the drawing, the usage info display, the fake hands, and the occlusion culling by myself. I’m almost done! I just need to make it work in the selection page."}, {"post_id": 72829, "ts": "2026-09-23T20:33:45Z", "hours": 3.0381, "text": "I added some quips about your screen time! There’s also a little bit deeper analysis, but you can’t get too much information from just when you turn on and off your phone."}, {"post_id": 71341, "ts": "2026-09-20T17:41:29Z", "hours": 7.4064, "text": "I made a pie chart for usage time! Why did it take me 7 hours? Good question! Unfortunately I couldn’t find a pie chart library on flutter that offered tooltips, so unfortunately I had to make it myself. I use FlCharts for the pie charts, but I do all the stuff for touch highlighting and tooltips. Again. I’ve gotta learn to accept what I have. (the section I’m touching is the one in purple)"}, {"post_id": 69378, "ts": "2026-09-16T22:44:41Z", "hours": 3.9875, "text": "I spent a ton of time making animations for this, but unfortunately I can’t show an animation! But I also finished the dropdown for the analytics :) Now I just need the analytics!"}, {"post_id": 63917, "ts": "2026-09-07T23:17:47Z", "hours": 9.535, "text": "I’m trying to make some analytics! Unfortunately though, I want there to be editable date ranges and that needs a dialog, which means it closes the drop-down. So, I’m making my own. This is the most complex thing I’ve ever done. 5 hours later, this is what I have!"}, {"post_id": 61638, "ts": "2026-09-04T17:05:59Z", "hours": 4.13, "text": "I fixed a bug where the display type wouldn’t save properly! Technically it was an off-by-one error :( I decoded the saved state based off of the index in the array instead of the id, which is what I saved. This is what it was supposed to look like!"}, {"post_id": 56886, "ts": "2026-08-28T21:31:44Z", "hours": 10.1475, "text": "Didn’t go too far over this time! I think I’m done making this app. If anything, I’ll make it a little more performant later, but it’s ready to ship :) I used appmockup to make some pictures for it."}, {"post_id": 52639, "ts": "2026-08-22T21:31:19Z", "hours": 15.3125, "text": "Accidentally went over the 10h limit again! oops! Phone Usage now has settings! You can change the display type of data, as well as the color of the application! Material colors are also supported!!!"}, {"post_id": 47091, "ts": "2026-08-14T18:44:02Z", "hours": 25.1039, "text": "I got my first MVP(minimum viable product)! I’m also trying to get my app uploaded to fdroid, an android open source app store."}]...
|
Title: Phone Usage by @explodeywolf | Stardance
D Title: Phone Usage by @explodeywolf | Stardance
Devlogs:
I got my first MVP(minimum viable product)! I’m also trying to get my app uploaded to fdroid, an android open source app store.
Accidentally went over the 10h limit again! oops! Phone Usage now has settings! You can change the display type of data, as well as the color of the application! Material colors are also supported!!!
Didn’t go too far over this time! I think I’m done making this app. If anything, I’ll make it a little more performant later, but it’s ready to ship :) I used appmockup to make some pictures for it.
I fixed a bug where the display type wouldn’t save properly! Technically it was an off-by-one error :( I decoded the saved state based off of the index in the array instead of the id, which is what I saved. This is what it was supposed to look like!
I’m trying to make some analytics! Unfortunately though, I want there to be editable date ranges and that needs a dialog, which means it closes the drop-down. So, I’m making my own. This is the most complex thing I’ve ever done. 5 hours later, this is what I have!
I spent a ton of time making animations for this, but unfortunately I can’t show an animation! But I also finished the dropdown for the analytics :) Now I just need the analytics!
I made a pie chart for usage time! Why did it take me 7 hours? Good question! Unfortunately I couldn’t find a pie chart library on flutter that offered tooltips, so unfortunately I had to make it myself. I use FlCharts for the pie charts, but I do all the stuff for touch highlighting and tooltips. Again. I’ve gotta learn to accept what I have. (the section I’m touching is the one in purple)
I added some quips about your screen time! There’s also a little bit deeper analysis, but you can’t get too much information from just when you turn on and off your phone.
Oh boy! I’m trying to add a new display type: A clock! This was my original dream for this project, so I have to make it work! Luckily, flutter comes with a widget that handles zooming, but I had to implement the text, the drawing, the usage info display, the fake hands, and the occlusion culling by myself. I’m almost done! I just need to make it work in the selection page.
I’m finally done! I can finally free myself from this app! I made the clock support a fullscreen mode, where viewing landscape is MUCH better. Look at that zoom! Also, I felt like using the red colorscheme for this picture.
Ships:
Phone Usage is an android app that displays when you turned on and off your phone, every day. This can be really useful, not just if you want to track your phone usage, and when it happens. You can also use this information to pinpoint what time, for example, you turned off your phone and went to bed. Unfortunately this app is only available as an apk for now, but I am waiting on f-droid to post it on their store! I also made the app pretty customizable, so you can change the color and layout of the app.
I have updated my app! I saw a lot of people wanted analytics - so I have added analytics! If you hover over the pie chart you can see the labels and exact durations. I made everything a lot more memory efficient by rewriting the service that writes the usage data to the disk in kotlin. I added a final display type! It’s a clock(see the hands? That’s how you can tell) I modeled the clock off of the clock in the google clock app. But, I made it in inkscape, then used Flutter’s custom painters to write down everything else! You can even zoom in! If you have an android phone, please try it out! Thank you!...
|
1792824948.1978278
|
1792911348.1978278
|
|
70116
|
Javascript by @syedakhter | Stardance
|
syedakhter
|
1
|
2.0
|
1
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-17T01:23:32Z", "hours": 2.0, "multiplier": 1.01, "payout": 1, "blessing": "neutral", "text": "I made a website with some random JavaScript I am trying out JavaScript.", "repo": "https://github.com/8051987-eng/Javascript", "demo": "https://8051987-eng.github.io/Javascript/"}]...
|
[{"post_id": 80267, "ts": "202 [{"post_id": 80267, "ts": "2026-10-17T01:22:01Z", "hours": 2.12, "text": "I website with javascript"}]...
|
Title: Javascript by @syedakhter | Stardance
Devl Title: Javascript by @syedakhter | Stardance
Devlogs:
I website with javascript
Ships:
I made a website with some random JavaScript I am trying out JavaScript....
|
1792835691.467679
|
1792922091.467679
|
|
38164
|
Determinist by @Mate1166 | Stardance
|
Mate1166
|
3
|
83.0
|
503
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T23:53:05Z", "hours": 38.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Determinist Determinist is a deterministic password generator that lets you recover forgotten passwords easily, given that you remember a master password, and a few things about your lost password. Features CLI and Web interface, featuring a PWA that also works offline Three algorithm versions to choose from A preset system Generated passwords are identical on both the website and the CLI Fully local generation Presets The presets use the TOML format, which is very user-friendly and easy to edit. The presets have multiple categories inside them like ‘general’ (for the algorithm version and password length), ‘preset’ (the preset name, description and whether it is set as defaul), and version specific ones like ‘v3’, which has the settings for the v3 algorithm. If you’re unsure how to edit preset files, you can also just export your settings from the website, and use it across all versions of Determinist! To Reviewers Please, test both the CLI and the website (if possible), and provide feedback on User Experience if you encountered any issues, include that in the review. You can even suggest features, and I may implement them :) Thank you!", "repo": "https://github.com/szentpeterimate/Determinist", "demo": "https://szentpeterimate.github.io/determinist/"}, {"ship_num": 2, "ts": "2026-08-13T14:20:06Z", "hours": 29.0, "multiplier": 14.15, "payout": 412, "blessing": "neutral", "text": "Well, it’s official: Determinist now has a website! Features: Easy to use interface Straightforward settings 1:1 compatibility with the CLI Fully client-side The only thing that hasn’t made it into the website (yet) is the preset system, just like with the CLI, I’m adding that later as the web UI is already really easy to use. And now the less technical bit… It’s been an incredible journey, Determinist has been my dream project for a few years now, and it’s really amazing how I can share it with the world now that it’s done. Just to mention a few things I learned from this project: Testing Proper git usage Cryptography JavaScript These are things I wouldn’t really have learned without Determinist. Sure, I could have done so, but not this fast and effectively. I must thank those who supported the project, who liked the devlogs, and of course the reviewers who gave their opinion on the CLI. Because of your feedback, I made Determinist even easier to use now, and I will continue doing so. Version 3 of the algorithm is on its way, as well as the preset system for the web. Thank you everyone!", "repo": "https://github.com/szentpeterimate/Determinist", "demo": "https://szentpeterimate.github.io/determinist/"}, {"ship_num": 3, "ts": "2026-08-01T18:32:59Z", "hours": 16.0, "multiplier": 6.15, "payout": 91, "blessing": "neutral", "text": "Determinist is a password generator made for people who often forget or leave passwords behind, just like me. A few years ago I was on vacation when I wanted to log into a website. However, the password for it was left at home on my PC, which I didn’t bring with myself. Of course, I could’ve just reset the password, but that would’ve been worse since I’d still have mismatched passwords. Determinist solves that. It uses a deterministic algorithm to take your inputs, and generate you a password you can recover anytime, anywhere. The only thing you need to remember is your master passphrase, which site you want to log in, and a few additional settings. (presets coming soon!) I had a lot of fun with this project, and it taught me quite a bit about encryption, randomness, and most importantly how a real-world project functions. (I do have to mention my initial struggle with Typer though, I would not want to wish that on my worst enemy.) With that being said, I hope you’ll have your password problems solved, and that you’ll enjoy using Determinist! Have fun!", "repo": "https://github.com/szentpeterimate/Determinist", "demo": "https://szentpeterimate.github.io/determinist/"}]...
|
[{"post_id": 80257, "ts": "202 [{"post_id": 80257, "ts": "2026-10-16T23:42:22Z", "hours": 1.6311, "text": "Determinist // Devlog 16 // 2026.09.17. Version 1.0.0 is out, and this is my final devlog. Well, it finally arrived. Version 1.0.0. This is where active development stops. Of course, I will still fix issues and implement features suggested by you guys, but I probably won’t be adding any by myself. Stardance has been a great inspiration for me, not only to make this project, but to keep going and coming back to doing what I love: coding, and making things for others. I am very happy with how Determinist turned out, despite the difficulties and me being busy with school. But enough of this, what was changed since my last devlog? Changes Updated the documentation to show that a PWA is available to install Fixed various bugs and style inconsistencies Added a description of the generation process to the website Added a Copy to Clipboard toggle Added an Export as Preset button Removed Google Fonts connections What’s next? Nothing. I’d like to thank everyone who had a chance to try and use Determinist. Everyone who reviewed it and even you, the one reading this devlog :) Y’all have showed me that things I make can and are useful for others. See you in the next Hack Club program!"}, {"post_id": 79995, "ts": "2026-10-15T20:30:50Z", "hours": 5.9489, "text": "Determinist // Devlog 15 // 2026.09.15. A few design changes, and a brand new section on the website! Design I have fixed several design issues I noticed and did not like. Just to mention a few, there was unnecessary overflow on mobile devices, the spacing was off on several elements, and the width of the file input field was also too big. The Wall of Text™ It isn’t that big to be fair, it just explains how Determinist works, split into the 3 versions of the generation algorithm. I didn’t want to copy the page I had linked in the README, so I just wrote it down again and tried wording it better. Additionally, I tried to preserve the original one page, no scroll design by placing the About section below the actual app, so you have to scroll to see it. Other changes I refactored parts of the web code as the Generator element was getting really long, above 500 lines. I moved the algorithms out to a separate importable module, and I placed it along with the python-random module into a self-explanatory modules directory. I’ve also moved generror.jsx and presethandler.jsx into their own handlers/ directory, and the two specialized input fields into an inputs/ directory. Overall, this change makes the code way easier to read. The preset generator works now as well, just click the “Export as Preset” button below “Generate”, name the preset and the preset will be downloaded for you! You can also toggle on a “Copy to Clipboard” feature which allows you to automatically copy your generated password to your clipboard. Pretty neat! What’s next? Bug fixes Auto clear password popup"}, {"post_id": 77686, "ts": "2026-10-07T21:23:27Z", "hours": 2.1339, "text": "Determinist // Devlog 14 // 2026.09.06. Finally, I figured out how to make the site work offline… The process After working on the PWA for way longer than I expected, it finally works as intended! After I’ve figured out how to use next-pwa , I encountered an issue: the site was being cached and loaded correctly in the browser but not when installed as a PWA. I rewrote multiple parts of the code for it to work, yet it did not. In the end, it was the unsecured connections that were at fault. Discovering that, I have learned to use something new again: Localtunnel, which allows me to use a valid (not self-signed) HTTPS connection while testing. This uncovered even more issues with my code, the most obvious being the fact that fonts were not cached at all. This was because I was getting my fonts by connecting to fonts.google.com . This was a really easy thing to fix though, as Next.js already has a next/fonts/google library that had the fonts I used, and now everything works well. What’s next? Bug fixes Descriptions Preset Generator Auto Copy to Clipboard toggle"}, {"post_id": 73593, "ts": "2026-09-25T13:12:35Z", "hours": 4.1403, "text": "Determinist // Devlog 13 // 2026.09.25. Quite a few issues, but apparently it works… Progressive Web App Well, making Determinist a PWA certainly took way longer than expected. I thought it would be an hour at most, I mean Next.js literally has a guide that tells me what to do step-by-step. It was in fact NOT easy. I encountered a ton of problems. First off, I had to write a manifest which had the app name, icons etc., the obvious things. What was not obvious however was that I had multiple ways of doing that. I could write a JSON file, or write a JavaScript file that exports an object. I chose the latter as it was the version that the Next.js guide was using. Then came the icons. Oh, the icons. I made my icons and put it in the public/ directory with the correct names so that they match the manifest. Cool, works when I share it but there is no icon when I add it to my home screen on my iPhone. It said I’m missing a file called apple-touch-icon and apple-touch-icon-precomposed . Cool, I duplicated the icons and I renamed them. No 404s, but it still did not work. I look for a solution. For hours. I look at Next.js docs, YouTube, StackOverflow, Reddit, GitHub issues and there is nothing that would fix it. Finally, I found out I need to link the icon in the head of the website. Great, but still doesn’t work. Turns out, the problem was that I was following the Next.js guide which told me to use HTTPS to test the PWA, but iOS does not trust self-signed keys so it did not download the icon. After that, the generation broke when I was connecting to the site with the IP and not through localhost . I noticed that submitting (pressing the generate button) redirected me which should not have happened due to the line e.preventDefault() . Then I saw Next.js attempting to connect a websocket, and a bunch of 403 errors that weren’t there before. I spent quite a bit of time debugging that, and it was due to not adding my IP to allowedDevOrigins in the next.config.mjs file despite it working perfectly fine before. The Icon As you can see, the image I decided to include in my devlog is the icon for Determinist. I actually did not think of putting the D and the E together at first, but when I did, it reminded me of a lock (hope you can see it!) and I chose to keep it as it kind of fits. And I didn’t want a solid color background, so I decided I’ll just add the name repeating. It was fun making it, and it was also a very good way to practice using Illustrator. What’s next? Making the PWA work offline Bug fixes Descriptions Preset Generator Auto Copy to Clipboard toggle"}, {"post_id": 69184, "ts": "2026-09-16T15:26:59Z", "hours": 5.1517, "text": "Determinist // Devlog 12 // 2026.09.16. Well, it took me more than a week, but the v3 algorithm is on the website! CLI Update I have published version 0.5.2 of the Python CLI, which fixed a few issues I found (you can see them on the GitHub page!), and added actual functionality to the default presets. You can also report issues on the GitHub page, and it is highly appreciated. What changed? I added the v3 algorithm, after a bit of tinkering with the error handling. My problem was that the error handling wasn’t really dynamic. It couldn’t handle the invalid input errprs from v3, so I made a separate component. I also had to learn how to use HKDF on the client side, which was actually easier to do than I expected, although the actual usage of HKDF was a bit more complicated than it is in Python. What’s next? Bug fixes Descriptions Preset Generator PWA Implementation Auto Copy to Clipboard toggle"}, {"post_id": 63122, "ts": "2026-09-06T19:06:33Z", "hours": 8.5219, "text": "Determinist // Devlog 11 // 2026.09.06. After the first week of school, I have finished work on the CLI, and Determinist 0.5.1 is released! Changes Added presets create command Changed preset option to allow selection in one line Changed the presets list to show invalid files in the configuration directory Added password generation errors Fixed bugs: The password being allowed to have less characters than the sum of the minimum required characters is fixed The g prefix from the commit hash is now removed Various preset error handling issues have been fixed Presets are now not required to have all the versions inside them What’s taking so long? Is Determinist done? Firstly, I just started school, so I got very busy lately and that is why I haven’t been doing much work. As a compensation, v3 of the algorithm is now available on GitHub !! This is version 0.5.1, which is a pretty big jump if you look at the versions before. However, there is a reason for that: active development of Determinist is going to stop once version 1.0.0 comes out, with all the new features and fixes being ported to the website. This will come out in the next week or so. Determinist will still be updated here and there if I miss some features or people have suggestions and issues, but I will be mainly focusing on other projects. Latest development stuff The preset creation was actually pretty easy. I figured I’ll reuse the options from the generate command so I don’t have to write them manually again, and it worked amazing! I had to add to the PresetHandler to make it work, and that was really simple as well. I first thought of adding strings together, but then I realized I could just create dictionaries that my TOML library can convert to TOML and write them to the preset, so I didn’t have to do all the writing myself. The bug fixes weren’t interesting at all, honestly. I messed around with Determinist, found bugs and issues and I fixed them. My favorite one was debugging errors with the preset commands however. I found a bunch of things worth fixing, and in the end I made another helper function, as well as changing how check_file_type works. To do Port everything over to the website Add more text to the website explaining Determinist and how it works"}, {"post_id": 55761, "ts": "2026-08-27T19:06:48Z", "hours": 4.7333, "text": "Determinist // Devlog 10 // 2026.08.27 Updates here and there, and the v3 algorithm is finally complete! All of this and the content of the rest of the devlogs will only be released with the final 1.0.0 release of Determinist. Changes Added v3 algorithm for the Python CLI It features dynamic byte generation so that no matter what, you’ll never run out of characters! (Unless you’re VERY unlucky) You can now enter a third value called a “differentiator” that can be used to change the output further. This is especially useful if you have multiple accounts on the same site. This option can be left empty Your generated password is now guaranteed to have the correct amount of characters You can now set a minimum amount of characters of each type! Simply enter 0 to exclude the character type, and 1 or above to choose how many characters your password have minimum of that type. Made generate prompt only prompt users if the prompts are applicable. This means you will no longer be prompted for the settings of v1 when you use one of the other two algorithms. Fixed an issue where if the site_name option is omitted, the prompt will display Master pass instead of the correct prompt. The difficulties Well, of course the development of v3 came with some challenges. Firstly, I had to figure out how to actually generate enough bytes to pass rejection sampling (making sure no bytes are out of range when mapped onto the character set), as the previous implementation was that I multiplied the password length by 32. This worked, but wasn’t pretty and in very rare and unlucky cases, there weren’t enough bytes. I fixed this by using something called HKDF, which stands for HMAC-based Extract-and-Expand Key Derivation Function. I’d really prefer to use HKDF. Anyway, this function was really good for this task, as it can take the Argon2 output and create a long, pseudo-random key that can go through rejection sampling, and finally end up in the password. In case this generated key is not enough, HKDF will generate more of it, essentially giving us infinite bytes to then map to our characters. This was especially good because in the same loop I could implement… Minimum requirements This should have been easy, but it took me a day to think about how to do it. The challenge: take a dictionary ( {\"lowercase\": 2, \"uppercase\": 3, \"special\": 1, \"digits\": 0} ), and include at least as many characters of each type as their value in that dictionary says, and if it’s 0 then don’t include it at all. Fine, I said, but I didn’t actually know how to implement this. After a day of thinking, it finally clicked: I implement this in the rejection sampling loop, as that is where my characters get added. Introducing the _construct_pass function: it looks for the already added characters, determines the type of the current character, counts how many are missing, and if a character type is missing some characters or there aren’t any left, the character is added, and otherwise it is discarded. To do Add a preset generator command Fix a g prefix appearing in the version command output before the git commit hash Add the ability to choose a preset in one line instead of being prompted for it Fix the password being allowed to be shorter than the sum of minimum required characters (I found that one while writing this) Port everything over to the website Update the docs Add more text to the website explaining Determinist and how it works"}, {"post_id": 52485, "ts": "2026-08-22T16:59:34Z", "hours": 6.1439, "text": "Determinist // Devlog 9 // 2026.08.22 Long time no see y’all, sorry for the wait! I’m on vacation so I had less time to work on the project, but I did bring some amazing improvements. Announcement The website is officially up and works identically to the CLI, now with presets! Just load your TOML presets into the website, and they will be saved for you to reuse! Important note: they are saved locally, therefore you will not see them on different devices unless you import them there too. Changes Added the preset system to the website! You can now import and use presets, and you can easily remove them if needed. Adjusted the UI so that it fits most (if not all) screens. The smallest screen I tested was an iPhone SE. The Challenges There actually weren’t a lot of challenges for once. The biggest one was that I forgot to work on the project while on vacation, but that’s not horrible. And then came React, JavaScript and everything else… firstly, the preset loading was actually really easy, I did however fight with React about passing values from a child component to the parent. And then it turned out I forgot to make it actually pleasant to use, as I had to select the preset file every time I wanted to load it. Now you can save, select and load your presets on the website. However, React had other plans. I finally learned how React’s useEffect hook works, and using it is pretty easy now that I get what I’m doing. Along with this, I also properly learned about using functions inside useState for lazy initialization which I needed for localStorage . Oh, localStorage was a pleasure to learn and use… Well, the operations with it are actually fairly easy, it’s like an object, and my first thought of initializing a state with it was to use useState({ ...localStorage }) , which did work, but it introduced something else: a build error after I merged the changes into main . Turns out, localStorage is undefined when GitHub Actions wants to build my website, therefore it gave me an error saying so. What I had to do is check if the window object is equal to 'undefined' , and if not, then spread localStorage and initialize the state. Finally, the website managed to build properly, but when I tried to use it on my phone, the output of the generator was outside my screen… so I had to go back and change how the UI looks after I’ve already merged everything into main . Amazing. Well, the good new is that it works, and next up is the v3 algorithm, as well as QoL changes, bug fixes, and more in both the CLI and web versions."}, {"post_id": 46026, "ts": "2026-08-12T22:45:54Z", "hours": 6.4178, "text": "Determinist // Devlog 8 // 2026.08.13 The UI is mostly complete, and I will be releasing the website tomorrow! Changes Significantly improved the entire user interface Version and special character mode (V1) now use <select> instead of the regular <input> , so you don’t have to type them out The difficulties There really wasn’t anything too hard about making the UI. You might ask, “why did you spend over 6 hours on it then?”. I have an answer for you. I tried using Figma for designing the UI but it was just too boring for me, so I decided to start coding it and figure it out as I go. I’m pretty satisfied with the result, but with everything, it can always be improved. The second problem was that while I was coding, I was also listening to music and I spent a bunch of time skipping songs because I didn’t feel like listening to them. This took my attention along with singing a bit too much, so my progress was slowed… The last thing to slow me down was my general inexperience with React and JS, although I got over that quick because the frontend is way easier to work on. Planned Adding the preset system Building the site & uploading to GitHub Pages"}, {"post_id": 45454, "ts": "2026-08-11T22:28:05Z", "hours": 4.7858, "text": "Determinist // Devlog 7 // 2026.08.12 Well, it’s official. I had to use AI for the first time :( Why? JavaScript does not have the same random implementation as Python does. Python uses MT19937 while JS uses Xorshift128+. This means we can’t use JavaScript’s random number generator, not to mention that we can’t even use it to shuffle arrays, as it lacks the method. And since I am relatively new to JS, I had two options: get a 15 year old module work that does exactly what I need it to, or make it with AI. I tried getting that package to work. I really did. Unfortunately, the algorithm it uses seems to be outdated, as the results differed in tests. That is why I used AI. I really didn’t want to, but I had to. Well, let’s look at the positives, at least! Changes The V2 algorithm is implemented and works 1:1 with the Python version! I managed to make another input component that uses checkboxes so you can select what kind of characters you’d like. It was challenging but it works! Next Up Tomorrow I’ll work on the UI design Adding the preset system Building the site Uploading to GitHub Pages"}, {"post_id": 44862, "ts": "2026-08-10T21:58:48Z", "hours": 2.4364, "text": "Determinist // Devlog 6 // 2026.08.10 Pretty big milestone: V1 is finally working on the website! Additions Added the V1 generation algorithm Added the customization options to the interface The Generator V1 is complete and works perfectly! I had to figure out a way to enter objects, and it was quite difficult. See, JavaScript doesn’t really have a dictionary type like Python does, so I had to use an object, which is similar enough and I can look for keys with in , just like in Python. The tricky part was creating such an object from the user’s input. I chose the most user friendly way I could think of, and made separate inputs for the key and value, and you can dynamically add more with an “Add Character Pair” button. I really wish there was an easier way and maybe there is a template out there, but I didn’t consider it until writing this very sentence. Anyways, tomorrow I’ll spend more time refining V1, the inputs and I’ll start working on V2. To Do Refining the generator and inputs Creating V2 Desgining the UI Adding the preset system Generating the static site"}, {"post_id": 44238, "ts": "2026-08-09T21:17:27Z", "hours": 2.4381, "text": "Determinist // Devlog 5 // 2026.08.09 I’ve started working on the website finally! The plan I’ll use GitHub Pages to host Determinist until I can get my own domain and personal site up, after which I’ll transfer it there. The plan is to make the generator client sided by using WebAssembly to access Argon2 in the browser without requiring a backend. I wanna do this so that no information leaves the user’s computer, which is a key part of keeping Determinist privacy focused. I chose to use Next.js because I used it before, and it has Static Site Generation which is essential if I want to put the site on GitHub Pages. What I achieved in 2 and a half hours I made Argon2 work Yes, that’s about it. I spent most of my time debugging errors and learning basics as I’ve only used JavaScript for making components, not to make more complex algorithms like Determinist’s is. I am a fast learner though, so I expect to be able to recreate Determinist V1 relatively quickly. Starting with WASM on my first serious web project where I’m still learning JS maybe wasn’t the most amazing idea, but hey, I like challenges and learning by doing. What’s next? Continuing work on V1 Porting V2 to JavaScript Desgining the UI Adding the preset system Generating the static site and fixing errors after it’s done And to the reviewers and people who liked the Determinist CLI… Thank you! Developing Determinist has been lots of fun and I’ve learned a lot of valuable things. Your support and feedback is greatly appreciated, it motivates me to work every single day. It’s a project I’m really passionate about, as I wanted to create this for years. Thank you all for your support, and I hope you’ll enjoy using Determinist whether it’s in your terminal or the web. See you in the next devlog!"}, {"post_id": 42594, "ts": "2026-08-07T12:38:38Z", "hours": 3.0314, "text": "Determinist // Devlog 4 // 2026.08.07 Developer experience and cleanups What changed My code now has comments! Although it is quite straightforward to understand, I did include a few here and there. A brand new version command shows what version Determinist is on, what commit it was built from, and the Python version it uses. I added more custom error handling to commands Something funny happened… I was testing the generation of the default preset, and I forgot to press tab when deleting the Determinist config directory. I only realized that when Hyprland started screaming at me about missing configurations. I thought “that’s weird”, so I checked the command I ran. rm -rf ~/.config/ . I deleted my entire configuration directory… Luckily, I had backups, but at least I’ve learned that I should double check my commands. Another Typer issue To absolutely no one’s surprise, Typer didn’t work as intended, once again. It kept reporting the wrong error when running presets subcommands. Turns out it was the callback I wrote to list the presets. It actually ran the check every time a presets command was run, giving the wrong error when a non TOML file was detected in the presets directory. It was a quick fix, but now I’m quite comfortable with Typer."}, {"post_id": 41993, "ts": "2026-08-06T15:11:38Z", "hours": 10.2806, "text": "Determinist // Devlog 3 // 2026.08.06. Determinist v0.2.2 is here and available to install, but I certainly did not thing this would take another 10 hours… What changed I have made a preset system that can load settings so you don’t have to type them out manually. You can only use this with the regular generate command. The presets command lists out all installed presets Running presets save with a path added at the end will save the selected preset to your config folder Adding delete after presets with the name of a preset will delete that permanently Using presets default and adding the preset name will set that preset as default Running --help is actually helpful now! Another change is I made prompt a subcommand of generate . I ran into an issue while implementing this… The issue You see, Typer cannot tell the difference between a positional argument and a subcommand, meaning that it took prompt as the master_pass argument for generate . This is obviously not at all what I intended, so I needed a way to figure out how to solve this. I didn’t want to make prompt an option, since that would’ve complicated things a lot more than they needed to be. Therefore, I changed master_pass and site_name to required options, which means they need to be typed out manually. Fear not however, because if you forget to do that, Determinist now prompts you for it! Another problem was with types, again. Typer apparently doesn’t like Union types, which I would’ve used for the preset option. What I wanted to do is make the user be able to type out the name of the preset, select one if none is entered in the command, or do everything manually. Problem: that’s 3 types: None , str and UNSET , which is basically a different spelling of None , it jut signals that the presets option was passed without an argument, as a flag. But Typer decided to ruin my day and only let me use two types, so I removed it all and made --preset a boolean, therefore a flag. That’s about it for now, if you like the idea of having an easy way of remembering your passwords, check out Determinist!"}, {"post_id": 39036, "ts": "2026-08-01T18:20:18Z", "hours": 11.0289, "text": "Determinist // Devlog 2 // 2026.08.01 Welcome back to the second devlog of Determinist! It’s been a while, so let’s recap what happened… Release!! The first official release of Determinist is here! You can check out the GitHub page to learn more. Algorithm V2 Quite a few changes here. I changed the algorithm so that it uses the bytes that Argon2 returns The bytes are now mapped to characters in a shuffled charset Insert/Replace modes have been removed because special characters are already in the charset You can now construct your own charset Typer I made my CLI with Typer, which was a challenge to say the least. This is my first time using it, and looking back, it wasn’t THAT bad. All I had to do is refactor generator.py completely, and make my types compatible (which I worked REALLY HARD on for V1). Typer doesn’t allow me to use things like lists and dictionaries, both of which are essential, but I managed to change everything in a way that’s mostly straightforward. I can split strings into a list and use JSON for dictionaries. Refactoring Challenges This is pretty funny. I wrote a series of tests for version 2 of the algorithm before I started implementing Typer. After than however, all tests passed except one. I was supposed to use assertUnequal() , but used the opposite instead, and that was I caught an error in my code that would’ve went unnoticed. The tests saved me another time, when I noticed that changing the order in which the charset character types are written changes the output, which is not what I need because it’s essentially the same input, and it should be more like a toggle. The fix was making the charset canonical. The algorithm goes through the list, writes the correct characters into a string, and uses that in the salt instead of the list of the charset. Other The Generator class was removed, as it served no purpose."}, {"post_id": 33987, "ts": "2026-07-24T11:33:26Z", "hours": 4.8617, "text": "Determinist // Devlog 1 // 2026.07.24. Hey everyone! This is the first devlog of Determinist, a deterministic password generator. After a few hours of messing around, I’ve managed to write the first working version of the generator algorithm. (Flowchart attached) You can specify the parameters such as password length, special character frequency, etc. as well as the master passphrase and the salt (site name in this case), and the script will generate a pseudorandom password for you. I’ve hit quite a few roadblock along the way, such as the salt being too small. This is a feature of Argon2, so for now you can only use custom salts that are bigger than 8 bytes. I’ve also included a few unit tests as proof of concept. The generator algorithm will be improved in later versions, and a CLI tool will be available."}]...
|
Title: Determinist by @Mate1166 | Stardance
Devlo Title: Determinist by @Mate1166 | Stardance
Devlogs:
Determinist // Devlog 1 // 2026.07.24. Hey everyone! This is the first devlog of Determinist, a deterministic password generator. After a few hours of messing around, I’ve managed to write the first working version of the generator algorithm. (Flowchart attached) You can specify the parameters such as password length, special character frequency, etc. as well as the master passphrase and the salt (site name in this case), and the script will generate a pseudorandom password for you. I’ve hit quite a few roadblock along the way, such as the salt being too small. This is a feature of Argon2, so for now you can only use custom salts that are bigger than 8 bytes. I’ve also included a few unit tests as proof of concept. The generator algorithm will be improved in later versions, and a CLI tool will be available.
Determinist // Devlog 2 // 2026.08.01 Welcome back to the second devlog of Determinist! It’s been a while, so let’s recap what happened… Release!! The first official release of Determinist is here! You can check out the GitHub page to learn more. Algorithm V2 Quite a few changes here. I changed the algorithm so that it uses the bytes that Argon2 returns The bytes are now mapped to characters in a shuffled charset Insert/Replace modes have been removed because special characters are already in the charset You can now construct your own charset Typer I made my CLI with Typer, which was a challenge to say the least. This is my first time using it, and looking back, it wasn’t THAT bad. All I had to do is refactor generator.py completely, and make my types compatible (which I worked REALLY HARD on for V1). Typer doesn’t allow me to use things like lists and dictionaries, both of which are essential, but I managed to change everything in a way that’s mostly straightforward. I can split strings into a list and use JSON for dictionaries. Refactoring Challenges This is pretty funny. I wrote a series of tests for version 2 of the algorithm before I started implementing Typer. After than however, all tests passed except one. I was supposed to use assertUnequal() , but used the opposite instead, and that was I caught an error in my code that would’ve went unnoticed. The tests saved me another time, when I noticed that changing the order in which the charset character types are written changes the output, which is not what I need because it’s essentially the same input, and it should be more like a toggle. The fix was making the charset canonical. The algorithm goes through the list, writes the correct characters into a string, and uses that in the salt instead of the list of the charset. Other The Generator class was removed, as it served no purpose.
Determinist // Devlog 3 // 2026.08.06. Determinist v0.2.2 is here and available to install, but I certainly did not thing this would take another 10 hours… What changed I have made a preset system that can load settings so you don’t have to type them out manually. You can only use this with the regular generate command. The presets command lists out all installed presets Running presets save with a path added at the end will save the selected preset to your config folder Adding delete after presets with the name of a preset will delete that permanently Using presets default and adding the preset name will set that preset as default Running --help is actually helpful now! Another change is I made prompt a subcommand of generate . I ran into an issue while implementing this… The issue You see, Typer cannot tell the difference between a positional argument and a subcommand, meaning that it took prompt as the master_pass argument for generate . This is obviously not at all what I intended, so I needed a way to figure out how to solve this. I didn’t want to make prompt an option, since that would’ve complicated things a lot more than they needed to be. Therefore, I changed master_pass and site_name to required options, which means they need to be typed out manually. Fear not however, because if you forget to do that, Determinist now prompts you for it! Another problem was with types, again. Typer apparently doesn’t like Union types, which I would’ve used for the preset option. What I wanted to do is make the user be able to type out the name of the preset, select one if none is entered in the command, or do everything manually. Problem: that’s 3 types: None , str and UNSET , which is basically a different spelling of None , it jut signals that the presets option was passed without an argument, as a flag. But Typer decided to ruin my day and only let me use two types, so I removed it all and made --preset a boolean, therefore a flag. That’s about it for now, if you like the idea of having an easy way of remembering your passwords, check out Determinist!
Determinist // Devlog 4 // 2026.08.07 Developer experience and cleanups What changed My code now has comments! Although it is quite straightforward to understand, I did include a few here and there. A brand new version command shows what version Determinist is on, what commit it was built from, and the Python version it uses. I added more custom error handling to commands Something funny happened… I was testing the generation of the default preset, and I forgot to press tab when deleting the Determinist config directory. I only realized that when Hyprland started screaming at me about missing configurations. I thought “that’s weird”, so I checked the command I ran. rm -rf ~/.config/ . I deleted my entire configuration directory… Luckily, I had backups, but at least I’ve learned that I should double check my commands. Another Typer issue To absolutely no one’s surprise, Typer didn’t work as intended, once again. It kept reporting the wrong error when running presets subcommands. Turns out it was the callback I wrote to list the presets. It actually ran the check every time a presets command was run, giving the wrong error when a non TOML file was detected in the presets directory. It was a quick fix, but now I’m quite comfortable with Typer.
Determinist // Devlog 5 // 2026.08.09 I’ve started working on the website finally! The plan I’ll use GitHub Pages to host Determinist until I can get my own domain and personal site up, after which I’ll transfer it there. The plan is to make the generator client sided by using WebAssembly to access Argon2 in the browser without requiring a backend. I wanna do this so that no information leaves the user’s computer, which is a key part of keeping Determinist privacy focused. I chose to use Next.js because I used it before, and it has Static Site Generation which is essential if I want to put the site on GitHub Pages. What I achieved in 2 and a half hours I made Argon2 work Yes, that’s about it. I spent most of my time debugging errors and learning basics as I’ve only used JavaScript for making components, not to make more complex algorithms like Determinist’s is. I am a fast learner though, so I expect to be able to recreate Determinist V1 relatively quickly. Starting with WASM on my first serious web project where I’m still learning JS maybe wasn’t the most amazing idea, but hey, I like challenges and learning by doing. What’s next? Continuing work on V1 Porting V2 to JavaScript Desgining the UI Adding the preset system Generating the static site and fixing errors after it’s done And to the reviewers and people who liked the Determinist CLI… Thank you! Developing Determinist has been lots of fun and I’ve learned a lot of valuable things. Your support and feedback is greatly appreciated, it motivates me to work every single day. It’s a project I’m really passionate about, as I wanted to create this for years. Thank you all for your support, and I hope you’ll enjoy using Determinist whether it’s in your terminal or the web. See you in the next devlog!
Determinist // Devlog 6 // 2026.08.10 Pretty big milestone: V1 is finally working on the website! Additions Added the V1 generation algorithm Added the customization options to the interface The Generator V1 is complete and works perfectly! I had to figure out a way to enter objects, and it was quite difficult. See, JavaScript doesn’t really have a dictionary type like Python does, so I had to use an object, which is similar enough and I can look for keys with in , just like in Python. The tricky part was creating such an object from the user’s input. I chose the most user friendly way I could think of, and made separate inputs for the key and value, and you can dynamically add more with an “Add Character Pair” button. I really wish there was an easier way and maybe there is a template out there, but I didn’t consider it until writing this very sentence. Anyways, tomorrow I’ll spend more time refining V1, the inputs and I’ll start working on V2. To Do Refining the generator and inputs Creating V2 Desgining the UI Adding the preset system Generating the static site
Determinist // Devlog 7 // 2026.08.12 Well, it’s official. I had to use AI for the first time :( Why? JavaScript does not have the same random implementation as Python does. Python uses MT19937 while JS uses Xorshift128+. This means we can’t use JavaScript’s random number generator, not to mention that we can’t even use it to shuffle arrays, as it lacks the method. And since I am relatively new to JS, I had two options: get a 15 year old module work that does exactly what I need it to, or make it with AI. I tried getting that package to work. I really did. Unfortunately, the algorithm it uses seems to be outdated, as the results differed in tests. That is why I used AI. I really didn’t want to, but I had to. Well, let’s look at the positives, at least! Changes The V2 algorithm is implemented and works 1:1 with the Python version! I managed to make another input component that uses checkboxes so you can select what kind of characters you’d like. It was challenging but it works! Next Up Tomorrow I’ll work on the UI design Adding the preset system Building the site Uploading to GitHub Pages
Determinist // Devlog 8 // 2026.08.13 The UI is mostly complete, and I will be releasing the website tomorrow! Changes Significantly improved the entire user interface Version and special character mode (V1) now use <select> instead of the regular <input> , so you don’t have to type them out The difficulties There really wasn’t anything too hard about making the UI. You might ask, “why did you spend over 6 hours on it then?”. I have an answer for you. I tried using Figma for designing the UI but it was just too boring for me, so I decided to start coding it and figure it out as I go. I’m pretty satisfied with the result, but with everything, it can always be improved. The second problem was that while I was coding, I was also listening to music and I spent a bunch of time skipping songs because I didn’t feel like listening to them. This took my attention along with singing a bit too much, so my progress was slowed… The last thing to slow me down was my general inexperience with React and JS, although I got over that quick because the frontend is way easier to work on. Planned Adding the preset system Building the site & uploading to GitHub Pages
Determinist // Devlog 9 // 2026.08.22 Long time no see y’all, sorry for the wait! I’m on vacation so I had less time to work on the project, but I did bring some amazing improvements. Announcement The website is officially up and works identically to the CLI, now with presets! Just load your TOML presets into the website, and they will be saved for you to reuse! Important note: they are saved locally, therefore you will not see them on different devices unless you import them there too. Changes Added the preset system to the website! You can now import and use presets, and you can easily remove them if needed. Adjusted the UI so that it fits most (if not all) screens. The smallest screen I tested was an iPhone SE. The Challenges There actually weren’t a lot of challenges for once. The biggest one was that I forgot to work on the project while on vacation, but that’s not horrible. And then came React, JavaScript and everything else… firstly, the preset loading was actually really easy, I did however fight with React about passing values from a child component to the parent. And then it turned out I forgot to make it actually pleasant to use, as I had to select the preset file every time I wanted to load it. Now you can save, select and load your presets on the website. However, React had other plans. I finally learned how React’s useEffect hook works, and using it is pretty easy now that I get what I’m doing. Along with this, I also properly learned about using functions inside useState for lazy initialization which I needed for localStorage . Oh, localStorage was a pleasure to learn and use… Well, the operations with it are actually fairly easy, it’s like an object, and my first thought of initializing a state with it was to use useState({ ...localStorage }) , which did work, but it introduced something else: a build error after I merged the changes into main . Turns out, localStorage is undefined when GitHub Actions wants to build my website, therefore it gave me an error saying so. What I had to do is check if the window object is equal to 'undefined' , and if not, then spread localStorage and initialize the state. Finally, the website managed to build properly, but when I tried to use it on my phone, the output of the generator was outside my screen… so I had to go back and change how the UI looks after I’ve already merged everything into main . Amazing. Well, the good new is that it works, and next up is the v3 algorithm, as well as QoL changes, bug fixes, and more in both the CLI and web versions.
Determinist // Devlog 10 // 2026.08.27 Updates here and there, and the v3 algorithm is finally complete! All of this and the content of the rest of the devlogs will only be released with the final 1.0.0 release of Determinist. Changes Added v3 algorithm for the Python CLI It features dynamic byte generation so that no matter what, you’ll never run out of characters! (Unless you’re VERY unlucky) You can now enter a third value called a “differentiator” that can be used to change the output further. This is especially useful if you have multiple accounts on the same site. This option can be left empty Your generated password is now guaranteed to have the correct amount of characters You can now set a minimum amount of characters of each type! Simply enter 0 to exclude the character type, and 1 or above to choose how many characters your password have minimum of that type. Made generate prompt only prompt users if the prompts are applicable. This means you will no longer be prompted for the settings of v1 when you use one of the other two algorithms. Fixed an issue where if the site_name option is omitted, the prompt will display Master pass instead of the correct prompt. The difficulties Well, of course the development of v3 came with some challenges. Firstly, I had to figure out how to actually generate enough bytes to pass rejection sampling (making sure no bytes are out of range when mapped onto the character set), as the previous implementation was that I multiplied the password length by 32. This worked, but wasn’t pretty and in very rare and unlucky cases, there weren’t enough bytes. I fixed this by using something called HKDF, which stands for HMAC-based Extract-and-Expand Key Derivation Function. I’d really prefer to use HKDF. Anyway, this function was really good for this task, as it can take the Argon2 output and create a long, pseudo-random key that can go through rejection sampling, and finally end up in the password. In case this generated key is not enough, HKDF will generate more of it, essentially giving us infinite bytes to then map to our characters. This was especially good because in the same loop I could implement… Minimum requirements This should have been easy, but it took me a day to think about how to do it. The challenge: take a dictionary ( {"lowercase": 2, "uppercase": 3, "special": 1, "digits": 0} ), and include at least as many characters of each type as their value in that dictionary says, and if it’s 0 then don’t include it at all. Fine, I said, but I didn’t actually know how to implement this. After a day of thinking, it finally clicked: I implement this in the rejection sampling loop, as that is where my characters get added. Introducing the _construct_pass function: it looks for the already added characters, determines the type of the current character, counts how many are missing, and if a character type is missing some characters or there aren’t any left, the character is added, and otherwise it is discarded. To do Add a preset generator command Fix a g prefix appearing in the version command output before the git commit hash Add the ability to choose a preset in one line instead of being prompted for it Fix the password being allowed to be shorter than the sum of minimum required characters (I found that one while writing this) Port everything over to the website Update the docs Add more text to the website explaining Determinist and how it works
Determinist // Devlog 11 // 2026.09.06. After the first week of school, I have finished work on the CLI, and Determinist 0.5.1 is released! Changes Added presets create command Changed preset option to allow selection in one line Changed the presets list to show invalid files in the configuration directory Added password generation errors Fixed bugs: The password being allowed to have less characters than the sum of the minimum required characters is fixed The g prefix from the commit hash is now removed Various preset error handling issues have been fixed Presets are now not required to have all the versions inside them What’s taking so long? Is Determinist done? Firstly, I just started school, so I got very busy lately and that is why I haven’t been doing much work. As a compensation, v3 of the algorithm is now available on GitHub !! This is version 0.5.1, which is a pretty big jump if you look at the versions before. However, there is a reason for that: active development of Determinist is going to stop once version 1.0.0 comes out, with all the new features and fixes being ported to the website. This will come out in the next week or so. Determinist will still be updated here and there if I miss some features or people have suggestions and issues, but I will be mainly focusing on other projects. Latest development stuff The preset creation was actually pretty easy. I figured I’ll reuse the options from the generate command so I don’t have to write them manually again, and it worked amazing! I had to add to the PresetHandler to make it work, and that was really simple as well. I first thought of adding strings together, but then I realized I could just create dictionaries that my TOML library can convert to TOML and write them to the preset, so I didn’t have to do all the writing myself. The bug fixes weren’t interesting at all, honestly. I messed around with Determinist, found bugs and issues and I fixed them. My favorite one was debugging errors with the preset commands however. I found a bunch of things worth fixing, and in the end I made another helper function, as well as changing how check_file_type works. To do Port everything over to the website Add more text to the website explaining Determinist and how it works
Determinist // Devlog 12 // 2026.09.16. Well, it took me more than a week, but the v3 algorithm is on the website! CLI Update I have published version 0.5.2 of the Python CLI, which fixed a few issues I found (you can see them on the GitHub page!), and added actual functionality to the default presets. You can also report issues on the GitHub page, and it is highly appreciated. What changed? I added the v3 algorithm, after a bit of tinkering with the error handling. My problem was that the error handling wasn’t really dynamic. It couldn’t handle the invalid input errprs from v3, so I made a separate component. I also had to learn how to use HKDF on the client side, which was actually easier to do than I expected, although the actual usage of HKDF was a bit more complicated than it is in Python. What’s next? Bug fixes Descriptions Preset Generator PWA Implementation Auto Copy to Clipboard toggle
Determinist // Devlog 13 // 2026.09.25. Quite a few issues, but apparently it works… Progressive Web App Well, making Determinist a PWA certainly took way longer than expected. I thought it would be an hour at most, I mean Next.js literally has a guide that tells me what to do step-by-step. It was in fact NOT easy. I encountered a ton of problems. First off, I had to write a manifest which had the app name, icons etc., the obvious things. What was not obvious however was that I had multiple ways of doing that. I could write a JSON file, or write a JavaScript file that exports an object. I chose the latter as it was the version that the Next.js guide was using. Then came the icons. Oh, the icons. I made my icons and put it in the public/ directory with the correct names so that they match the manifest. Cool, works when I share it but there is no icon when I add it to my home screen on my iPhone. It said I’m missing a file called apple-touch-icon and apple-touch-icon-precomposed . Cool, I duplicated the icons and I renamed them. No 404s, but it still did not work. I look for a solution. For hours. I look at Next.js docs, YouTube, StackOverflow, Reddit, GitHub issues and there is nothing that would fix it. Finally, I found out I need to link the icon in the head of the website. Great, but still doesn’t work. Turns out, the problem was that I was following the Next.js guide which told me to use HTTPS to test the PWA, but iOS does not trust self-signed keys so it did not download the icon. After that, the generation broke when I was connecting to the site with the IP and not through localhost . I noticed that submitting (pressing the generate button) redirected me which should not have happened due to the line e.preventDefault() . Then I saw Next.js attempting to connect a websocket, and a bunch of 403 errors that weren’t there before. I spent quite a bit of time debugging that, and it was due to not adding my IP to allowedDevOrigins in the next.config.mjs file despite it working perfectly fine before. The Icon As you can see, the image I decided to include in my devlog is the icon for Determinist. I actually did not think of putting the D and the E together at first, but when I did, it reminded me of a lock (hope you can see it!) and I chose to keep it as it kind of fits. And I didn’t want a solid color background, so I decided I’ll just add the name repeating. It was fun making it, and it was also a very good way to practice using Illustrator. What’s next? Making the PWA work offline Bug fixes Descriptions Preset Generator Auto Copy to Clipboard toggle
Determinist // Devlog 14 // 2026.09.06. Finally, I figured out how to make the site work offline… The process After working on the PWA for way longer than I expected, it finally works as intended! After I’ve figured out how to use next-pwa , I encountered an issue: the site was being cached and loaded correctly in the browser but not when installed as a PWA. I rewrote multiple parts of the code for it to work, yet it did not. In the end, it was the unsecured connections that were at fault. Discovering that, I have learned to use something new again: Localtunnel, which allows me to use a valid (not self-signed) HTTPS connection while testing. This uncovered even more issues with my code, the most obvious being the fact that fonts were not cached at all. This was because I was getting my fonts by connecting to fonts.google.com . This was a really easy thing to fix though, as Next.js already has a next/fonts/google library that had the fonts I used, and now everything works well. What’s next? Bug fixes Descriptions Preset Generator Auto Copy to Clipboard toggle
Determinist // Devlog 15 // 2026.09.15. A few design changes, and a brand new section on the website! Design I have fixed several design issues I noticed and did not like. Just to mention a few, there was unnecessary overflow on mobile devices, the spacing was off on several elements, and the width of the file input field was also too big. The Wall of Text™ It isn’t that big to be fair, it just explains how Determinist works, split into the 3 versions of the generation algorithm. I didn’t want to copy the page I had linked in the README, so I just wrote it down again and tried wording it better. Additionally, I tried to preserve the original one page, no scroll design by placing the About section below the actual app, so you have to scroll to see it. Other changes I refactored parts of the web code as the Generator element was getting really long, above 500 lines. I moved the algorithms out to a separate importable module, and I placed it along with the python-random module into a self-explanatory modules directory. I’ve also moved generror.jsx and presethandler.jsx into their own handlers/ directory, and the two specialized input fields into an inputs/ directory. Overall, this change makes the code way easier to read. The preset generator works now as well, just click the “Export as Preset” button below “Generate”, name the preset and the preset will be downloaded for you! You can also toggle on a “Copy to Clipboard” feature which allows you to automatically copy your generated password to your clipboard. Pretty neat! What’s next? Bug fixes Auto clear password popup
Determinist // Devlog 16 // 2026.09.17. Version 1.0.0 is out, and this is my final devlog. Well, it finally arrived. Version 1.0.0. This is where active development stops. Of course, I will still fix issues and implement features suggested by you guys, but I probably won’t be adding any by myself. Stardance has been a great inspiration for me, not only to make this project, but to keep going and coming back to doing what I love: coding, and making things for others. I am very happy with how Determinist turned out, despite the difficulties and me being busy with school. But enough of this, what was changed since my last devlog? Changes Updated the documentation to show that a PWA is available to install Fixed various bugs and style inconsistencies Added a description of the generation process to the website Added a Copy to Clipboard toggle Added an Export as Preset button Removed Google Fonts connections What’s next? Nothing. I’d like to thank everyone who had a chance to try and use Determinist. Everyone who reviewed it and even you, the one reading this devlog :) Y’all have showed me that things I make can and are useful for others. See you in the next Hack Club program!
Ships:
Determinist is a password generator made for people who often forget or leave passwords behind, just like me. A few years ago I was on vacation when I wanted to log into a website. However, the password for it was left at home on my PC, which I didn’t bring with myself. Of course, I could’ve just reset the password, but that would’ve been worse since I’d still have mismatched passwords. Determinist solves that. It uses a deterministic algorithm to take your inputs, and generate you a password you can recover anytime, anywhere. The only thing you need to remember is your master passphrase, which site you want to log in, and a few additional settings. (presets coming soon!) I had a lot of fun with this project, and it taught me quite a bit about encryption, randomness, and most importantly how a real-world project functions. (I do have to mention my initial struggle with Typer though, I would not want to wish that on my worst enemy.) With that being said, I hope you’ll have your password problems solved, and that you’ll enjoy using Determinist! Have fun!
Well, it’s official: Determinist now has a website! Features: Easy to use interface Straightforward settings 1:1 compatibility with the CLI Fully client-side The only thing that hasn’t made it into the website (yet) is the preset system, just like with the CLI, I’m adding that later as the web UI is already really easy to use. And now the less technical bit… It’s been an incredible journey, Determinist has been my dream project for a few years now, and it’s really amazing how I can share it with the world now that it’s done. Just to mention a few things I learned from this project: Testing Proper git usage Cryptography JavaScript These are things I wouldn’t really have learned without Determinist. Sure, I could have done so, but not this fast and effectively. I must thank those who supported the project, who liked the devlogs, and of course the reviewers who gave their opinion on the CLI. Because of your feedback, I made Determinist even easier to use now, and I will continue doing so. Version 3 of the algorithm is on its way, as well as the preset system for the web. Thank you everyone!
Determinist Determinist is a deterministic password generator that lets you recover forgotten passwords easily, given that you remember a master password, and a few things about your lost password. Features CLI and Web interface, featuring a PWA that also works offline Three algorithm versions to choose from A preset system Generated passwords are identical on both the website and the CLI Fully local generation Presets The presets use the TOML format, which is very user-friendly and easy to edit. The presets have multiple categories inside them like ‘general’ (for the algorithm version and password length), ‘preset’ (the preset name, description and whether it is set as defaul), and version specific ones like ‘v3’, which has the settings for the v3 algorithm. If you’re unsure how to edit preset files, you can also just export your settings from the website, and use it across all versions of Determinist! To Reviewers Please, test both the CLI and the website (if possible), and provide feedback on User Experience if you encountered any issues, include that in the review. You can even suggest features, and I may implement them :) Thank you!...
|
1792304412.9257355
|
1793168412.9257355
|
|
36597
|
Perihelion by @superheroyrr | Stardance
|
superheroyrr
|
1
|
76.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T23:18:16Z", "hours": 76.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "What did I make? This is a gravity simulator written in C++. Right now, it only simulates the solar system, but I am planning on adding more to it in later ships. For detailed instructions on how to use it, see the README, but as a TLDR: when your mouse disappears, use the WASD , Shift , and Space keys to move around. To show your cursor, press Esc . Click anywhere to hide it again. Click on a planet’s outline to select it. When it’s selected, you can press V to change its velocity, then you can press X , Y , or Z to lock to the axis, and click with your mouse to confirm. You can also edit its properties in a window. To unselect it, press the × button in the top center Challenges I finished IB SL Physics with a level 7 (highest one possible), so I naively thought all the physics calculations would be easy enough that I could solve them completely alone. Tbh, it was at first, with the actual gravity part just being the F = Gmm/r^2 equation over and over again. However, with my other features like the spacetime curvature grid, and especially the “Orbit eachother” button, those features required things from university level physics and were complicated. So for these specific physics features, I ended up defaulting to AI to write them. Additionally, figuring out 3D graphics was a challenge and for this, AI and the internet were very useful in figuring those out. I am also glad I used Raylib to code this, since it makes 3D graphics much easier than it normally is. Roadmap for future ships I will consider adding the following in future ships: Black Holes Make the planets rotate Presets other than the solar system Optimize the gravity simulation, right now it lags at around 40 objects Add a bunch of the planets’ moons Add collision detection, so you can smash an asteroid at a planet and see what happens Simulate atmosphere of a planet? There’s probably a lot more that I could add as well, feel free to suggest some features when you vote for this project!", "repo": "https://github.com/agokule/perihelion", "demo": "https://agokule.github.io/perihelion/"}]...
|
[{"post_id": 76898, "ts": "202 [{"post_id": 76898, "ts": "2026-10-05T00:04:58Z", "hours": 4.1833, "text": "First ship is incoming very soon! In these 4 hours spread out across a whole month (I was too busy with school), I got it deployed as a website! ㅤ You can try it out at https://agokule.github.io/perihelion/ . I’m too lazy rn to upload a proper video, so if you can’t figure out how to use the app, check out my other devlogs. Lmk what you think about the app in the comments! Would this be good to ship, or are there still some things you are dying to see before that happens? How was it? Not very nice tbh. A part of me regrets choosing Raylib instead of SDL3 for this project, bc in my experience it was super easy to just port over an SDL3 project to a website. ㅤ Here it was not that easy. I ended fully refactoring the main file (like just rearranging things into different functions) just for it to work the way I wanted. ㅤ In particular the way it handles keyboard/mouse inputs on a website is soooo weird!! You have to check for them at a specific point in your code between two certain functions, which is weird!! ㅤ There were also a lot of weird niche bugs that were so annoying to find, and it turns many of them were with the way Raylib deals with the web, and I only found out because Claude ended up closely reading the source code for these fixes! ㅤ These were mostly minor nitpicks which AI helped me solve. Now, that this thing is almost done I am very glad. It’s like a huge weight has been lifted off my shoulders."}, {"post_id": 61580, "ts": "2026-09-04T15:41:00Z", "hours": 2.1069, "text": "What would happen if a second Sun randomly spawned in our solar system? Well clearly chaos according to my simulation. So previously, I made a button that automatically sets a velocity so that one object orbits another object, allowing you to easily make planet-moon systems. ㅤ However, what if you wanted to create gravity systems where objects are similar masses, like binary stars, or something like the Pluto-Charon system where clearly they orbit a point outside of each other? ㅤ This is what I set out to implement in this devlog, other than fixing a bug in the spacetime curvature grid where it would jitter around. ㅤ So I’m gonna be honest here, I did basically get AI to do this part for me, that’s not to say I didn’t try at all because I really did. But it turns out this stuff is way outside of high school physics and goes into orbital mechanics. ㅤ I wrote a simple solution which I thought might work, but it didn’t quite. ㅤ So I tried to watch this video to understand how to do it, but couldn’t understand what kind of vector math he was doing. So I basically gave up and got Claude to do it. ㅤ Looking at Claude’s solution, it seems kind of simple in that it’s not using crazy long equations to do things, but at the same time, I don’t think I would have been able to come up with those on my own, so ig it was a good use of AI to speed things up."}, {"post_id": 59165, "ts": "2026-08-31T19:54:12Z", "hours": 3.4219, "text": "I’m back after 2 weeks!!! First I’ll explain why I took a break and then go over what I did in these 3.5 hours. Why I was gone for 2 weeks Basically, I was previously trying to force out 3.5 hours a day to get the FW13 laptop, along with trying to finish this online course so I can get my driver’s license (spending 2 hours a day on that). On top of that I had tuition classes so I can get ahead for next year’s chemistry and math curriculum (probably ~2 hours a day on that). This makes for 8 hours a day of scheduled work. Oh yeah and I wanted to do all of this while still maintaining my health (like going out for a walk everyday and things). ㅤ Obviously, this is a lot of time to commit, but I went ahead with it, thinking of it as a way for me to learn better time management, so that grade 12 will be easy for me. ㅤ However, it turned out to not go the way I thought it would in my mind. You see, no matter what I tried, I just couldn’t get all three of my priorities met. It’s not like a 9-5 job, where you really just have to stay at the office for that timeframe, but then only like 3-4 hours of that is actual focused work. This plan was demanding a full on 8 hours of high focus everyday, which is probably just not possible, without sacrificing too much in my opinion. ㅤ I also realized this was getting in the way my driver’s license and prepping for grade 12, which were probably more important. ㅤ Don’t get me wrong, Stardance is pretty cool and important, but the other 2 things are more important, I think. ㅤ The breaking point came when I finally did reach two of my priorities for 2 days (Stardance and driver’s course). But, it was a very grueling 2 days, and it wasn’t even including anything from tuition. I quickly realized that this was going need a lot more sacrifices than I bargained for. ㅤ So yeah, I took a break. I finished the online course, now I have to do in-car lessons, but the bottleneck for that is now the driving instructor’s availability, now mine. I also tried catching up to the tuition hw (yeah tbh, that didn’t go too well). And I still didn’t touch any of my projects for a bit after that because I was genuinely burnt out. ㅤ But now I’m back! I’m not fully quitting Stardance at all, but now I will work at a slower pace than before. A pace that feels natural to me, rather than forced. Honestly, it might turn out to be the same amount of time as before, just because a bunch of my time has been freed up by finished that driver’s course. But whatever happens, I will finish all of my projects in a way that isn’t so taxing to me mentally and physically. What I actually did in this devlog So for this devlog, I made it so you can edit the velocity using polar coordinates (basically change it via longitude/latitude), as an alternative to x/y/z. ㅤ I initially tried to do this myself by stitching together some math formulas from Reddit, but it didn’t work because I didn’t understand the physics behind them. ㅤ This stuff goes under a field called spherical trigonometry, which is something they don’t usually teach until university math, so I definitely didn’t learn it in grade 11. ㅤ Eventually I gave up and just used Claude to implement the rougher details. However, I have decided to learn a bit of this stuff myself, since it seems like just high school trig but in 3d. Also, because why not!"}, {"post_id": 48408, "ts": "2026-08-16T18:57:36Z", "hours": 6.3819, "text": "Now you can change the velocity and lock it to a specific axis!! Also I upgraded to C++23 from C++20. ㅤ Yeah that feature was a real nightmare to implement, with loads of bugs. That stupid float vs double thing came back to bite me again!!!! I swear bro these things annoy me a lot. How do I do this? I also initially had like no idea how this feature should be implemented, I was sitting there thinking and trying code out for a long time. I eventually decided to change the way velocities are changed entirely, now instead of just clicking and dragging, you press V on the keyboard and click with the mouse to confirm. ㅤ Even after that I had a dilemma about how exactly this axis locking feature should be implemented. I was initially going to cast a ray from the mouse and figure out where it is closest to the axis, however it turns out that is math that goes outside of high school altogether, so I had to scrap that. ㅤ Then I decided to open up Blender and see how it does it’s axis locking when you drag 3D objects around. From Blender I got inspiration for how it works in my program. ㅤ So now once you are editing the velocity, you can press X , Y , or Z to change the velocity going in those respective axes if you want. I also figured a much simpler way than that first method I thought of because of the testing with Blender. AI disclaimer Obviously there had to be some bugs with my code. After having spent a bunch of time struggling through writing the code only to reach some weird bugs, I gave up and did turn to AI. ㅤ I carefully supervised it while it tried to fix my code (I do NOT believe in vibe-coding) and it was actually able to fix it alright. I made a suggestion to edit the code to be cleaner and it listened. The ultimate plot twist I then asked it to add that sky-blue line thing. Now here’s the ultimate plot twist, so you know that float vs double precision error that keeps coming back to me? Well in every previous devlog where it happened, it was Claude who pointed out the issue. Well guess what? This time it was me who found it! The issue was with that line and how it was drawn on screen. ㅤ So yeah. That took a very long time, but it was worth it."}, {"post_id": 47584, "ts": "2026-08-15T15:47:40Z", "hours": 3.3922, "text": "So now you can add objects and change velocities going up and down in the y-axis using up/down arrow keys!! It also shows the flat grid temporarily for these. ㅤ The only thing is that I will probably change how the velocity y-value thing works, because I don’t like it. It’s ironic because that was the thing that took the most amount of time as well."}, {"post_id": 47084, "ts": "2026-08-14T18:35:57Z", "hours": 2.6942, "text": "Here’s what I’ve done: Made it possible to move the flat grid up and down Implemented custom camera controls so that I can better control the experience. This was very difficult at first… until I realized I could just copy paste the code from the library I’m using and just edit that instead 🤦. With this new camera system, I added a feature where you can hold shift and it will slow down for you. More internal refactoring!!! If you’ve been reading my devlogs, you’ll realize that this is like the 5th time or something that I did internal refactoring. To explain, this is my flagship project, as in I’m trying to reach like ~150 hours on this project so that I can get the Framework 13, so I want to take it slowly, so that I can be sure that I can build the features I want to build in an enjoyable manner. This is why I do these things occasionally."}, {"post_id": 46416, "ts": "2026-08-13T16:39:12Z", "hours": 2.6864, "text": "So I added an easy button to make celestial objects orbit another object. To demonstrate this, I recorded a video of me adding 2 moons to Jupiter! I also added a reverse velocity button which is self-explanatory, I didn’t include it in the video because I forgot. I also made it easier to add objects in a previous devlog, but I forgot to include it there."}, {"post_id": 45809, "ts": "2026-08-12T15:07:04Z", "hours": 3.995, "text": "In these 4 hours, I have made the overall experience of switching between objects better by doing these things: Made the camera turn with constant angular speed. Previously, it would sort turn instantly if it needed to make a 180, and then freeze. The camera position is now smoothed out with an easing function instead of linearly moving it Made the grid in the background not jitter when viewing a single planet Set up debugging to work ㅤ The reason this took this long was because for some reason, I was previously using the frame count and a decimal calculated framerate to time out the animations. ㅤ Obviously, mixing decimal numbers with whole numbers wasn’t going to work well, so I had some really weird bugs that sometimes happened and sometimes didn’t. This was literally the motivation for me to setup the debugger! ㅤ Initially I tried to work with the system as it was, but it became tedious fairly quickly, with a lot of if statements, etc. So, I swapped to just using the system time, and it literally just fixed itself almost instantly! That and the code for it ended up being simpler than before! ㅤ The only thing I don’t really like is the grid, and how it kind of jitters, although that will a future problem to solve."}, {"post_id": 44655, "ts": "2026-08-10T15:53:11Z", "hours": 3.9903, "text": "Here’s what I did yesterday: Added a settings editor Added tooltips everywhere Added an intuitive button to deselect the current object"}, {"post_id": 44048, "ts": "2026-08-09T15:47:51Z", "hours": 8.1869, "text": "You might be thinking: “So there’s 8 hours in this devlog, surely there are some major visual changes, right?” Well unfortunately no. I meant to post a smaller devlog the day before yesterday, but I forgot about it yesterday. Now here I am cleaning up that mess. I basically did just the following 3 things: ㅤ Added Nerd Font icons to the UI. This took waaay too long (like 2 hours) since I was spending so much time figuring out how to scale specifically those icons, and nothing else and when I did figure it out, they were all of a sudden misaligned, towards the top left compared to regular text, so I had to realign them to be proper. After all of that, it seems like I might need to make my own font icons, since Nerd Font is mainly designed to be put in a coding IDE, not a random app like this. There are some space things which I want icons for, but aren’t available in Nerd Fonts. Oh well, that’s a problem for future me. ㅤ Now here’s the real timesink that made this devlog 8 hours: so I went on a long sidequest to basically implement CSS position property in this C++ UI library. This was mainly so that it would be way easier to position new UI elements. The next devlog will most likely be about adding new settings UI. Along with that, I also wrote a bunch of helper functions to make it even easier to write new UI components. So basically, the UI got a full refactor. ㅤ And finally, using that UI refactor from above, I added a playback controller at the bottom and moved the object selector to the top. Yes, it is an embarrassingly small amount of user facing changes coming out of this 8 hour devlog, but at least my UI code is easier to maintain!"}, {"post_id": 42195, "ts": "2026-08-06T20:10:57Z", "hours": 2.0506, "text": "Huzzah! I added a skybox (basically the background image). I will admit that this part was basically AI’d, but it was really hard to do it by myself, since it would have required learning GLSL myself, which I didn’t want to do."}, {"post_id": 41540, "ts": "2026-08-05T20:16:31Z", "hours": 4.0603, "text": "So I decided to spend a lot of time refining the velocity changing with the mouse. Also did a smaller refactor to make the code look cleaner. ㅤ The main issue I had previously was that it was jittery when the object was far from coordinates (0, 0, 0). It turns out it was another stupid float vs double precision problem in C++. Yes, very similar to what I faced earlier in this project. ㅤ I will admit that I did use AI to find these bugs and fix them, but I was supervising it very closely and testing it thoroughly. I am also starting to see the limits of AI. Claude now decided to flag a bug which didn’t exist, and when I asked it to refactor, it made the code look worse ironically. I ended up having to do that part myself. ㅤ However, AI was still more of a help than a hindrance, so I will still use it throughout this project. If you are curious, the git commits have more detail about these and they are here ."}, {"post_id": 40192, "ts": "2026-08-03T16:23:30Z", "hours": 4.4261, "text": "So I made it very easy to change the velocity of objects, you can just drag from the cone anywhere now! ㅤ Surprisingly, the hardest part about this was just getting the arrow to draw and also tuning how big it is so that it looks good, but once it was there, it was actually pretty easy to just hook up a click detection. ㅤ Funnily, this 3D library I’m using (Raylib if you’re curious) doesn’t have a builtin “DrawCone()” function. It turns out that to draw a cone, you are supposed to use the DrawCylinder() function and set one of the radiuses to 0! That was really weird to find out."}, {"post_id": 39627, "ts": "2026-08-02T18:59:38Z", "hours": 1.8067, "text": "HEEELP!!!! I added a panel to edit the properties of objects, so I decided to add a bunch of mass to Mercury for fun, now the Sun is orbiting Mercury! This is so trippy especially how much it warped spacetime."}, {"post_id": 38576, "ts": "2026-08-01T01:50:58Z", "hours": 4.5342, "text": "So I fixed some bugs with the warped spacetime grid, and also added a way to add objects to the scene. I haven’t added collision detection yet, so it kind of looks weird but I’ll do that later. ㅤ The reason this took so long is because adding objects kind required a lot of refactoring. Basically, I had to write code for when my objects get copied around, because adding an element to a list in C++ might mean copying it around. This was difficult because raylib is a bit too high level for how it handles these GPU textures and models. ㅤ Now I will add an edit panel to make the new object changeable."}, {"post_id": 37344, "ts": "2026-07-30T00:14:37Z", "hours": 3.7403, "text": "I have just made the grid in the background warp, representing the curvature of spacetime! ㅤ You will probably notice that the grid is smaller and follows you around if you watch the video. This is because I had to. The grid needs to be about this small, otherwise performance is bad. I could make it bigger by making it more spaced out, only if that’s something people would want though. ㅤ This took waaaaaaay too long since I made a very stupid mistake and C++ decided to harshly punish me for it. Well I did promise not to use AI in the next devlog, but I was dealing with a really weird issue with it for like 1.5 hours and I gave up and asked Claude code about it. So you see that screenshot right (you might need to click the next image button)? That was the solution!!!!! Just add = 0 to that line. ㅤ So basically in C++, if you don’t initialize a variable to a value, as I did there, the value of that variable will then basically be whatever happens to be at that memory address, which will initially be some random number. But as the function runs again and again, it will use that previous value, and later on I was doing y += ... so the y-coordinates of the grid were continuously increasing. ㅤ Visually, it looked like the grid wasn’t being drawn, since the y-value instantly went to a huge number. ㅤ Btw that was the only AI help I got for this part, except for the mathematical formula, which I got from Claude as you can see in the background of the screenshot."}, {"post_id": 36699, "ts": "2026-07-28T22:30:28Z", "hours": 1.6914, "text": "tbh, I haven’t been working on this a lot over the last few days because of other projects, but now I have. ㅤ Here’s what I got done: A major refactor on the codebase which will make it easier to later add a preset selection screen. A better selector for celestial objects at the bottom of the screen. ㅤ I’ll be honest, I did write most of the code for these with AI (yeah bummer ik, but really, who likes refactoring code on their own?). Although, I was closely inspecting everything it wrote. ㅤ Now the next thing I will do is make the grid warp with the gravitational field strength to represent space-time getting bent."}, {"post_id": 34312, "ts": "2026-07-24T22:05:19Z", "hours": 1.655, "text": "For this update, I have done 3 things: Added a small outline circle to distant objects so that they are more visible. made it so you can click inside of these circles or on the planet to zoom into it Added a trail behind each planet."}, {"post_id": 33545, "ts": "2026-07-23T16:10:55Z", "hours": 2.4864, "text": "These past ~2.5 hours have been spent on some quality of life features for the app. Mainly these 3: Made every object 5x bigger than its real life size because it turns out the solar system is such a big place, that you kind of have to. Otherwise everything looks too small. Made it so when you switch between planet it has a quick transition period. Added textures to every planet and the sun. This was actually the hardest part, I had to play around with the settings because it would usually apply the texture sideways, or distort it but I got it working anyways."}, {"post_id": 31887, "ts": "2026-07-20T17:16:08Z", "hours": 3.6044, "text": "So in this devlog I’ve done quite a few things to make the overall experience nicer: ㅤ Added a way to pin one object to the center of the screen. Added the Moon and the rest of the planets in the solar system Switched from using light minutes to light seconds for distance measurements because the light minutes values were WAY too small Another annoying bug I had to fix: So there was this bug where the moon would pretty much always just fly out into the abyss as if there was zero gravity applied to it. It was pretty annoying to find out that it because I was using C++‘s float type instead of double . ㅤ What’s the difference? Well basically float gives about 7 decimal points of precision, while double gives about 15. I initially started with float because it is half the memory size of double and in my experience, float gets the job done like 99% of the time. ㅤ However, it turns out I did need more than 7 decimal points. This is because the gravitational force experienced by the Moon is very small, like around 10^-12 (thats 0.(eleven zeroes…)1). Since float can’t hold that value, it just rounded it to zero, causing the moon to fly out in a straight line forever. I’ll be honest, it wasn’t me who figured that out, it was Gemini who did, but pretty much everything else in this devlog was made by me. ㅤ It’s crazy how such a small difference of like 10^-12 can make on a physics engine like this! I hope I don’t have to then switch to C++‘s long double , which has even more precision, that would be insane if I had to go that extreme. I probably would have had to if I didn’t switch from light minutes to light seconds lol."}, {"post_id": 31203, "ts": "2026-07-19T12:36:42Z", "hours": 3.0122, "text": "I got gravity simulation working! Now the Earth is spinning around the Sun! ㅤ I know you can’t see it in the video I posted, but the Earth is there, it’s just that this simulation is drawn to scale, the Earth would actually barely be visible if you were looking from a spacecraft that far away. ㅤ This took quite a while because of this one really stupid bug: basically I store all the distance values in light minutes rather than kilometers or miles because otherwise those values would be too big. However, the physics equations that I’m using expect the values to be in meters, not light minutes. ㅤ So basically, I forgot to convert from light minutes to meters when calculating the gravity acceleration, so those values were too small to change the velocity of the Earth, causing it to go in a straight line forever. ㅤ But now that that is done, I will start adding the rest of the planets and maybe their moons as well to this simulation, then I can look purely at quality of life improvements to improve the interactivity of it. ㅤ This project is turning out to be easier than I expected! Hopefully another challenge doesn’t pop up…"}, {"post_id": 30702, "ts": "2026-07-18T14:29:09Z", "hours": 0.5217, "text": "So I got this cool C library called adjust.h setup for hot code reloading. This means that I can update the code while it’s running , and the changes show up in real time! I know that I am making this a web app, but because the module doesn’t work on web, I will prototype the app on desktop for now."}, {"post_id": 30452, "ts": "2026-07-18T00:26:26Z", "hours": 1.4753, "text": "So in this devlog, I have set up the project with all of its dependencies, it really can take that long when you’re using C++! Right now I just have a basic testing window, but I will quickly fill it in with a preset of the solar system soon, then I’ll be writing physics code for a while."}]...
|
Title: Perihelion by @superheroyrr | Stardance
De Title: Perihelion by @superheroyrr | Stardance
Devlogs:
So in this devlog, I have set up the project with all of its dependencies, it really can take that long when you’re using C++! Right now I just have a basic testing window, but I will quickly fill it in with a preset of the solar system soon, then I’ll be writing physics code for a while.
So I got this cool C library called adjust.h setup for hot code reloading. This means that I can update the code while it’s running , and the changes show up in real time! I know that I am making this a web app, but because the module doesn’t work on web, I will prototype the app on desktop for now.
I got gravity simulation working! Now the Earth is spinning around the Sun! ㅤ I know you can’t see it in the video I posted, but the Earth is there, it’s just that this simulation is drawn to scale, the Earth would actually barely be visible if you were looking from a spacecraft that far away. ㅤ This took quite a while because of this one really stupid bug: basically I store all the distance values in light minutes rather than kilometers or miles because otherwise those values would be too big. However, the physics equations that I’m using expect the values to be in meters, not light minutes. ㅤ So basically, I forgot to convert from light minutes to meters when calculating the gravity acceleration, so those values were too small to change the velocity of the Earth, causing it to go in a straight line forever. ㅤ But now that that is done, I will start adding the rest of the planets and maybe their moons as well to this simulation, then I can look purely at quality of life improvements to improve the interactivity of it. ㅤ This project is turning out to be easier than I expected! Hopefully another challenge doesn’t pop up…
So in this devlog I’ve done quite a few things to make the overall experience nicer: ㅤ Added a way to pin one object to the center of the screen. Added the Moon and the rest of the planets in the solar system Switched from using light minutes to light seconds for distance measurements because the light minutes values were WAY too small Another annoying bug I had to fix: So there was this bug where the moon would pretty much always just fly out into the abyss as if there was zero gravity applied to it. It was pretty annoying to find out that it because I was using C++‘s float type instead of double . ㅤ What’s the difference? Well basically float gives about 7 decimal points of precision, while double gives about 15. I initially started with float because it is half the memory size of double and in my experience, float gets the job done like 99% of the time. ㅤ However, it turns out I did need more than 7 decimal points. This is because the gravitational force experienced by the Moon is very small, like around 10^-12 (thats 0.(eleven zeroes…)1). Since float can’t hold that value, it just rounded it to zero, causing the moon to fly out in a straight line forever. I’ll be honest, it wasn’t me who figured that out, it was Gemini who did, but pretty much everything else in this devlog was made by me. ㅤ It’s crazy how such a small difference of like 10^-12 can make on a physics engine like this! I hope I don’t have to then switch to C++‘s long double , which has even more precision, that would be insane if I had to go that extreme. I probably would have had to if I didn’t switch from light minutes to light seconds lol.
These past ~2.5 hours have been spent on some quality of life features for the app. Mainly these 3: Made every object 5x bigger than its real life size because it turns out the solar system is such a big place, that you kind of have to. Otherwise everything looks too small. Made it so when you switch between planet it has a quick transition period. Added textures to every planet and the sun. This was actually the hardest part, I had to play around with the settings because it would usually apply the texture sideways, or distort it but I got it working anyways.
For this update, I have done 3 things: Added a small outline circle to distant objects so that they are more visible. made it so you can click inside of these circles or on the planet to zoom into it Added a trail behind each planet.
tbh, I haven’t been working on this a lot over the last few days because of other projects, but now I have. ㅤ Here’s what I got done: A major refactor on the codebase which will make it easier to later add a preset selection screen. A better selector for celestial objects at the bottom of the screen. ㅤ I’ll be honest, I did write most of the code for these with AI (yeah bummer ik, but really, who likes refactoring code on their own?). Although, I was closely inspecting everything it wrote. ㅤ Now the next thing I will do is make the grid warp with the gravitational field strength to represent space-time getting bent.
I have just made the grid in the background warp, representing the curvature of spacetime! ㅤ You will probably notice that the grid is smaller and follows you around if you watch the video. This is because I had to. The grid needs to be about this small, otherwise performance is bad. I could make it bigger by making it more spaced out, only if that’s something people would want though. ㅤ This took waaaaaaay too long since I made a very stupid mistake and C++ decided to harshly punish me for it. Well I did promise not to use AI in the next devlog, but I was dealing with a really weird issue with it for like 1.5 hours and I gave up and asked Claude code about it. So you see that screenshot right (you might need to click the next image button)? That was the solution!!!!! Just add = 0 to that line. ㅤ So basically in C++, if you don’t initialize a variable to a value, as I did there, the value of that variable will then basically be whatever happens to be at that memory address, which will initially be some random number. But as the function runs again and again, it will use that previous value, and later on I was doing y += ... so the y-coordinates of the grid were continuously increasing. ㅤ Visually, it looked like the grid wasn’t being drawn, since the y-value instantly went to a huge number. ㅤ Btw that was the only AI help I got for this part, except for the mathematical formula, which I got from Claude as you can see in the background of the screenshot.
So I fixed some bugs with the warped spacetime grid, and also added a way to add objects to the scene. I haven’t added collision detection yet, so it kind of looks weird but I’ll do that later. ㅤ The reason this took so long is because adding objects kind required a lot of refactoring. Basically, I had to write code for when my objects get copied around, because adding an element to a list in C++ might mean copying it around. This was difficult because raylib is a bit too high level for how it handles these GPU textures and models. ㅤ Now I will add an edit panel to make the new object changeable.
HEEELP!!!! I added a panel to edit the properties of objects, so I decided to add a bunch of mass to Mercury for fun, now the Sun is orbiting Mercury! This is so trippy especially how much it warped spacetime.
So I made it very easy to change the velocity of objects, you can just drag from the cone anywhere now! ㅤ Surprisingly, the hardest part about this was just getting the arrow to draw and also tuning how big it is so that it looks good, but once it was there, it was actually pretty easy to just hook up a click detection. ㅤ Funnily, this 3D library I’m using (Raylib if you’re curious) doesn’t have a builtin “DrawCone()” function. It turns out that to draw a cone, you are supposed to use the DrawCylinder() function and set one of the radiuses to 0! That was really weird to find out.
So I decided to spend a lot of time refining the velocity changing with the mouse. Also did a smaller refactor to make the code look cleaner. ㅤ The main issue I had previously was that it was jittery when the object was far from coordinates (0, 0, 0). It turns out it was another stupid float vs double precision problem in C++. Yes, very similar to what I faced earlier in this project. ㅤ I will admit that I did use AI to find these bugs and fix them, but I was supervising it very closely and testing it thoroughly. I am also starting to see the limits of AI. Claude now decided to flag a bug which didn’t exist, and when I asked it to refactor, it made the code look worse ironically. I ended up having to do that part myself. ㅤ However, AI was still more of a help than a hindrance, so I will still use it throughout this project. If you are curious, the git commits have more detail about these and they are here .
Huzzah! I added a skybox (basically the background image). I will admit that this part was basically AI’d, but it was really hard to do it by myself, since it would have required learning GLSL myself, which I didn’t want to do.
You might be thinking: “So there’s 8 hours in this devlog, surely there are some major visual changes, right?” Well unfortunately no. I meant to post a smaller devlog the day before yesterday, but I forgot about it yesterday. Now here I am cleaning up that mess. I basically did just the following 3 things: ㅤ Added Nerd Font icons to the UI. This took waaay too long (like 2 hours) since I was spending so much time figuring out how to scale specifically those icons, and nothing else and when I did figure it out, they were all of a sudden misaligned, towards the top left compared to regular text, so I had to realign them to be proper. After all of that, it seems like I might need to make my own font icons, since Nerd Font is mainly designed to be put in a coding IDE, not a random app like this. There are some space things which I want icons for, but aren’t available in Nerd Fonts. Oh well, that’s a problem for future me. ㅤ Now here’s the real timesink that made this devlog 8 hours: so I went on a long sidequest to basically implement CSS position property in this C++ UI library. This was mainly so that it would be way easier to position new UI elements. The next devlog will most likely be about adding new settings UI. Along with that, I also wrote a bunch of helper functions to make it even easier to write new UI components. So basically, the UI got a full refactor. ㅤ And finally, using that UI refactor from above, I added a playback controller at the bottom and moved the object selector to the top. Yes, it is an embarrassingly small amount of user facing changes coming out of this 8 hour devlog, but at least my UI code is easier to maintain!
Here’s what I did yesterday: Added a settings editor Added tooltips everywhere Added an intuitive button to deselect the current object
In these 4 hours, I have made the overall experience of switching between objects better by doing these things: Made the camera turn with constant angular speed. Previously, it would sort turn instantly if it needed to make a 180, and then freeze. The camera position is now smoothed out with an easing function instead of linearly moving it Made the grid in the background not jitter when viewing a single planet Set up debugging to work ㅤ The reason this took this long was because for some reason, I was previously using the frame count and a decimal calculated framerate to time out the animations. ㅤ Obviously, mixing decimal numbers with whole numbers wasn’t going to work well, so I had some really weird bugs that sometimes happened and sometimes didn’t. This was literally the motivation for me to setup the debugger! ㅤ Initially I tried to work with the system as it was, but it became tedious fairly quickly, with a lot of if statements, etc. So, I swapped to just using the system time, and it literally just fixed itself almost instantly! That and the code for it ended up being simpler than before! ㅤ The only thing I don’t really like is the grid, and how it kind of jitters, although that will a future problem to solve.
So I added an easy button to make celestial objects orbit another object. To demonstrate this, I recorded a video of me adding 2 moons to Jupiter! I also added a reverse velocity button which is self-explanatory, I didn’t include it in the video because I forgot. I also made it easier to add objects in a previous devlog, but I forgot to include it there.
Here’s what I’ve done: Made it possible to move the flat grid up and down Implemented custom camera controls so that I can better control the experience. This was very difficult at first… until I realized I could just copy paste the code from the library I’m using and just edit that instead 🤦. With this new camera system, I added a feature where you can hold shift and it will slow down for you. More internal refactoring!!! If you’ve been reading my devlogs, you’ll realize that this is like the 5th time or something that I did internal refactoring. To explain, this is my flagship project, as in I’m trying to reach like ~150 hours on this project so that I can get the Framework 13, so I want to take it slowly, so that I can be sure that I can build the features I want to build in an enjoyable manner. This is why I do these things occasionally.
So now you can add objects and change velocities going up and down in the y-axis using up/down arrow keys!! It also shows the flat grid temporarily for these. ㅤ The only thing is that I will probably change how the velocity y-value thing works, because I don’t like it. It’s ironic because that was the thing that took the most amount of time as well.
Now you can change the velocity and lock it to a specific axis!! Also I upgraded to C++23 from C++20. ㅤ Yeah that feature was a real nightmare to implement, with loads of bugs. That stupid float vs double thing came back to bite me again!!!! I swear bro these things annoy me a lot. How do I do this? I also initially had like no idea how this feature should be implemented, I was sitting there thinking and trying code out for a long time. I eventually decided to change the way velocities are changed entirely, now instead of just clicking and dragging, you press V on the keyboard and click with the mouse to confirm. ㅤ Even after that I had a dilemma about how exactly this axis locking feature should be implemented. I was initially going to cast a ray from the mouse and figure out where it is closest to the axis, however it turns out that is math that goes outside of high school altogether, so I had to scrap that. ㅤ Then I decided to open up Blender and see how it does it’s axis locking when you drag 3D objects around. From Blender I got inspiration for how it works in my program. ㅤ So now once you are editing the velocity, you can press X , Y , or Z to change the velocity going in those respective axes if you want. I also figured a much simpler way than that first method I thought of because of the testing with Blender. AI disclaimer Obviously there had to be some bugs with my code. After having spent a bunch of time struggling through writing the code only to reach some weird bugs, I gave up and did turn to AI. ㅤ I carefully supervised it while it tried to fix my code (I do NOT believe in vibe-coding) and it was actually able to fix it alright. I made a suggestion to edit the code to be cleaner and it listened. The ultimate plot twist I then asked it to add that sky-blue line thing. Now here’s the ultimate plot twist, so you know that float vs double precision error that keeps coming back to me? Well in every previous devlog where it happened, it was Claude who pointed out the issue. Well guess what? This time it was me who found it! The issue was with that line and how it was drawn on screen. ㅤ So yeah. That took a very long time, but it was worth it.
I’m back after 2 weeks!!! First I’ll explain why I took a break and then go over what I did in these 3.5 hours. Why I was gone for 2 weeks Basically, I was previously trying to force out 3.5 hours a day to get the FW13 laptop, along with trying to finish this online course so I can get my driver’s license (spending 2 hours a day on that). On top of that I had tuition classes so I can get ahead for next year’s chemistry and math curriculum (probably ~2 hours a day on that). This makes for 8 hours a day of scheduled work. Oh yeah and I wanted to do all of this while still maintaining my health (like going out for a walk everyday and things). ㅤ Obviously, this is a lot of time to commit, but I went ahead with it, thinking of it as a way for me to learn better time management, so that grade 12 will be easy for me. ㅤ However, it turned out to not go the way I thought it would in my mind. You see, no matter what I tried, I just couldn’t get all three of my priorities met. It’s not like a 9-5 job, where you really just have to stay at the office for that timeframe, but then only like 3-4 hours of that is actual focused work. This plan was demanding a full on 8 hours of high focus everyday, which is probably just not possible, without sacrificing too much in my opinion. ㅤ I also realized this was getting in the way my driver’s license and prepping for grade 12, which were probably more important. ㅤ Don’t get me wrong, Stardance is pretty cool and important, but the other 2 things are more important, I think. ㅤ The breaking point came when I finally did reach two of my priorities for 2 days (Stardance and driver’s course). But, it was a very grueling 2 days, and it wasn’t even including anything from tuition. I quickly realized that this was going need a lot more sacrifices than I bargained for. ㅤ So yeah, I took a break. I finished the online course, now I have to do in-car lessons, but the bottleneck for that is now the driving instructor’s availability, now mine. I also tried catching up to the tuition hw (yeah tbh, that didn’t go too well). And I still didn’t touch any of my projects for a bit after that because I was genuinely burnt out. ㅤ But now I’m back! I’m not fully quitting Stardance at all, but now I will work at a slower pace than before. A pace that feels natural to me, rather than forced. Honestly, it might turn out to be the same amount of time as before, just because a bunch of my time has been freed up by finished that driver’s course. But whatever happens, I will finish all of my projects in a way that isn’t so taxing to me mentally and physically. What I actually did in this devlog So for this devlog, I made it so you can edit the velocity using polar coordinates (basically change it via longitude/latitude), as an alternative to x/y/z. ㅤ I initially tried to do this myself by stitching together some math formulas from Reddit, but it didn’t work because I didn’t understand the physics behind them. ㅤ This stuff goes under a field called spherical trigonometry, which is something they don’t usually teach until university math, so I definitely didn’t learn it in grade 11. ㅤ Eventually I gave up and just used Claude to implement the rougher details. However, I have decided to learn a bit of this stuff myself, since it seems like just high school trig but in 3d. Also, because why not!
What would happen if a second Sun randomly spawned in our solar system? Well clearly chaos according to my simulation. So previously, I made a button that automatically sets a velocity so that one object orbits another object, allowing you to easily make planet-moon systems. ㅤ However, what if you wanted to create gravity systems where objects are similar masses, like binary stars, or something like the Pluto-Charon system where clearly they orbit a point outside of each other? ㅤ This is what I set out to implement in this devlog, other than fixing a bug in the spacetime curvature grid where it would jitter around. ㅤ So I’m gonna be honest here, I did basically get AI to do this part for me, that’s not to say I didn’t try at all because I really did. But it turns out this stuff is way outside of high school physics and goes into orbital mechanics. ㅤ I wrote a simple solution which I thought might work, but it didn’t quite. ㅤ So I tried to watch this video to understand how to do it, but couldn’t understand what kind of vector math he was doing. So I basically gave up and got Claude to do it. ㅤ Looking at Claude’s solution, it seems kind of simple in that it’s not using crazy long equations to do things, but at the same time, I don’t think I would have been able to come up with those on my own, so ig it was a good use of AI to speed things up.
First ship is incoming very soon! In these 4 hours spread out across a whole month (I was too busy with school), I got it deployed as a website! ㅤ You can try it out at https://agokule.github.io/perihelion/ . I’m too lazy rn to upload a proper video, so if you can’t figure out how to use the app, check out my other devlogs. Lmk what you think about the app in the comments! Would this be good to ship, or are there still some things you are dying to see before that happens? How was it? Not very nice tbh. A part of me regrets choosing Raylib instead of SDL3 for this project, bc in my experience it was super easy to just port over an SDL3 project to a website. ㅤ Here it was not that easy. I ended fully refactoring the main file (like just rearranging things into different functions) just for it to work the way I wanted. ㅤ In particular the way it handles keyboard/mouse inputs on a website is soooo weird!! You have to check for them at a specific point in your code between two certain functions, which is weird!! ㅤ There were also a lot of weird niche bugs that were so annoying to find, and it turns many of them were with the way Raylib deals with the web, and I only found out because Claude ended up closely reading the source code for these fixes! ㅤ These were mostly minor nitpicks which AI helped me solve. Now, that this thing is almost done I am very glad. It’s like a huge weight has been lifted off my shoulders.
Ships:
What did I make? This is a gravity simulator written in C++. Right now, it only simulates the solar system, but I am planning on adding more to it in later ships. For detailed instructions on how to use it, see the README, but as a TLDR: when your mouse disappears, use the WASD , Shift , and Space keys to move around. To show your cursor, press Esc . Click anywhere to hide it again. Click on a planet’s outline to select it. When it’s selected, you can press V to change its velocity, then you can press X , Y , or Z to lock to the axis, and click with your mouse to confirm. You can also edit its properties in a window. To unselect it, press the × button in the top center Challenges I finished IB SL Physics with a level 7 (highest one possible), so I naively thought all the physics calculations would be easy enough that I could solve them completely alone. Tbh, it was at first, with the actual gravity part just being the F = Gmm/r^2 equation over and over again. However, with my other features like the spacetime curvature grid, and especially the “Orbit eachother” button, those features required things from university level physics and were complicated. So for these specific physics features, I ended up defaulting to AI to write them. Additionally, figuring out 3D graphics was a challenge and for this, AI and the internet were very useful in figuring those out. I am also glad I used Raylib to code this, since it makes 3D graphics much easier than it normally is. Roadmap for future ships I will consider adding the following in future ships: Black Holes Make the planets rotate Presets other than the solar system Optimize the gravity simulation, right now it lags at around 40 objects Add a bunch of the planets’ moons Add collision detection, so you can smash an asteroid at a planet and see what happens Simulate atmosphere of a planet? There’s probably a lot more that I could add as well, feel free to suggest some features when you vote for this project!...
|
1792857346.9778786
|
1792943746.9778786
|
|
67724
|
DQM by @tanzeemrockz | Stardance
|
tanzeemrockz
|
1
|
8.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T20:30:25Z", "hours": 8.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "DQM (Deterministic Query Model) A lightweight, trie-based lookup engine that traverses pre-built JSON “brains”. What is DQM? Instead of using power and resource-hungry, slow LLMs, We can now clear doubts using this lookup engine that walks through a pre-built “brain” ( .tqm format). Try it out: Official Page Overview Why does DQM exist? You may ask, why does DQM exist? The short answer is, accuracy and speed. I was tired of seeing people using AI for the most trivial things — “How hot is the sun? How deep is the sea?”, these are in fact very simple questions and there should’ve been a better alternative. Sure, search engines exist for a reason but many people have stopped using them and moved over to AI — Search engines themselves are starting to implement AI heavily into them. I was tired of it providing wrong answers and making-up stuff that are simply – not real. So now, we have DQM . Our guarantees We guarantee zero-hallucinations, fully predictable, and absolute offline capability. But any community-made brains are not guarenteed these qualities — as they will turn out to be the brain developers’ fault. How it works Step 1 — Normalisation : Lowercases, expands slang/contractions, removes repeated characters that serve no purpose, strips punctuation, and normalises delimiters. Step 2 — Trie Traversal : Splits the normalised queries into tokens and walks through the dictionary nodes. Step 3 — Resolution : Returns the string leaf, picks randomly if the leaf is an array, or throws clear status messages ( Path not found... or Incomplete query... ) The .tqm brain schema Nothing fancy, just good ole JSON Example: { \"brain_id\" : \"custom_core\" , \"version\" : \"1.0.0\" , \"author\" : \"John Doe\" , \"info\" : \"Rocket science, quantum physics, etc...\" , \"description\" : \"Custom brain for Rocket Science and Quantum Physics\" , \"licence\" : \"CC-BY-NC-SA-4.0\" , \"compatibility\" : \">=2.1.0\" , \"routes\" : { ... } } CLI Commands: Interactive brain selector on startup, cls/clear clears the screen, and exit/quit to quit.", "repo": "https://github.com/tanzeemrockz/DQM", "demo": "https://dqm.cyberslayercorpz.dev/"}]...
|
[{"post_id": 80238, "ts": "202 [{"post_id": 80238, "ts": "2026-10-16T20:26:19Z", "hours": 0.9581, "text": "Hey people! I just wrote the README and now, I’m ready to ship. Wish me luck!"}, {"post_id": 80196, "ts": "2026-10-16T17:37:07Z", "hours": 1.1003, "text": "GUYS! I just added a web-demo using python, js, and html using vercel beta python runtime! please do check it out at https://dqm.cyberslayercorpz.dev/"}, {"post_id": 79782, "ts": "2026-10-15T11:59:04Z", "hours": 1.2731, "text": "guys, i just built a web page (html + css + tailwind) for DQM it’s still in localhost but I’m deploying it in a bit (be sure to visit “dqm.cyberslayercorpz.dev”!)"}, {"post_id": 79327, "ts": "2026-10-13T15:20:11Z", "hours": 1.5156, "text": "heyya! I just added more features and bug-fixes. wanna see? :D Changelog (v2.1.0) Added support for external brains (brains to be placed inside /brains directory) Added standard metadata for every .tqm brain Added more aliases Improved the main.tqm brain Added a brain selector (runs on startup) Added a compatibility checker so newer brains don’t break inside an older engine Added a licence checker (cuz why not) Added a startup greeting function (not exactly but it greets you now) Fixed a few syntax issues and bugs I think that’s it! I’m looking forward to making this drastically better and maybe add a webUI or create a webpage so we’ll see! :D"}, {"post_id": 79083, "ts": "2026-10-12T16:21:36Z", "hours": 1.04, "text": "guys, i just fixed a few bugs now. wanna see what i did? :D Changelog (v2.0.1): Fixed punctuation engine in nodes.py Added more aliases Fixed a few things so each leaf has more than one response and use random.choice() to pick one Expanded main.tqm drastically (that was done in the last commit itself but i didn’t write a devlog lol) Resolved issue where if you were outside the project directory, the brain won’t load but now it will. Added more attention to detail and now it shows you info about the brain, etc… I guess that’s it! :D"}, {"post_id": 78331, "ts": "2026-10-10T13:54:28Z", "hours": 0.7672, "text": "guys so i just added a punctuation system that translates “who’s” to “who is” and so on and added a few responses to every tree so if you say “hi” first time it’ll give you a response and the next time, it’ll give you another response by importing random. I have also made the “brain” (main.tqm) HUGE with a LOT of data (the brain was written by gemini so shout out flash 3.8!) and that’s it for now!"}, {"post_id": 78110, "ts": "2026-10-09T16:16:38Z", "hours": 1.5, "text": "Sup folks! So this is the first devlog for this project. This is DQM otherwise known as Deterministic Query Model. So basically this is an old technique where you split a prompt into words and compare against a tree file (.tqm but it’s just a json file lol) and goes thru. E.g. “who is max verstappen” goes thru “who” > “is” > “max” > “verstappen” then finds the answer inside and tells you it. This is all hardcoded and you can change the stuff inside these so-called “brains”. This project is made in python (i’m a newbie and i’m learning along the way) and I used google gemini to write all the “brains” because it’s way too much work for my “potato brain” lol. So python was really sweet and looking forward to adding more features. Cya!"}]...
|
Title: DQM by @tanzeemrockz | Stardance
Devlogs:
Title: DQM by @tanzeemrockz | Stardance
Devlogs:
Sup folks! So this is the first devlog for this project. This is DQM otherwise known as Deterministic Query Model. So basically this is an old technique where you split a prompt into words and compare against a tree file (.tqm but it’s just a json file lol) and goes thru. E.g. “who is max verstappen” goes thru “who” > “is” > “max” > “verstappen” then finds the answer inside and tells you it. This is all hardcoded and you can change the stuff inside these so-called “brains”. This project is made in python (i’m a newbie and i’m learning along the way) and I used google gemini to write all the “brains” because it’s way too much work for my “potato brain” lol. So python was really sweet and looking forward to adding more features. Cya!
guys so i just added a punctuation system that translates “who’s” to “who is” and so on and added a few responses to every tree so if you say “hi” first time it’ll give you a response and the next time, it’ll give you another response by importing random. I have also made the “brain” (main.tqm) HUGE with a LOT of data (the brain was written by gemini so shout out flash 3.8!) and that’s it for now!
guys, i just fixed a few bugs now. wanna see what i did? :D Changelog (v2.0.1): Fixed punctuation engine in nodes.py Added more aliases Fixed a few things so each leaf has more than one response and use random.choice() to pick one Expanded main.tqm drastically (that was done in the last commit itself but i didn’t write a devlog lol) Resolved issue where if you were outside the project directory, the brain won’t load but now it will. Added more attention to detail and now it shows you info about the brain, etc… I guess that’s it! :D
heyya! I just added more features and bug-fixes. wanna see? :D Changelog (v2.1.0) Added support for external brains (brains to be placed inside /brains directory) Added standard metadata for every .tqm brain Added more aliases Improved the main.tqm brain Added a brain selector (runs on startup) Added a compatibility checker so newer brains don’t break inside an older engine Added a licence checker (cuz why not) Added a startup greeting function (not exactly but it greets you now) Fixed a few syntax issues and bugs I think that’s it! I’m looking forward to making this drastically better and maybe add a webUI or create a webpage so we’ll see! :D
guys, i just built a web page (html + css + tailwind) for DQM it’s still in localhost but I’m deploying it in a bit (be sure to visit “dqm.cyberslayercorpz.dev”!)
GUYS! I just added a web-demo using python, js, and html using vercel beta python runtime! please do check it out at https://dqm.cyberslayercorpz.dev/
Hey people! I just wrote the README and now, I’m ready to ship. Wish me luck!
Ships:
DQM (Deterministic Query Model) A lightweight, trie-based lookup engine that traverses pre-built JSON “brains”. What is DQM? Instead of using power and resource-hungry, slow LLMs, We can now clear doubts using this lookup engine that walks through a pre-built “brain” ( .tqm format). Try it out: Official Page Overview Why does DQM exist? You may ask, why does DQM exist? The short answer is, accuracy and speed. I was tired of seeing people using AI for the most trivial things — “How hot is the sun? How deep is the sea?”, these are in fact very simple questions and there should’ve been a better alternative. Sure, search engines exist for a reason but many people have stopped using them and moved over to AI — Search engines themselves are starting to implement AI heavily into them. I was tired of it providing wrong answers and making-up stuff that are simply – not real. So now, we have DQM . Our guarantees We guarantee zero-hallucinations, fully predictable, and absolute offline capability. But any community-made brains are not guarenteed these qualities — as they will turn out to be the brain developers’ fault. How it works Step 1 — Normalisation : Lowercases, expands slang/contractions, removes repeated characters that serve no purpose, strips punctuation, and normalises delimiters. Step 2 — Trie Traversal : Splits the normalised queries into tokens and walks through the dictionary nodes. Step 3 — Resolution : Returns the string leaf, picks randomly if the leaf is an array, or throws clear status messages ( Path not found... or Incomplete query... ) The .tqm brain schema Nothing fancy, just good ole JSON Example: { "brain_id" : "custom_core" , "version" : "1.0.0" , "author" : "John Doe" , "info" : "Rocket science, quantum physics, etc..." , "description" : "Custom brain for Rocket Science and Quantum Physics" , "licence" : "CC-BY-NC-SA-4.0" , "compatibility" : ">=2.1.0" , "routes" : { ... } } CLI Commands: Interactive brain selector on startup, cls/clear clears the screen, and exit/quit to quit....
|
1792857182.185265
|
1792943582.185265
|
|
48643
|
Habit completion predictor by @zico | Stardance
|
zico
|
1
|
40.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T20:26:42Z", "hours": 40.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I just wrapped up the development of the prediction model although i’m yet to implement an auto retraining of model based on users data because i have little data to actually analyse which model would be the best which still leaves the model at the default one trained with synthetic data. Your data are been kept tho and would be trained on when the feature is active and your logs is up to the min requirement", "repo": "https://github.com/young1dev/habit-coach", "demo": "https://habit-coach-beige.vercel.app"}]...
|
[{"post_id": 77294, "ts": "202 [{"post_id": 77294, "ts": "2026-10-06T13:50:41Z", "hours": 3.8983, "text": "I just fixed a server failure for the backend due to duplicate db table. It’s up and running to use now. I’ll be improving feature engineering for the underlyin ML Model after i’ve gathered enough real data. Feel free to check out the project and suggest any changes 😊"}, {"post_id": 48504, "ts": "2026-08-16T21:35:26Z", "hours": 36.3628, "text": "Successfully trained the model with an accuracy of 99% (PSS: That’s because i used synthetic dataset and it wasn’t realistic enough). What i’ve done so far: Feature Engineering: Mapped out features that could be useful in predicting an habit completion and filtered out noise features Created a synthetic dataset for the ML training using Logistic Regression and Decision Tree (Both seemed to work well tho). I tested the ML model with the training dataset and did a mini visual evaluation on the model accuracy and features dependency."}]...
|
Title: Habit completion predictor by @zico | Stard Title: Habit completion predictor by @zico | Stardance
Devlogs:
Successfully trained the model with an accuracy of 99% (PSS: That’s because i used synthetic dataset and it wasn’t realistic enough). What i’ve done so far: Feature Engineering: Mapped out features that could be useful in predicting an habit completion and filtered out noise features Created a synthetic dataset for the ML training using Logistic Regression and Decision Tree (Both seemed to work well tho). I tested the ML model with the training dataset and did a mini visual evaluation on the model accuracy and features dependency.
I just fixed a server failure for the backend due to duplicate db table. It’s up and running to use now. I’ll be improving feature engineering for the underlyin ML Model after i’ve gathered enough real data. Feel free to check out the project and suggest any changes 😊
Ships:
I just wrapped up the development of the prediction model although i’m yet to implement an auto retraining of model based on users data because i have little data to actually analyse which model would be the best which still leaves the model at the default one trained with synthetic data. Your data are been kept tho and would be trained on when the feature is active and your logs is up to the min requirement...
|
1792857381.6839757
|
1792943781.6839757
|
|
67753
|
Personal site V2 by @potipek | Stardance
|
potipek
|
2
|
4.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T20:00:36Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I added Zoho helpdesk for livechat and support (mainly for testing for upcoming website for Dragons World: Legacy) and also made an announcement that DSW is running natively on windows android and ios, it was not released yet tho, you can check the about me section if you want! byeeeee", "repo": "https://github.com/tomk1440-cmyk/personal-site-v2", "demo": "https://www.konopasek.dev"}, {"ship_num": 2, "ts": "2026-10-04T09:53:23Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "My new vebsite has a new style, age counter, basic button and some text animations, multiple categories and much more! It is made to represent me! It has categories “about me” and “my hobbies” It covers a lot of things. I will read almost every feedback so i can know what to improve!", "repo": "https://github.com/tomk1440-cmyk/personal-site-v2", "demo": "https://www.konopasek.dev"}]...
|
[{"post_id": 80228, "ts": "202 [{"post_id": 80228, "ts": "2026-10-16T19:58:21Z", "hours": 0.6669, "text": "Zoho + Announcement, next is going to be progress report on Dragons World: Legacy"}, {"post_id": 76672, "ts": "2026-10-04T09:49:05Z", "hours": 2.6644, "text": "My personal website v2 ship! This website is an upgraded version of my personal site. it’s hosted via cloudflare pages under my domain konopasek.dev. I want to represent myself so that was why I made it! It has a counter that displays my age. Bye!"}]...
|
Title: Personal site V2 by @potipek | Stardance
D Title: Personal site V2 by @potipek | Stardance
Devlogs:
My personal website v2 ship! This website is an upgraded version of my personal site. it’s hosted via cloudflare pages under my domain konopasek.dev. I want to represent myself so that was why I made it! It has a counter that displays my age. Bye!
Zoho + Announcement, next is going to be progress report on Dragons World: Legacy
Ships:
My new vebsite has a new style, age counter, basic button and some text animations, multiple categories and much more! It is made to represent me! It has categories “about me” and “my hobbies” It covers a lot of things. I will read almost every feedback so i can know what to improve!
I added Zoho helpdesk for livechat and support (mainly for testing for upcoming website for Dragons World: Legacy) and also made an announcement that DSW is running natively on windows android and ios, it was not released yet tho, you can check the about me section if you want! byeeeee...
|
1792817418.0989888
|
1792903818.0989888
|
|
29039
|
2d projectile motion by @halit | Stardance
|
halit
|
1
|
13.0
|
121
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T19:26:04Z", "hours": 13.0, "multiplier": 9.67, "payout": 121, "blessing": "neutral", "text": "js wanted to apply projectile physics in an app so i do both studying for school and coding at the same time", "repo": "https://github.com/halithsn2000-lab/physics-sim", "demo": "https://halithsn2000-lab.github.io/physics-sim/2D.html"}]...
|
[{"post_id": 20453, "ts": "202 [{"post_id": 20453, "ts": "2026-07-02T01:35:47Z", "hours": 2.6242, "text": "fixed some bugs and tryed to make it responsive but gave up"}, {"post_id": 20341, "ts": "2026-07-01T22:18:58Z", "hours": 4.5864, "text": "now it supports scaling the X and Y so even is simulation gets big it still fits ur screen , and u can run one or more projectiles after each other with a working scale"}, {"post_id": 19568, "ts": "2026-06-30T22:00:00Z", "hours": 5.3311, "text": "done with the bare logic and display just need to make them look good"}]...
|
Title: 2d projectile motion by @halit | Stardance
Title: 2d projectile motion by @halit | Stardance
Devlogs:
done with the bare logic and display just need to make them look good
now it supports scaling the X and Y so even is simulation gets big it still fits ur screen , and u can run one or more projectiles after each other with a working scale
fixed some bugs and tryed to make it responsive but gave up
Ships:
js wanted to apply projectile physics in an app so i do both studying for school and coding at the same time...
|
1792803038.0088944
|
1792889438.0088944
|
|
63761
|
Todo WinUI by @vilmer_hagelberg | Stardance
|
vilmer_hagelberg
|
1
|
10.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T15:42:38Z", "hours": 10.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is a todo app for windows built in C# with WinUI3. It is very easy to use, works well and has saves the todos.", "repo": "https://github.com/GamerReaper09/WinUI-Todo", "demo": "https://github.com/GamerReaper09/WinUI-Todo/releases/tag/release"}]...
|
[{"post_id": 80172, "ts": "202 [{"post_id": 80172, "ts": "2026-10-16T15:33:49Z", "hours": 1.9189, "text": "Finally done. I made the repo now i just have to do the first ship."}, {"post_id": 76792, "ts": "2026-10-04T16:08:55Z", "hours": 3.2731, "text": "Essentially working now. The add todo is now working and therefore the app is almost done"}, {"post_id": 74932, "ts": "2026-09-28T16:50:02Z", "hours": 1.91, "text": "An early prototype of the app is now working. So far there is only the task list, remove button, and a placeholder add button."}, {"post_id": 73169, "ts": "2026-09-24T15:03:41Z", "hours": 2.58, "text": "I completed microsofts tutorial on how to make a note app. So i now understand the basics and is ready to start making my own program."}, {"post_id": 70623, "ts": "2026-09-19T14:05:36Z", "hours": 0.5856, "text": "I added my first lines of code in the project 🥳🥳"}]...
|
Title: Todo WinUI by @vilmer_hagelberg | Stardance Title: Todo WinUI by @vilmer_hagelberg | Stardance
Devlogs:
I added my first lines of code in the project 🥳🥳
I completed microsofts tutorial on how to make a note app. So i now understand the basics and is ready to start making my own program.
An early prototype of the app is now working. So far there is only the task list, remove button, and a placeholder add button.
Essentially working now. The add todo is now working and therefore the app is almost done
Finally done. I made the repo now i just have to do the first ship.
Ships:
This is a todo app for windows built in C# with WinUI3. It is very easy to use, works well and has saves the todos....
|
1792857115.7715566
|
1792943515.7715566
|
|
65551
|
Profile by @iku_dev | Stardance
|
iku_dev
|
1
|
9.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T15:42:01Z", "hours": 9.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made my own personal site I joined the preanal site challenge and I think I made a got project for my first time. I am really proud of the animations and the general design as when I was making this I had no plan!! I got stuck a lot in this creation, not only knowledge issue but technical as well I did not know the difference between “id” and “class” so when I was labeling it as id I was calling it in CSS as a class so nothing was happening. :( my computer was crushing a lot I was writing 2 animations on one element hence sometimes the would not play I even once forgot to connect the html to CSS -honestly a lot happened and it will get to long to list them To use this web u can either use the online website or run it locally by downloading the files from GitHub and opening the index file !!!This was a really fun experience and I pushed to do as many projects before it closes!!!!", "repo": "https://github.com/ikumedev/MY-PROFILE-hackclub-", "demo": "https://ikumedev.github.io/MY-PROFILE-hackclub-/"}]...
|
[{"post_id": 80155, "ts": "202 [{"post_id": 80155, "ts": "2026-10-16T13:05:04Z", "hours": 3.1633, "text": "I KNOW 3 HOURS IS MAD!!! Okay today is my last day of my website development.:) what i did to day? firstly i made more visually pleasant and fixed a lot of bugs. i add a lot of animations to make it more responsive and overall better. i got help to make the adaptive part of my program but apart from that it was fun!!! i hope you like it as much as i did making it"}, {"post_id": 77414, "ts": "2026-10-06T21:29:16Z", "hours": 2.2919, "text": "As for today!! I cleaned up my website and removed some “over the top effects”:). I stool some sticker’s from hackclub website and animated everything.I add 4 more pages and decorated them All almost done!!!!"}, {"post_id": 76862, "ts": "2026-10-04T21:21:21Z", "hours": 2.9114, "text": "I spent today make making my web look better. But low-key spent most of my time learning css and HTML through vids. :)"}, {"post_id": 73839, "ts": "2026-09-26T04:27:14Z", "hours": 0.6089, "text": "Today I made ! plain html code. First of all am, making my own personal profile-page. So I made the basics parts, sections and random info about my self."}]...
|
Title: Profile by @iku_dev | Stardance
Devlogs:
T Title: Profile by @iku_dev | Stardance
Devlogs:
Today I made ! plain html code. First of all am, making my own personal profile-page. So I made the basics parts, sections and random info about my self.
I spent today make making my web look better. But low-key spent most of my time learning css and HTML through vids. :)
As for today!! I cleaned up my website and removed some “over the top effects”:). I stool some sticker’s from hackclub website and animated everything.I add 4 more pages and decorated them All almost done!!!!
I KNOW 3 HOURS IS MAD!!! Okay today is my last day of my website development.:) what i did to day? firstly i made more visually pleasant and fixed a lot of bugs. i add a lot of animations to make it more responsive and overall better. i got help to make the adaptive part of my program but apart from that it was fun!!! i hope you like it as much as i did making it
Ships:
I made my own personal site I joined the preanal site challenge and I think I made a got project for my first time. I am really proud of the animations and the general design as when I was making this I had no plan!! I got stuck a lot in this creation, not only knowledge issue but technical as well I did not know the difference between “id” and “class” so when I was labeling it as id I was calling it in CSS as a class so nothing was happening. :( my computer was crushing a lot I was writing 2 animations on one element hence sometimes the would not play I even once forgot to connect the html to CSS -honestly a lot happened and it will get to long to list them To use this web u can either use the online website or run it locally by downloading the files from GitHub and opening the index file !!!This was a really fun experience and I pushed to do as many projects before it closes!!!!...
|
1792857144.8548512
|
1792943544.8548512
|
|
68947
|
swarnabindu by @threatsentinels | Stardance
|
threatsentinels
|
1
|
11.0
|
142
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T15:34:50Z", "hours": 11.0, "multiplier": 13.34, "payout": 142, "blessing": "neutral", "text": "This is a patient and vaccination management system for a government health facility in Nepal. This project taught me a lot about building software beyond just making things work , understanding real-world workflows, handling patient records, and making technology practical for the people who use it. Built with Django and PostgreSQL, with plenty more to learn and improve.", "repo": "https://github.com/threatsentinels/swarnabindu", "demo": "https://ahckhotang.ggsrclub.com/"}]...
|
[{"post_id": 80160, "ts": "202 [{"post_id": 80160, "ts": "2026-10-16T14:02:36Z", "hours": 1.6317, "text": "Devlog no 5 In the last 1 hr 37 mintures i worked on polishing the forms and its grids . I now have fully working self inrollment form . I am so close to finishing it ."}, {"post_id": 79702, "ts": "2026-10-15T03:46:48Z", "hours": 1.2564, "text": "DEVLOG NO 4 , in the last 1 hr i wrote the code for base.html and other templates to be used in the site . I have finally locked into a theme i.e. proper nepali government website theme . I have created a navbar and landing page that displays login form for hospital staff and self registration form for patients and it also displays current nepali date that is derived from AD using my custom code ."}, {"post_id": 79288, "ts": "2026-10-13T10:31:53Z", "hours": 2.3172, "text": "DEVLOG NO 3 : I wrote code for database backup . Since this system is going to be used in critical environment of hospital so it requires timely backups and ready to production data . For backups i have created a system for 2 kinds of backup one is on same drive backup and another is external backup . Project will backup the data in another seperate database and in plain json file too ."}, {"post_id": 78662, "ts": "2026-10-11T06:25:05Z", "hours": 1.2083, "text": "Nepal follows different calender from rest of the world that is BIKRAM SAMBAT (BS.) so currently NEPAL is in year 2083 which is 57 year older than AD . Our servers , databases and all other logical engines work in georgian calender so i wrote a code for conversion of BS TO AD AND AD TO BS for seamless no confusion system for users and admins . I used date time functions and other functions to do this work ."}, {"post_id": 78279, "ts": "2026-10-10T08:20:33Z", "hours": 4.2472, "text": "Swarnabindu is a gold infused ayurvedic medicine given to child below 5 years , it is widely practiced in Nepal . When i visited the hospital with my nephew i saw them writing details and medicine records in notebook so i have decided to make one management software them which will allow the workers to enter the details of the patients , add vaccination dates , manage dosage , create reports and other analytical and official work . In the First Phase i have build the project strucutre , tested it and wrote some basic code ."}]...
|
Title: swarnabindu by @threatsentinels | Stardance Title: swarnabindu by @threatsentinels | Stardance
Devlogs:
Swarnabindu is a gold infused ayurvedic medicine given to child below 5 years , it is widely practiced in Nepal . When i visited the hospital with my nephew i saw them writing details and medicine records in notebook so i have decided to make one management software them which will allow the workers to enter the details of the patients , add vaccination dates , manage dosage , create reports and other analytical and official work . In the First Phase i have build the project strucutre , tested it and wrote some basic code .
Nepal follows different calender from rest of the world that is BIKRAM SAMBAT (BS.) so currently NEPAL is in year 2083 which is 57 year older than AD . Our servers , databases and all other logical engines work in georgian calender so i wrote a code for conversion of BS TO AD AND AD TO BS for seamless no confusion system for users and admins . I used date time functions and other functions to do this work .
DEVLOG NO 3 : I wrote code for database backup . Since this system is going to be used in critical environment of hospital so it requires timely backups and ready to production data . For backups i have created a system for 2 kinds of backup one is on same drive backup and another is external backup . Project will backup the data in another seperate database and in plain json file too .
DEVLOG NO 4 , in the last 1 hr i wrote the code for base.html and other templates to be used in the site . I have finally locked into a theme i.e. proper nepali government website theme . I have created a navbar and landing page that displays login form for hospital staff and self registration form for patients and it also displays current nepali date that is derived from AD using my custom code .
Devlog no 5 In the last 1 hr 37 mintures i worked on polishing the forms and its grids . I now have fully working self inrollment form . I am so close to finishing it .
Ships:
This is a patient and vaccination management system for a government health facility in Nepal. This project taught me a lot about building software beyond just making things work , understanding real-world workflows, handling patient records, and making technology practical for the people who use it. Built with Django and PostgreSQL, with plenty more to learn and improve....
|
1792857214.6928701
|
1792943614.6928701
|
|
67480
|
Swordigo_Mario (BETA) by @IsoVoir | Stardance
|
IsoVoir
|
1
|
39.85
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T12:54:28Z", "hours": 37.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "What did you make? I made a beta version of my own 2D fantasy adventure game. I worked on the environments, different pathways, backgrounds, level design, characters and other parts of the game. I tried to make it feel like a real adventure game, where the player can explore different places and face enemies. It is not perfect right now, but I made it with a lot of effort and time. What was challenging? The most challenging part for me was making the pathways and designing the levels. I struggled a lot to get the terrain and backgrounds looking the way I wanted. Sometimes things didn’t work as I expected, and I had to try again and again. Connecting the different parts of the game and fixing enemy attack and behaviour errors was also difficult for me. What are you proud of? I am proud that I didn’t give up even when things were not working properly. I spent a lot of time preparing the different parts of the game and trying to make everything work together. I used AI only for help with fixing some hostile mob behaviour and attack errors, and for converting some images to match the game’s art theme. I wanted to do the main work and understand what I was making instead of just getting the whole game generated. What should people know before trying my project? This is only the beta version, so there are still some flaws and things that need more work. I already know about many of them, and I have plans to improve them in the next updates. For now, I wanted to finish a playable version and share what I have made instead of waiting forever for everything to become perfect. I am going to work on better level design, more improvements and fixing the remaining issues in future updates. Please try my project and share your feedback. And keep an eye on my profile, because I will be working on improving the game in the next updates!", "repo": "https://github.com/kumarishan0825/SwordigoMario", "demo": "https://ishan0825.itch.io/swordigo-mario-beta-version"}]...
|
[{"post_id": 80611, "ts": "202 [{"post_id": 80611, "ts": "2026-10-18T09:30:19Z", "hours": 2.8489, "text": "All the AI art/asset I used in my game has been removed, and my code is now clean totally and the obstacles and character designing i done by my friend so that is why characters and obstacles were nothing used via seeking help with AI and the CODE of this game is really messing part where I dont took help of any kind of AI prompting, I learned and implement every single thing and this took me that much time but yeah without asset prompting and by my own efforts this game is literally took me 28 hours and For asset generation time extends 11 hours more, I honestly confirms my all the working"}, {"post_id": 80127, "ts": "2026-10-16T09:37:30Z", "hours": 6.7131, "text": "Final Devlog: I am so glad that my game is now playable and yeah it have some issues with animations of mobs but it is beta version next time i update it soon…. (1) Adding few Hostile mobs and bosses (2) Adding Winning and Death Scene (3) Fixing 239 errors while coding the nature of mobs but i got too many errors so I used claude AI to examine code that my code were faulty at which point (4)It have few issues like some bugs and some animation problem but i am unable to fix it so I am done here but overall I made it atleast good enough to explore and due to limiting resources and assets I am unable to do the music and sfx works but yeah it looks damn good"}, {"post_id": 79749, "ts": "2026-10-15T08:40:10Z", "hours": 6.2847, "text": "Devlog 10: An amazing timespent on the completion of my level “Castle wars” with its total stages development furnishment completed and only the area node to connect with player and it is finally become playable . , Only things left:- add mobs and bosses, some bizarre obstacles to interact, some beautiful animations, winning and losing scene, settings layout and also…. “volcanic end” development primarily under development and after a update i would publish"}, {"post_id": 79267, "ts": "2026-10-13T08:28:16Z", "hours": 3.2197, "text": "Devlog 9:- Plane Biome- all the stages of this level finally completed…"}, {"post_id": 79126, "ts": "2026-10-12T19:17:44Z", "hours": 2.3897, "text": "Devlog 8: “Level: Plane Biome” all 3 stages’ Background and obstacles work has done…"}, {"post_id": 78642, "ts": "2026-10-11T04:57:54Z", "hours": 4.1283, "text": "Devlog 7: I do massive changes : (i) Added a spell casting animation, (ii) Adding Master and the interaction with my player through Area 2D node and collisionshape2d (iii) Adding damage dealt by playerwhen entity came in his collision shape and connecting it with my left mouse button (iv) Resolving 29 errors and 8 warnings…. Now my code looks very healthy and easy to approachable but from next time and there is no ai usage in code, only pathway obstacle conversion into pixelated form was done by AI, I clearly admited it , I am not going to do things at same time, first i create back ground first in all then later i do some changes according to environment"}, {"post_id": 78138, "ts": "2026-10-09T18:31:53Z", "hours": 2.4664, "text": "Devlog 6: Adding Fighting animation and fixes the debug of jumping animation"}, {"post_id": 77871, "ts": "2026-10-08T16:44:25Z", "hours": 1.8572, "text": "Devlog 5; Working on Heart Dynamics after damage"}, {"post_id": 77579, "ts": "2026-10-07T15:03:52Z", "hours": 2.8178, "text": "Devlog 4: I added the parallax effect and solved some bugs of character falling and few flaws still there but resolves soon and changes some scripts to playable format."}, {"post_id": 77394, "ts": "2026-10-06T19:46:31Z", "hours": 4.3981, "text": "Devlog 3 : I add the protagonist and animate his movement and also work on background theme parallax effect but it failed badly.. Any suggestion to place the character on the static body because mine always falls even i try to resolve but here i get tired"}, {"post_id": 77013, "ts": "2026-10-05T11:20:40Z", "hours": 2.6014, "text": "Devlog 2 : I created a Menu Screen of my game and level scene Screen . Also I implemented the Global script for automated tabs and GdScript for the Menu buttons such as start etc."}, {"post_id": 76418, "ts": "2026-10-03T14:07:09Z", "hours": 0.3294, "text": "Devlog 1 : First time I am getting introduced by Godot engine. I am so excited with this project"}]...
|
Title: Swordigo_Mario (BETA) by @IsoVoir | Stardan Title: Swordigo_Mario (BETA) by @IsoVoir | Stardance
Devlogs:
Devlog 1 : First time I am getting introduced by Godot engine. I am so excited with this project
Devlog 2 : I created a Menu Screen of my game and level scene Screen . Also I implemented the Global script for automated tabs and GdScript for the Menu buttons such as start etc.
Devlog 3 : I add the protagonist and animate his movement and also work on background theme parallax effect but it failed badly.. Any suggestion to place the character on the static body because mine always falls even i try to resolve but here i get tired
Devlog 4: I added the parallax effect and solved some bugs of character falling and few flaws still there but resolves soon and changes some scripts to playable format.
Devlog 5; Working on Heart Dynamics after damage
Devlog 6: Adding Fighting animation and fixes the debug of jumping animation
Devlog 7: I do massive changes : (i) Added a spell casting animation, (ii) Adding Master and the interaction with my player through Area 2D node and collisionshape2d (iii) Adding damage dealt by playerwhen entity came in his collision shape and connecting it with my left mouse button (iv) Resolving 29 errors and 8 warnings…. Now my code looks very healthy and easy to approachable but from next time and there is no ai usage in code, only pathway obstacle conversion into pixelated form was done by AI, I clearly admited it , I am not going to do things at same time, first i create back ground first in all then later i do some changes according to environment
Devlog 8: “Level: Plane Biome” all 3 stages’ Background and obstacles work has done…
Devlog 9:- Plane Biome- all the stages of this level finally completed…
Devlog 10: An amazing timespent on the completion of my level “Castle wars” with its total stages development furnishment completed and only the area node to connect with player and it is finally become playable . , Only things left:- add mobs and bosses, some bizarre obstacles to interact, some beautiful animations, winning and losing scene, settings layout and also…. “volcanic end” development primarily under development and after a update i would publish
Final Devlog: I am so glad that my game is now playable and yeah it have some issues with animations of mobs but it is beta version next time i update it soon…. (1) Adding few Hostile mobs and bosses (2) Adding Winning and Death Scene (3) Fixing 239 errors while coding the nature of mobs but i got too many errors so I used claude AI to examine code that my code were faulty at which point (4)It have few issues like some bugs and some animation problem but i am unable to fix it so I am done here but overall I made it atleast good enough to explore and due to limiting resources and assets I am unable to do the music and sfx works but yeah it looks damn good
All the AI art/asset I used in my game has been removed, and my code is now clean totally and the obstacles and character designing i done by my friend so that is why characters and obstacles were nothing used via seeking help with AI and the CODE of this game is really messing part where I dont took help of any kind of AI prompting, I learned and implement every single thing and this took me that much time but yeah without asset prompting and by my own efforts this game is literally took me 28 hours and For asset generation time extends 11 hours more, I honestly confirms my all the working
Ships:
What did you make? I made a beta version of my own 2D fantasy adventure game. I worked on the environments, different pathways, backgrounds, level design, characters and other parts of the game. I tried to make it feel like a real adventure game, where the player can explore different places and face enemies. It is not perfect right now, but I made it with a lot of effort and time. What was challenging? The most challenging part for me was making the pathways and designing the levels. I struggled a lot to get the terrain and backgrounds looking the way I wanted. Sometimes things didn’t work as I expected, and I had to try again and again. Connecting the different parts of the game and fixing enemy attack and behaviour errors was also difficult for me. What are you proud of? I am proud that I didn’t give up even when things were not working properly. I spent a lot of time preparing the different parts of the game and trying to make everything work together. I used AI only for help with fixing some hostile mob behaviour and attack errors, and for converting some images to match the game’s art theme. I wanted to do the main work and understand what I was making instead of just getting the whole game generated. What should people know before trying my project? This is only the beta version, so there are still some flaws and things that need more work. I already know about many of them, and I have plans to improve them in the next updates. For now, I wanted to finish a playable version and share what I have made instead of waiting forever for everything to become perfect. I am going to work on better level design, more improvements and fixing the remaining issues in future updates. Please try my project and share your feedback. And keep an eye on my profile, because I will be working on improving the game in the next updates!...
|
1792857176.199529
|
1792943576.199529
|
|
69546
|
Esp32-Jammer by @Siyam | Stardance
|
Siyam
|
1
|
5.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T12:38:12Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I have built a noise generator who generates noise in 2.4ghz and jam it. It uses 16000000hz noise to jam, and it has 2x nrf for Vspi and Hspi jamming. it jams all channels needed for Wifi and Bluetooth. I just made it for ethical purpose and only use in my devices, I will never use it with anyone else without permission, i know that its illegal. #Used components, (Main) 2x Nrf24l01 1x 0.96” oled 1x Esp32 c3 zero #Used components (Extra) 1x Capacitor 1x Breadboard and some jumpers", "repo": "https://github.com/Tanzil-Alam/2.4Ghz-Noise-Generator", "demo": ""}]...
|
[{"post_id": 80147, "ts": "202 [{"post_id": 80147, "ts": "2026-10-16T12:19:31Z", "hours": 1.7203, "text": "Finalized the project. added comments in code, fixed all errors in code, tested the feature. And also added another Nrf Module."}, {"post_id": 80126, "ts": "2026-10-16T09:32:30Z", "hours": 0.9658, "text": "I have connected another nrf, but unfortunately, all of the wires got mixed and some of them got short-circuit. i have to fix everything again………."}, {"post_id": 79847, "ts": "2026-10-15T16:34:58Z", "hours": 2.3731, "text": "I have uploaded the code and connected the hardware. I have used Esp32 c3 zero 0.96 inch i2c oled Nrf24l01 radio The jamming is working well, My wifi and Bluetooth is getting noised. But i just made it for ethical use, i will never test on anyone else."}]...
|
Title: Esp32-Jammer by @Siyam | Stardance
Devlogs Title: Esp32-Jammer by @Siyam | Stardance
Devlogs:
I have uploaded the code and connected the hardware. I have used Esp32 c3 zero 0.96 inch i2c oled Nrf24l01 radio The jamming is working well, My wifi and Bluetooth is getting noised. But i just made it for ethical use, i will never test on anyone else.
I have connected another nrf, but unfortunately, all of the wires got mixed and some of them got short-circuit. i have to fix everything again……….
Finalized the project. added comments in code, fixed all errors in code, tested the feature. And also added another Nrf Module.
Ships:
I have built a noise generator who generates noise in 2.4ghz and jam it. It uses 16000000hz noise to jam, and it has 2x nrf for Vspi and Hspi jamming. it jams all channels needed for Wifi and Bluetooth. I just made it for ethical purpose and only use in my devices, I will never use it with anyone else without permission, i know that its illegal. #Used components, (Main) 2x Nrf24l01 1x 0.96” oled 1x Esp32 c3 zero #Used components (Extra) 1x Capacitor 1x Breadboard and some jumpers...
|
1792857107.4915965
|
1792943507.4915965
|
|
69613
|
My web os by @rishith12 | Stardance
|
rishith12
|
2
|
6.0
|
2
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T11:45:11Z", "hours": 1.0, "multiplier": 1.52, "payout": 2, "blessing": "neutral", "text": "I added and extended its features further by adding a fully functional Todo App, Notepad, and a fully functional countdown timer .", "repo": "https://github.com/Rishith88/My_web_OS/", "demo": "https://rishith88.github.io/My_web_OS/"}, {"ship_num": 2, "ts": "2026-10-15T12:34:19Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is the final product, finally done after a lot of hardwork this is a my own web os with a cool cyberpunk there and also teh date and time (IS- Indian Standard Time) with a calculater ,Calendar and a stop watch. The stop watch was teh most difficualt part so i had to refere many youtube tutorials to understand hwo it works but calendar and teh calculater were relatively easy and also the IST time one i had to do some ggogling liek visit otehr wbesite and see how it wokred good leanring for me .It also has a good pop up screen taht vanishes.", "repo": "https://github.com/Rishith88/My_web_OS/", "demo": "https://rishith88.github.io/My_web_OS/"}]...
|
[{"post_id": 80142, "ts": "202 [{"post_id": 80142, "ts": "2026-10-16T11:43:46Z", "hours": 1.2842, "text": "Finally done with my todo app, note pad and the new timer app."}, {"post_id": 79788, "ts": "2026-10-15T12:31:31Z", "hours": 0.6722, "text": "This is the final product guys finally done after a lot of hardwork this is a my own web os with a cool cyberpunk there and also teh date and time (IS- Indian Standard Time) with a calculater ,Calendar and a stop watch"}, {"post_id": 79764, "ts": "2026-10-15T09:35:24Z", "hours": 1.7678, "text": "Stopwatch and a screen timer added broskis less gooooooooo"}, {"post_id": 79618, "ts": "2026-10-14T18:47:30Z", "hours": 1.2136, "text": "Done with my first app guys"}, {"post_id": 79485, "ts": "2026-10-14T08:01:59Z", "hours": 1.0, "text": "My first layout guys less gooooo"}]...
|
Title: My web os by @rishith12 | Stardance
Devlog Title: My web os by @rishith12 | Stardance
Devlogs:
My first layout guys less gooooo
Done with my first app guys
Stopwatch and a screen timer added broskis less gooooooooo
This is the final product guys finally done after a lot of hardwork this is a my own web os with a cool cyberpunk there and also teh date and time (IS- Indian Standard Time) with a calculater ,Calendar and a stop watch
Finally done with my todo app, note pad and the new timer app.
Ships:
This is the final product, finally done after a lot of hardwork this is a my own web os with a cool cyberpunk there and also teh date and time (IS- Indian Standard Time) with a calculater ,Calendar and a stop watch. The stop watch was teh most difficualt part so i had to refere many youtube tutorials to understand hwo it works but calendar and teh calculater were relatively easy and also the IST time one i had to do some ggogling liek visit otehr wbesite and see how it wokred good leanring for me .It also has a good pop up screen taht vanishes.
I added and extended its features further by adding a fully functional Todo App, Notepad, and a fully functional countdown timer ....
|
1792857242.7984047
|
1792943642.7984047
|
|
69540
|
dumb bot by @Aarjav_3 | Stardance
|
Aarjav_3
|
1
|
1.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T08:59:59Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "i made a slack bot that replies to ur commands hosting it on nest was a bit challenging Slack bot hosted 24/7 on Nest. Test with /dumb-bot-ping, /dumb-bot-catfact, and /dumb-bot-help in #bot-spam.", "repo": "https://github.com/aarjavjain-in/slack-bot", "demo": "https://hackclub.com/slack/"}]...
|
[{"post_id": 80118, "ts": "202 [{"post_id": 80118, "ts": "2026-10-16T08:53:24Z", "hours": 0.2736, "text": "deployed slcak bot to nest so tht it can work 24/7"}, {"post_id": 79854, "ts": "2026-10-15T16:52:54Z", "hours": 0.3428, "text": "made a slack bot tht replies to ur commands"}]...
|
Title: dumb bot by @Aarjav_3 | Stardance
Devlogs: Title: dumb bot by @Aarjav_3 | Stardance
Devlogs:
made a slack bot tht replies to ur commands
deployed slcak bot to nest so tht it can work 24/7
Ships:
i made a slack bot that replies to ur commands hosting it on nest was a bit challenging Slack bot hosted 24/7 on Nest. Test with /dumb-bot-ping, /dumb-bot-catfact, and /dumb-bot-help in #bot-spam....
|
1792857098.1769292
|
1792943498.1769292
|
|
68446
|
LumyLamp by @itzdeep2 | Stardance
|
itzdeep2
|
2
|
13.0
|
57
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T07:23:30Z", "hours": 5.0, "multiplier": 6.23, "payout": 31, "blessing": "neutral", "text": "I updated the look from one signle page to multiple pages and added animated css, js…!!! i also made changes what people wanted and i want to thanks them for pointing out some mistakes. if any more feature you like me to add pls feel free to tell..!! Hope You Like it!!!", "repo": "https://github.com/itzdeep2/LumyDesk", "demo": "https://itzdeep2.github.io/LumyDesk/"}, {"ship_num": 2, "ts": "2026-10-09T14:26:32Z", "hours": 8.0, "multiplier": 2.83, "payout": 26, "blessing": "neutral", "text": "I made LumyDesk because I wanted one calm place to study instead of juggling five different apps. It has a pomodoro timer, a to-do list, notes, and a weekly planner where you drag your chapters onto a day. When you tick a chapter off, the calendar and progress graphs update by themselves. The theme also changes on its own depending on the time of day, and turns mint when you’re on a break. Built with plain HTML, CSS and JavaScript, plus Chart.js for the graphs. Everything saves in your browser. I used a little AI to debug and fix bug and also helped my recomend the colours. Thank You for Reviewing Have a Great Day….!!!!", "repo": "https://github.com/itzdeep2/LumyDesk", "demo": "https://itzdeep2.github.io/LumyDesk/"}]...
|
[{"post_id": 79840, "ts": "202 [{"post_id": 79840, "ts": "2026-10-15T16:23:55Z", "hours": 2.1797, "text": "done added calander, timer, todo, notes planner, progress all working…!!!!"}, {"post_id": 79552, "ts": "2026-10-14T15:58:34Z", "hours": 2.8597, "text": "updated the design but some of the buttons is not working and much more progress to make….!!! i will make the buttons work with a great animation and tons of more feature…!!! stay tuned!!!"}, {"post_id": 78074, "ts": "2026-10-09T14:12:14Z", "hours": 2.7003, "text": "added the calander, any many more themes colours with light and dark modes, progress tracker and graph…!!!"}, {"post_id": 78016, "ts": "2026-10-09T06:53:47Z", "hours": 0.7117, "text": "just added progress…!!!! now the graph and calander is left and to make the proegress work i have to implement something which will allow the user to mark a chapter or subject to be completed…!!"}, {"post_id": 77850, "ts": "2026-10-08T15:12:46Z", "hours": 1.0661, "text": "Added a study Planner with complete week plan with drag and drop feature just add the the subject and chapters name and drag it over to the week day to plan. More Feature Comming soon……!!!"}, {"post_id": 77820, "ts": "2026-10-08T12:29:51Z", "hours": 0.5883, "text": "added a Study Planner where we can add the subjects and plan which to study when but to make this system working all together the calander is needed so in next dev blog i will add it… Stay Tuned…..!!!!"}, {"post_id": 77810, "ts": "2026-10-08T11:44:13Z", "hours": 0.6367, "text": "Just added the notes tab with integrated storage so refresh do not delete anything. More Features Adding Soon….!!!"}, {"post_id": 77571, "ts": "2026-10-07T14:46:20Z", "hours": 1.9203, "text": "Added a pomodero Timer with focus, short break and long break embeded, To-do list as well. next i am working on notes and the storage issue which will be sort out soon. so Stay Tuned and any more feature you want just drop a comment or dm me in slack i will try to add that thank you….!!!!"}]...
|
Title: LumyLamp by @itzdeep2 | Stardance
Devlogs: Title: LumyLamp by @itzdeep2 | Stardance
Devlogs:
Added a pomodero Timer with focus, short break and long break embeded, To-do list as well. next i am working on notes and the storage issue which will be sort out soon. so Stay Tuned and any more feature you want just drop a comment or dm me in slack i will try to add that thank you….!!!!
Just added the notes tab with integrated storage so refresh do not delete anything. More Features Adding Soon….!!!
added a Study Planner where we can add the subjects and plan which to study when but to make this system working all together the calander is needed so in next dev blog i will add it… Stay Tuned…..!!!!
Added a study Planner with complete week plan with drag and drop feature just add the the subject and chapters name and drag it over to the week day to plan. More Feature Comming soon……!!!
just added progress…!!!! now the graph and calander is left and to make the proegress work i have to implement something which will allow the user to mark a chapter or subject to be completed…!!
added the calander, any many more themes colours with light and dark modes, progress tracker and graph…!!!
updated the design but some of the buttons is not working and much more progress to make….!!! i will make the buttons work with a great animation and tons of more feature…!!! stay tuned!!!
done added calander, timer, todo, notes planner, progress all working…!!!!
Ships:
I made LumyDesk because I wanted one calm place to study instead of juggling five different apps. It has a pomodoro timer, a to-do list, notes, and a weekly planner where you drag your chapters onto a day. When you tick a chapter off, the calendar and progress graphs update by themselves. The theme also changes on its own depending on the time of day, and turns mint when you’re on a break. Built with plain HTML, CSS and JavaScript, plus Chart.js for the graphs. Everything saves in your browser. I used a little AI to debug and fix bug and also helped my recomend the colours. Thank You for Reviewing Have a Great Day….!!!!
I updated the look from one signle page to multiple pages and added animated css, js…!!! i also made changes what people wanted and i want to thanks them for pointing out some mistakes. if any more feature you like me to add pls feel free to tell..!! Hope You Like it!!!...
|
1792817696.126693
|
1792904096.126693
|
|
11806
|
vsprocessing by @ilovesilverwolf | Stardance
|
ilovesilverwolf
|
1
|
45.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T07:06:26Z", "hours": 45.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "VS Processing is a fork of Code - OSS customized to deliver a near-native browser-based development experience. It adds support for writing, compiling, and running Processing & Java code directly in the browser, plus IntelliSense for all supported languages, a virtual file system, and GitHub integration (pull & push directly to GitHub!) VS Processing is designed specifically for Advanced Placement Computer Science A (AP CSA) classrooms to enable students to develop and run Java/Processing programs without installing any local software. We also found it useful in teaching Java to new members of our FIRST robotics team.", "repo": "https://github.com/CloudTronUSA/vsprocessing", "demo": "https://vsp.cloudtron.us/"}]...
|
[{"post_id": 80098, "ts": "202 [{"post_id": 80098, "ts": "2026-10-16T06:56:42Z", "hours": 6.8725, "text": "added github support - experimental"}, {"post_id": 8687, "ts": "2026-06-14T13:06:32Z", "hours": 2.0592, "text": "added online assignment fetching"}, {"post_id": 7820, "ts": "2026-06-13T01:44:38Z", "hours": 7.47, "text": "added assignments; updated java runtime to support more features, fixed mismatch between official java and our implementation; updated language server; updated vsp ui."}, {"post_id": 7199, "ts": "2026-06-12T00:47:01Z", "hours": 8.7086, "text": "implemented a filesystem that can read and write files from vscode and other places using fetch and java coroutine; fixed processing graphics implementation."}, {"post_id": 6143, "ts": "2026-06-10T10:21:05Z", "hours": 1.4119, "text": "fixed minor issues."}, {"post_id": 6102, "ts": "2026-06-10T08:13:23Z", "hours": 4.5678, "text": "added reference guides; worked on buildding system; deployed to vercel"}, {"post_id": 5463, "ts": "2026-06-09T08:08:26Z", "hours": 8.2408, "text": "added linting, fixed EVIL SAFARI stuff."}, {"post_id": 4645, "ts": "2026-06-08T01:35:19Z", "hours": 5.4681, "text": "optimizing error trace"}]...
|
Title: vsprocessing by @ilovesilverwolf | Stardanc Title: vsprocessing by @ilovesilverwolf | Stardance
Devlogs:
optimizing error trace
added linting, fixed EVIL SAFARI stuff.
added reference guides; worked on buildding system; deployed to vercel
fixed minor issues.
implemented a filesystem that can read and write files from vscode and other places using fetch and java coroutine; fixed processing graphics implementation.
added assignments; updated java runtime to support more features, fixed mismatch between official java and our implementation; updated language server; updated vsp ui.
added online assignment fetching
added github support - experimental
Ships:
VS Processing is a fork of Code - OSS customized to deliver a near-native browser-based development experience. It adds support for writing, compiling, and running Processing & Java code directly in the browser, plus IntelliSense for all supported languages, a virtual file system, and GitHub integration (pull & push directly to GitHub!) VS Processing is designed specifically for Advanced Placement Computer Science A (AP CSA) classrooms to enable students to develop and run Java/Processing programs without installing any local software. We also found it useful in teaching Java to new members of our FIRST robotics team....
|
1792727495.648987
|
1792813895.648987
|
|
68432
|
My WebOS 1 by @ellie_wood | Stardance
|
ellie_wood
|
1
|
7.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T06:36:55Z", "hours": 7.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a webOS styled around a simple and clean rainy vibe. The challenge for this project was just making the decision of what I wanted to do. That along with some of the JS that I had some problem with along the way. Otherwise it was a fun project to make and I am decently happy with how it came out.", "repo": "https://github.com/elliewoodward2024-ops/WebOS", "demo": "https://elliewoodward2024-ops.github.io/WebOS/"}]...
|
[{"post_id": 80073, "ts": "202 [{"post_id": 80073, "ts": "2026-10-16T05:01:59Z", "hours": 1.6408, "text": "Didn’t like the previous design so scrapped it and started again (this is the 5th time I have redesigned so it very well could happen again). Also fixed most of the JS, so the note app and calculator are now both working. Added resizing to the windows as well."}, {"post_id": 80030, "ts": "2026-10-16T01:01:07Z", "hours": 2.7794, "text": "Added some apps/plans for them. I still need to the most of the JS as well as fix most of the styling but slightly better than what I had before."}, {"post_id": 78966, "ts": "2026-10-12T06:43:38Z", "hours": 2.2406, "text": "Ok so that did not go smoothly. Don’t know what happened but brain just was not functioning at all. Absolutely no processing happening in my brain. There were so many stupid errors involved, so I restarted twice… anyway finally got a base at least. I will be adding more and styling later. Looks quite bland at the moment, not the vibes."}]...
|
Title: My WebOS 1 by @ellie_wood | Stardance
Devl Title: My WebOS 1 by @ellie_wood | Stardance
Devlogs:
Ok so that did not go smoothly. Don’t know what happened but brain just was not functioning at all. Absolutely no processing happening in my brain. There were so many stupid errors involved, so I restarted twice… anyway finally got a base at least. I will be adding more and styling later. Looks quite bland at the moment, not the vibes.
Added some apps/plans for them. I still need to the most of the JS as well as fix most of the styling but slightly better than what I had before.
Didn’t like the previous design so scrapped it and started again (this is the 5th time I have redesigned so it very well could happen again). Also fixed most of the JS, so the note app and calculator are now both working. Added resizing to the windows as well.
Ships:
I made a webOS styled around a simple and clean rainy vibe. The challenge for this project was just making the decision of what I wanted to do. That along with some of the JS that I had some problem with along the way. Otherwise it was a fun project to make and I am decently happy with how it came out....
|
1792857197.8897905
|
1792943597.8897905
|
|
66648
|
One Tiny Delivery by @RobbieMa | Stardance
|
RobbieMa
|
1
|
51.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T06:10:10Z", "hours": 51.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is “One Tiny Delivery” made this in around 4 weeks. It is a complete small exploration game about going around delivering packages on an island. The hardest part of this project from a technical perspective would be optimization. I tried all the ways to optimize my game and it finally came out to a steady 100 fps on my laptop. It gave me a lot of new knowledge how Unity renders scenes and how batching and the new resident drawer feature can boost FPS. The hardest thing from a non-technical perspective would be the music. I am NOT a composer, i have no music theory, the only instrument i play is the flute, i don’t know what sounds good or not i can only guess and check. Making this project has been really fun, see yall on the next one!", "repo": "https://github.com/lamp-dude/One-Tiny-Delivery1/", "demo": "https://lamp-dude.itch.io/one-tiny-delivery"}]...
|
[{"post_id": 80063, "ts": "202 [{"post_id": 80063, "ts": "2026-10-16T03:47:25Z", "hours": 1.0853, "text": "BUILDS COMPLETED i had to fix some final build bugs but two builds have finally successfully completed! both windows and mac builds have been uploaded to itch.io!"}, {"post_id": 80032, "ts": "2026-10-16T01:07:06Z", "hours": 3.4142, "text": "FINAL DEVLOG!! THE GAME HAS BEEN BUILT. I built it for both mac and windows and now i am gonna try and see if it can also build on webGL. I have added the following features in these two hours. Pause menu End credits New keybinds Changes to prologue Loading optimization (with some major help using AI to help me figure out how to solve lag spikes)"}, {"post_id": 79982, "ts": "2026-10-15T18:46:10Z", "hours": 1.2328, "text": "Devlog 32: working on menu music, ending music theme variations. after that the project would be completed with just building the game and editing player settings making it ready to be played and published to the public"}, {"post_id": 79723, "ts": "2026-10-15T07:01:25Z", "hours": 0.3736, "text": "Devlog 31 I made it so that the prologue preloads terrain, this why gameplay is smooth and there is no such thing as a loading time! As the player is always doing something. I also made each terrain have it’s own grass renderer so the unnesscary ones dont have to be rendered at the very beginning"}, {"post_id": 79719, "ts": "2026-10-15T06:36:22Z", "hours": 2.58, "text": "Devlog 30: The main menu has been completed with all pages working! i’ve made sure that each resolution works and every button works too. did some fun camera effects for the background then i screenshotted it and added a panel overlay for where the “menu” part resides. I have also added a prologue (that i wont show for spoilers) and an ending. now is just left for the credits!"}, {"post_id": 79679, "ts": "2026-10-15T01:27:49Z", "hours": 1.2225, "text": "Devlog 29 finally added in a driver! finished up prologue (i won’t spoil it) and started on a menu! the second image is the background subject to change. the final few devlogs and this project will be over!"}, {"post_id": 79662, "ts": "2026-10-14T23:46:04Z", "hours": 2.3153, "text": "Devlog 28 The project is like 98% done. all that is left is main menu and ending scene. players can now restart a mission if their load falls off the bed or if they get stuck. I have also added ambient sound zones and more sound effects. various easter eggs have been added, more sound effects, and more polish has been done to the handling of the vehicle. I have also started on the prologue of the game."}, {"post_id": 79644, "ts": "2026-10-14T20:18:39Z", "hours": 1.1378, "text": "Devlog 27 Getting animations in! Maximo is a savior, very easy alsmot drag and drop animations into unity. (of course there more than that but it’s easy for my case) There are more that i won’t spoil! all there is left is to add MUSIC, MENU, ENDING!!!"}, {"post_id": 79622, "ts": "2026-10-14T18:54:44Z", "hours": 2.1094, "text": "Devlog 26 Polish. Polish. Polish. So much polish, bugtesting and just the most fun yet boring parts of the game! I had to do like 9 full run throughs of the game which is really hard because i designed it so that players are gonna have to go slow on the roads to avoid falling off the mountain or loosing the load. I optimized the flowers more, overhauled the dialogue visuals with a new font and animation, and changed some dialogue. The work is very close to being finished!"}, {"post_id": 79538, "ts": "2026-10-14T14:44:50Z", "hours": 0.435, "text": "Devlog 25 Since i can’t track my time on garage band, only 26 minutes for this… but i spent my entire morning completely redoing the theme for the game. it now looks like this and sounds loads better than the other one. It has some simple cords and a simple but pretty melody and i made it a waltz-like piece. This melody is probably gonna be repeated a lot through the game with variations so it’s short, memorable, and easily looped."}, {"post_id": 79465, "ts": "2026-10-14T04:40:49Z", "hours": 1.9589, "text": "Devlog 24 Adding MUSIC to the game! (AND A NEW LOCATION!!) using garage band, i’ve cooked up a theme for the game, the piece is mostly piano and it is very simple with lots of repetition. I’m gonna see if i can use my inner music composing skills to make this sound better and incorporate it into the game somehow. I have also added a new location! the TEMPLE! it acts as the second to last place to stop and offers a great view. This is where the final mission happens. There are a lot of polishing to do before release but i am almost there!"}, {"post_id": 79442, "ts": "2026-10-14T00:41:19Z", "hours": 0.3667, "text": "Devlog 23: The story is almost done! i’ve optimized the systems better and improved some graphics. Look at that fog! isn’t that just absolute eye candy? There are some weird shadow bugs becuase i turned the resolution down but the cell-shading helps a lot with that so it doesnt look TOO bad."}, {"post_id": 79438, "ts": "2026-10-14T00:00:13Z", "hours": 1.1219, "text": "Devlog 22: Working on the story, added a new location, a hiker’s tent half way up the mountain acting as the midpoint for the journey up the mountain. Or i’m thinking of adding a temple thing near the top of the mountain for more variation so the player doesn’t get bored. I have also started to add more deliverables and worked on the story more"}, {"post_id": 79388, "ts": "2026-10-13T19:28:22Z", "hours": 0.3861, "text": "Devlog 21:: More storyline adding! Making the story takes up a lot of time and thinking, i’m trying to make them all feel smoothly integrated and made with care."}, {"post_id": 79350, "ts": "2026-10-13T16:30:07Z", "hours": 1.9183, "text": "Devlog 20: The delivery system is fully completed with my own custom script-writing UI for the editor! Before i had this problem of the editor being REALLY slow due to all the voice lines I have but I have fixed that making script writing much more enjoyable and easy to look at/change things. i have completed the first mission which is very easy and acts like a guide for new players. the cubes are placeholders for actual characters that I will actually import when i get done with the main systems and story."}, {"post_id": 79228, "ts": "2026-10-13T03:40:04Z", "hours": 0.7667, "text": "devlog 19: Revamping the different packages so it isn’t just cubes anymore. First delivery will be apples and apple juice!"}, {"post_id": 79221, "ts": "2026-10-13T02:35:52Z", "hours": 2.1008, "text": "Devlog 18: Almost done with the storyline! Stay tuned! after storyline the game will be mostly complete. The remaining story line will probably take not much time using the system i made to streamline the process. Each delivery is unique but follows the same steps. Start, arrival, return dialogue for both, start new delivery, repeat."}, {"post_id": 79164, "ts": "2026-10-12T21:02:54Z", "hours": 1.2075, "text": "Devlog 18: Working on the story line and FLOWERS!!! The flowers use the same system as the grass does, I just make some different textures (the flowers dont even have stems because it will just spawn on top of the grass that acts like its stem to save performance). I probably have to tune them more so they dont spawn as much on mountains, make them more fluid and natural spawning and not just in circles, and scale them better. It already looks like a huge glowup for the field so that is nice!"}, {"post_id": 78944, "ts": "2026-10-12T03:35:02Z", "hours": 2.6322, "text": "Devlog 17: Optimizations, optimizations, optimizations. that my friends is the summary of what I have done in these near 3 hours. lowering shadow quality, lowering reflection quality, batching, and just testing with a variety of different settings, it finally runs at a stable ~100 fps. before, the terrain were way too detailed, each point of the terrain casting a bunch of very high quality shadows, now, they still cast shadows because i cant lower resolution of the terrain since that would erase the terrain data, BUT i could lower the shadows resolution which gave me a huge performance boost."}, {"post_id": 78890, "ts": "2026-10-11T21:47:58Z", "hours": 1.7333, "text": "Devlog 16: FINALLY COMPLETED THE ROUTE!!! The route is now fully complete from the fields, to the forests, and to the mountains. The journey to the top of this mountain is NOT easy, and would probably require a lot of skill to complete the journey without falling off. Though there is a great award tho… a wonderful view that i will not spoil. Thanks you unity’s additional terrain tools, it wasn’t as hard sculpting roads out of the mountain but it WAS hard getting those roads to be easy for the player to access since the player’s vehicle is quite limited in torque and speed."}, {"post_id": 78780, "ts": "2026-10-11T16:15:18Z", "hours": 0.3667, "text": "Devlog 15: Becuase of the uneven terrain, staying upright is almost impossible say less about keeping the delivery on the bed of the truck! It isn’t supposed to be a ragebait game so I made a feature in the script so that when the player holds down shift, the player will keep grounded and go along with the terrain angles."}, {"post_id": 78519, "ts": "2026-10-11T02:16:52Z", "hours": 1.5433, "text": "Devlog 14 Slowly but surely making my way up the mountain… Terrain sculpting takes so much time!!"}, {"post_id": 78481, "ts": "2026-10-10T22:25:22Z", "hours": 1.2, "text": "Devlog 13: Starting on the ascent to the peak of the mountain! Hopefully all goes well, it is the hardest part of the map design part because of how hard it is to flatten steep hills and cliffs to make it drivable and look natural. The player’s car does not provide a lot of torque so the changes in incline have to be very gradual. I will see how this goes! I have made a lot of progress on the storyline aspect of the game, i made it so players can choose to go on side quests or stick to the main objective whihc takes a shorter amount of time."}, {"post_id": 77733, "ts": "2026-10-08T03:53:57Z", "hours": 2.755, "text": "Devlog 13: I have started making the delivery system script! GOt some basic dialogue interaction system using trigger colliders. I’m going to try to make it really customizable because this is going to be the main gameplay mechanic for the rest of the game. Going on, I won’t leak too much of the story making process, that would kinda ruin it. But there will be updates on all the other stuff!"}, {"post_id": 77423, "ts": "2026-10-06T22:30:18Z", "hours": 1.3033, "text": "Devlog 12: Added a gas station (complete with a great view of the ocean thats probably gonna be covered up with trees in the near future)! And expanded the forest complete with LODs and more optimization features like decreasing shadow distance and quality. how it runs at a locked and stead 60 FPS which should be good for most people,"}, {"post_id": 77181, "ts": "2026-10-05T23:27:51Z", "hours": 2.0072, "text": "Devlog 11 Got some more env design up! I have made a lake a completed the river (maybe in the future i’ll add a waterfall and more branches like a delta) and also made a gravel road! I have also edited the mountains a little so the scale seems bigger and started to plan out possible routes up the mountain! Many more are planned for more possible delivery locations, stay tuned!"}, {"post_id": 76928, "ts": "2026-10-05T03:20:44Z", "hours": 0.7667, "text": "MOUNTAINS!!! Devlog 10 Using unity’s terrain extended tools, I got some very nice looking mountains up in a short amount of time. For painting the cliffs and the snow, I wrote up a custom editor tool to help me paint the grey texture at certain incline angles and to check the altitude and add a noise variation to the snow. Looks pretty nice, the hard part will just be designing the details on it."}, {"post_id": 76885, "ts": "2026-10-04T22:43:39Z", "hours": 2.2297, "text": "Devlog 9 Fixed up the terrain. Unity terrain is a PAIN to get right.. there are so many numbers you can mess up on that gets your terrain data wiped and have to redo it again.. guess what i did. I got the numbers wrong. The map was WAY too big, so I scaled it down. When i scaled it down the resolution was WAY too high (since all of them somehow were auto set to 4k resolution) and CRASHED my laptop with 32gb ram.. Scary times. But i got it over with and now we have a nice little map with in WIP forest"}, {"post_id": 76638, "ts": "2026-10-04T07:28:36Z", "hours": 1.1333, "text": "Devlog 8 Got the rough map layout done! Took me a lot of remakes and editing but the general sizing of it should be the final map’s sizing. It is pretty big, it is 1.5km in length and 1km in width. Thought that ight sound small, the bigness comes from the vehicle speed and i’m tinking of adding lakes, rivers, and a final mountain on this map. It will constantly be editing as I go. I also made a new little cozy area! It will be the first delivery mission destination"}, {"post_id": 76586, "ts": "2026-10-04T02:03:52Z", "hours": 0.9333, "text": "Devlog 7.5 Adding more things and lowering the density of the grass! (Gives an FPS boost ykyk)"}, {"post_id": 76571, "ts": "2026-10-04T00:28:38Z", "hours": 1.2333, "text": "Devlog 7 The making of the starting area! added a house and a path for the player to go through, my idea for this starting point is like a coastal plain, not very rough terrain, fairly easy for players to start off without losing any cargo and designed for them to learn the controls."}, {"post_id": 76047, "ts": "2026-10-02T05:28:06Z", "hours": 0.4, "text": "Devlog 6 added a water shader from a old project and painting terrain! Since I’m using neighboring terrain system from unity, I had to use some clever artistic covering up seams form the previous terrain (since colors weren’t even, they were all handpainted), and flatten each terrain in the terrain inspector. This will allow me to add rivers or lakes or mountains in the future. Pretty cool stuff! The water shader was just taken from a project from 4 years ago, I’m surprised it works without a flaw in Unity 6! Its got simplistic reflections (just planer reflections), waves, color, and foam!"}, {"post_id": 76038, "ts": "2026-10-02T04:41:26Z", "hours": 0.4667, "text": "trying out to see if Unity’s terrain system will suit my needs, I have concluded it does! Trying to get an idea for the map now.."}, {"post_id": 75756, "ts": "2026-09-30T23:52:20Z", "hours": 0.49, "text": "Devlog 5.5 Made the grass system support multiple terrains since I plan on using Unity’s neighboring terrain system to make my big overall map. It grabs each terrain color correctly and the grass appears normally."}, {"post_id": 75465, "ts": "2026-09-30T05:26:11Z", "hours": 1.1458, "text": "Devlog 5 Overhauling terrain and grass! I decided to use the base of a old stylized grass shader I had and repurposed it into a more ghibli-like feel. I made it more optimized by splitting it into chunks and made it blend in with the terrain by removing any light rendering on the grass and made it render after Ambient Occlusion. Now it looks completely blended in with the terrain colors. After adding terrain colors it looks very ghibli-like!"}, {"post_id": 75414, "ts": "2026-09-30T01:00:07Z", "hours": 0.4, "text": "Devlog 4 Graphics update!! Did you know that unity3D has a hidden feature that allows for some awsome out-of-the-box cell shading and outlines? To hide up my bad models in the future, I’m gonna use toon shading and other effects to make my game look more stylized so my models don’t have to be really realistic or high poly. What do you think? Does it look good? Help me out here…"}, {"post_id": 75408, "ts": "2026-09-30T00:21:06Z", "hours": 0.2667, "text": "Devlog 3 We have sound!!! I felt like a good game always needs sound, I avoid sound in most of my other games because I am NOT the best at it. The main thing that hard is seamless looping of audio. I cannot figure it out. After spending some time in the browser, I found some tools that helped me, especially this crossfade adder. After that, I added a simple engine sound system that increases the pitch/speed of the sound as I get faster and faster"}, {"post_id": 75404, "ts": "2026-09-29T23:37:53Z", "hours": 0.5006, "text": "Devlog 2.5 Polished up the camera, angled it for a isometric- perspective view, and just made the overall camera smoother. You can now rotate the camera with your right mouse button! It also smoothly auto rotates if you turn the car every 90 degrees."}, {"post_id": 75082, "ts": "2026-09-29T02:56:41Z", "hours": 1.2917, "text": "Devlog 2 The basic Car Controller is ready! It is a very simple raycast based controller using 3 rays and unity wheel colliders. It works pretty well, no known issues. It works as expected, WASD movement, space is handbrake. Cargo load also works. I also grabbed a old camera controller from another project that had a simlar prespective, I was a bit afraid maybe something changed with the versions because it is a older script from 2022 but it worked perfectly fine with soem fine tuning of vaules!"}, {"post_id": 75033, "ts": "2026-09-28T22:40:52Z", "hours": 0.3667, "text": "Devlog 1 Made the player truck model!! Its a 3 wheeler inspired by a rather italian design I found on google. I’ve changed the design a lot, drawn it on procreate first, then modeled it in blender by myself I am kinda proud of this little thing, I couldn’t track my hours in blender nor procreate which was kinda shame. I’ve since dragged it in unity, and it looks great! NO AI WAS USED!!"}]...
|
Title: One Tiny Delivery by @RobbieMa | Stardance
Title: One Tiny Delivery by @RobbieMa | Stardance
Devlogs:
Devlog 1 Made the player truck model!! Its a 3 wheeler inspired by a rather italian design I found on google. I’ve changed the design a lot, drawn it on procreate first, then modeled it in blender by myself I am kinda proud of this little thing, I couldn’t track my hours in blender nor procreate which was kinda shame. I’ve since dragged it in unity, and it looks great! NO AI WAS USED!!
Devlog 2 The basic Car Controller is ready! It is a very simple raycast based controller using 3 rays and unity wheel colliders. It works pretty well, no known issues. It works as expected, WASD movement, space is handbrake. Cargo load also works. I also grabbed a old camera controller from another project that had a simlar prespective, I was a bit afraid maybe something changed with the versions because it is a older script from 2022 but it worked perfectly fine with soem fine tuning of vaules!
Devlog 2.5 Polished up the camera, angled it for a isometric- perspective view, and just made the overall camera smoother. You can now rotate the camera with your right mouse button! It also smoothly auto rotates if you turn the car every 90 degrees.
Devlog 3 We have sound!!! I felt like a good game always needs sound, I avoid sound in most of my other games because I am NOT the best at it. The main thing that hard is seamless looping of audio. I cannot figure it out. After spending some time in the browser, I found some tools that helped me, especially this crossfade adder. After that, I added a simple engine sound system that increases the pitch/speed of the sound as I get faster and faster
Devlog 4 Graphics update!! Did you know that unity3D has a hidden feature that allows for some awsome out-of-the-box cell shading and outlines? To hide up my bad models in the future, I’m gonna use toon shading and other effects to make my game look more stylized so my models don’t have to be really realistic or high poly. What do you think? Does it look good? Help me out here…
Devlog 5 Overhauling terrain and grass! I decided to use the base of a old stylized grass shader I had and repurposed it into a more ghibli-like feel. I made it more optimized by splitting it into chunks and made it blend in with the terrain by removing any light rendering on the grass and made it render after Ambient Occlusion. Now it looks completely blended in with the terrain colors. After adding terrain colors it looks very ghibli-like!
Devlog 5.5 Made the grass system support multiple terrains since I plan on using Unity’s neighboring terrain system to make my big overall map. It grabs each terrain color correctly and the grass appears normally.
trying out to see if Unity’s terrain system will suit my needs, I have concluded it does! Trying to get an idea for the map now..
Devlog 6 added a water shader from a old project and painting terrain! Since I’m using neighboring terrain system from unity, I had to use some clever artistic covering up seams form the previous terrain (since colors weren’t even, they were all handpainted), and flatten each terrain in the terrain inspector. This will allow me to add rivers or lakes or mountains in the future. Pretty cool stuff! The water shader was just taken from a project from 4 years ago, I’m surprised it works without a flaw in Unity 6! Its got simplistic reflections (just planer reflections), waves, color, and foam!
Devlog 7 The making of the starting area! added a house and a path for the player to go through, my idea for this starting point is like a coastal plain, not very rough terrain, fairly easy for players to start off without losing any cargo and designed for them to learn the controls.
Devlog 7.5 Adding more things and lowering the density of the grass! (Gives an FPS boost ykyk)
Devlog 8 Got the rough map layout done! Took me a lot of remakes and editing but the general sizing of it should be the final map’s sizing. It is pretty big, it is 1.5km in length and 1km in width. Thought that ight sound small, the bigness comes from the vehicle speed and i’m tinking of adding lakes, rivers, and a final mountain on this map. It will constantly be editing as I go. I also made a new little cozy area! It will be the first delivery mission destination
Devlog 9 Fixed up the terrain. Unity terrain is a PAIN to get right.. there are so many numbers you can mess up on that gets your terrain data wiped and have to redo it again.. guess what i did. I got the numbers wrong. The map was WAY too big, so I scaled it down. When i scaled it down the resolution was WAY too high (since all of them somehow were auto set to 4k resolution) and CRASHED my laptop with 32gb ram.. Scary times. But i got it over with and now we have a nice little map with in WIP forest
MOUNTAINS!!! Devlog 10 Using unity’s terrain extended tools, I got some very nice looking mountains up in a short amount of time. For painting the cliffs and the snow, I wrote up a custom editor tool to help me paint the grey texture at certain incline angles and to check the altitude and add a noise variation to the snow. Looks pretty nice, the hard part will just be designing the details on it.
Devlog 11 Got some more env design up! I have made a lake a completed the river (maybe in the future i’ll add a waterfall and more branches like a delta) and also made a gravel road! I have also edited the mountains a little so the scale seems bigger and started to plan out possible routes up the mountain! Many more are planned for more possible delivery locations, stay tuned!
Devlog 12: Added a gas station (complete with a great view of the ocean thats probably gonna be covered up with trees in the near future)! And expanded the forest complete with LODs and more optimization features like decreasing shadow distance and quality. how it runs at a locked and stead 60 FPS which should be good for most people,
Devlog 13: I have started making the delivery system script! GOt some basic dialogue interaction system using trigger colliders. I’m going to try to make it really customizable because this is going to be the main gameplay mechanic for the rest of the game. Going on, I won’t leak too much of the story making process, that would kinda ruin it. But there will be updates on all the other stuff!
Devlog 13: Starting on the ascent to the peak of the mountain! Hopefully all goes well, it is the hardest part of the map design part because of how hard it is to flatten steep hills and cliffs to make it drivable and look natural. The player’s car does not provide a lot of torque so the changes in incline have to be very gradual. I will see how this goes! I have made a lot of progress on the storyline aspect of the game, i made it so players can choose to go on side quests or stick to the main objective whihc takes a shorter amount of time.
Devlog 14 Slowly but surely making my way up the mountain… Terrain sculpting takes so much time!!
Devlog 15: Becuase of the uneven terrain, staying upright is almost impossible say less about keeping the delivery on the bed of the truck! It isn’t supposed to be a ragebait game so I made a feature in the script so that when the player holds down shift, the player will keep grounded and go along with the terrain angles.
Devlog 16: FINALLY COMPLETED THE ROUTE!!! The route is now fully complete from the fields, to the forests, and to the mountains. The journey to the top of this mountain is NOT easy, and would probably require a lot of skill to complete the journey without falling off. Though there is a great award tho… a wonderful view that i will not spoil. Thanks you unity’s additional terrain tools, it wasn’t as hard sculpting roads out of the mountain but it WAS hard getting those roads to be easy for the player to access since the player’s vehicle is quite limited in torque and speed.
Devlog 17: Optimizations, optimizations, optimizations. that my friends is the summary of what I have done in these near 3 hours. lowering shadow quality, lowering reflection quality, batching, and just testing with a variety of different settings, it finally runs at a stable ~100 fps. before, the terrain were way too detailed, each point of the terrain casting a bunch of very high quality shadows, now, they still cast shadows because i cant lower resolution of the terrain since that would erase the terrain data, BUT i could lower the shadows resolution which gave me a huge performance boost.
Devlog 18: Working on the story line and FLOWERS!!! The flowers use the same system as the grass does, I just make some different textures (the flowers dont even have stems because it will just spawn on top of the grass that acts like its stem to save performance). I probably have to tune them more so they dont spawn as much on mountains, make them more fluid and natural spawning and not just in circles, and scale them better. It already looks like a huge glowup for the field so that is nice!
Devlog 18: Almost done with the storyline! Stay tuned! after storyline the game will be mostly complete. The remaining story line will probably take not much time using the system i made to streamline the process. Each delivery is unique but follows the same steps. Start, arrival, return dialogue for both, start new delivery, repeat.
devlog 19: Revamping the different packages so it isn’t just cubes anymore. First delivery will be apples and apple juice!
Devlog 20: The delivery system is fully completed with my own custom script-writing UI for the editor! Before i had this problem of the editor being REALLY slow due to all the voice lines I have but I have fixed that making script writing much more enjoyable and easy to look at/change things. i have completed the first mission which is very easy and acts like a guide for new players. the cubes are placeholders for actual characters that I will actually import when i get done with the main systems and story.
Devlog 21:: More storyline adding! Making the story takes up a lot of time and thinking, i’m trying to make them all feel smoothly integrated and made with care.
Devlog 22: Working on the story, added a new location, a hiker’s tent half way up the mountain acting as the midpoint for the journey up the mountain. Or i’m thinking of adding a temple thing near the top of the mountain for more variation so the player doesn’t get bored. I have also started to add more deliverables and worked on the story more
Devlog 23: The story is almost done! i’ve optimized the systems better and improved some graphics. Look at that fog! isn’t that just absolute eye candy? There are some weird shadow bugs becuase i turned the resolution down but the cell-shading helps a lot with that so it doesnt look TOO bad.
Devlog 24 Adding MUSIC to the game! (AND A NEW LOCATION!!) using garage band, i’ve cooked up a theme for the game, the piece is mostly piano and it is very simple with lots of repetition. I’m gonna see if i can use my inner music composing skills to make this sound better and incorporate it into the game somehow. I have also added a new location! the TEMPLE! it acts as the second to last place to stop and offers a great view. This is where the final mission happens. There are a lot of polishing to do before release but i am almost there!
Devlog 25 Since i can’t track my time on garage band, only 26 minutes for this… but i spent my entire morning completely redoing the theme for the game. it now looks like this and sounds loads better than the other one. It has some simple cords and a simple but pretty melody and i made it a waltz-like piece. This melody is probably gonna be repeated a lot through the game with variations so it’s short, memorable, and easily looped.
Devlog 26 Polish. Polish. Polish. So much polish, bugtesting and just the most fun yet boring parts of the game! I had to do like 9 full run throughs of the game which is really hard because i designed it so that players are gonna have to go slow on the roads to avoid falling off the mountain or loosing the load. I optimized the flowers more, overhauled the dialogue visuals with a new font and animation, and changed some dialogue. The work is very close to being finished!
Devlog 27 Getting animations in! Maximo is a savior, very easy alsmot drag and drop animations into unity. (of course there more than that but it’s easy for my case) There are more that i won’t spoil! all there is left is to add MUSIC, MENU, ENDING!!!
Devlog 28 The project is like 98% done. all that is left is main menu and ending scene. players can now restart a mission if their load falls off the bed or if they get stuck. I have also added ambient sound zones and more sound effects. various easter eggs have been added, more sound effects, and more polish has been done to the handling of the vehicle. I have also started on the prologue of the game.
Devlog 29 finally added in a driver! finished up prologue (i won’t spoil it) and started on a menu! the second image is the background subject to change. the final few devlogs and this project will be over!
Devlog 30: The main menu has been completed with all pages working! i’ve made sure that each resolution works and every button works too. did some fun camera effects for the background then i screenshotted it and added a panel overlay for where the “menu” part resides. I have also added a prologue (that i wont show for spoilers) and an ending. now is just left for the credits!
Devlog 31 I made it so that the prologue preloads terrain, this why gameplay is smooth and there is no such thing as a loading time! As the player is always doing something. I also made each terrain have it’s own grass renderer so the unnesscary ones dont have to be rendered at the very beginning
Devlog 32: working on menu music, ending music theme variations. after that the project would be completed with just building the game and editing player settings making it ready to be played and published to the public
FINAL DEVLOG!! THE GAME HAS BEEN BUILT. I built it for both mac and windows and now i am gonna try and see if it can also build on webGL. I have added the following features in these two hours. Pause menu End credits New keybinds Changes to prologue Loading optimization (with some major help using AI to help me figure out how to solve lag spikes)
BUILDS COMPLETED i had to fix some final build bugs but two builds have finally successfully completed! both windows and mac builds have been uploaded to itch.io!
Ships:
This is “One Tiny Delivery” made this in around 4 weeks. It is a complete small exploration game about going around delivering packages on an island. The hardest part of this project from a technical perspective would be optimization. I tried all the ways to optimize my game and it finally came out to a steady 100 fps on my laptop. It gave me a lot of new knowledge how Unity renders scenes and how batching and the new resident drawer feature can boost FPS. The hardest thing from a non-technical perspective would be the music. I am NOT a composer, i have no music theory, the only instrument i play is the flute, i don’t know what sounds good or not i can only guess and check. Making this project has been really fun, see yall on the next one!...
|
1792857158.891045
|
1792943558.891045
|
|
69443
|
Galaxy-Bot by @Dhruvin_07 | Stardance
|
Dhruvin_07
|
1
|
0.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T05:26:00Z", "hours": 0.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I built GalaxyBot, an interactive 24/7 Slack bot for the Hack Club workspace using Node.js, @slack /bolt, and Slack Socket Mode. What was challenging: Figuring out the 24/7 cloud hosting. I originally planned to host it on Nest, but with queues backed up, I switched to Render. Because Socket Mode doesn’t require public webhook endpoints, Render’s free tier kept going to sleep after 15 minutes. To fix this, I built a lightweight HTTP health-check server alongside Bolt and set up keep-alive monitoring so it never disconnects. What I’m proud of: Getting the bot completely independent from my local machine so it stays alive 24/7 in Hack Club Slack, with instant response times across all 5 slash commands. How to test it in Slack: Run any of these commands in any channel or DM: /dh-ping — Checks bot responsiveness and live timestamp /dh-dice [sides] — Rolls a custom die (try /dh-dice 20) /dh-quote — Fetches a random developer quote /dh-uptime — Shows live container uptime /dh-help — Displays the full command menu", "repo": "https://github.com/Dhruvinp07/galaxy-slackbot", "demo": "https://hackclub.slack.com/archives/C0P5NE354"}]...
|
[{"post_id": 80077, "ts": "202 [{"post_id": 80077, "ts": "2026-10-16T05:18:34Z", "hours": 0.3597, "text": "My bot is online 24/7 anyone can use it in hackclub slack app."}]...
|
Title: Galaxy-Bot by @Dhruvin_07 | Stardance
Devl Title: Galaxy-Bot by @Dhruvin_07 | Stardance
Devlogs:
My bot is online 24/7 anyone can use it in hackclub slack app.
Ships:
I built GalaxyBot, an interactive 24/7 Slack bot for the Hack Club workspace using Node.js, @slack /bolt, and Slack Socket Mode. What was challenging: Figuring out the 24/7 cloud hosting. I originally planned to host it on Nest, but with queues backed up, I switched to Render. Because Socket Mode doesn’t require public webhook endpoints, Render’s free tier kept going to sleep after 15 minutes. To fix this, I built a lightweight HTTP health-check server alongside Bolt and set up keep-alive monitoring so it never disconnects. What I’m proud of: Getting the bot completely independent from my local machine so it stays alive 24/7 in Hack Club Slack, with instant response times across all 5 slash commands. How to test it in Slack: Run any of these commands in any channel or DM: /dh-ping — Checks bot responsiveness and live timestamp /dh-dice [sides] — Rolls a custom die (try /dh-dice 20) /dh-quote — Fetches a random developer quote /dh-uptime — Shows live container uptime /dh-help — Displays the full command menu...
|
1792839012.3815129
|
1792925412.3815129
|
|
30214
|
PANTRY REANTRY by @mikhailnotfish | Stardance
|
mikhailnotfish
|
1
|
32.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T05:14:45Z", "hours": 32.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "THIS is pantry reentry. a game where you throw houshold objects, into the atmosphere. it includes: 8 different objects UNITY HDRP shaders plasma meshes, instead of particles. offline play portability (downloadable .exe) please leave me a good rating, i hope you enjoy the game!", "repo": "https://github.com/mikhailnotfish/pantry-reantry", "demo": "https://mikhailnotfish.itch.io/pantryreentry"}]...
|
[{"post_id": 79726, "ts": "202 [{"post_id": 79726, "ts": "2026-10-15T07:10:17Z", "hours": 1.4983, "text": "pantryReeantry IS FINISHED!!! i have added a settings menu, becuse youre gonna have to download the game, i did some work on github stuff and i uploaded it to itch.io. this has really been a great journy and this MAY be my last project on stardance, because it is ending in about 2 weeks. i hope you like the project! here is a gameplay image of a piano burning up."}, {"post_id": 79235, "ts": "2026-10-13T04:51:52Z", "hours": 2.5872, "text": "ive been working for a while!! so, for the past 2 and a half hours, i have as promised converted the entire project to HDRP, because stock unity looks horrible. i have made a few desicions, including removing the planet entirely and just spawning a blue circle with c#, and removing the particle systems nd swapping them out for PLASMA MESHES! i have made a quick UI using c# here is a image (theres a burning up bean shelf)"}, {"post_id": 78476, "ts": "2026-10-10T22:04:42Z", "hours": 8.5625, "text": "i have decided, that becuse stardance has been extended, i am going to convert pantry reantry, to hdrp!! lit shaders look much better there, and the particles are gonna be volumetric. this game is going to look fabulous! for shipwright: i get whats happening now. how do i have 8 hours? i havent been on unity that much in the past 2 weeks! its because VScode tracks “ple0017’ SO WHENEVER I USE VSCODE, WHATEVER IT MAY BE IM DOING, IT TRACKS HERE. if fraud squad is seeing this you may remove some of these hours, i wasnt vscoding for unity the whole time!!!"}, {"post_id": 46233, "ts": "2026-08-13T10:23:07Z", "hours": 2.3314, "text": "this devlog is a mistake! i accidentally transferred 2 hours via lapse onto this project, instead of youtubeds i accedentally clicked this project. ive gone to help on slack, but the ABSOLUTE CLANKERS there said “there is no way to” like bro why did you reply then"}, {"post_id": 39306, "ts": "2026-08-02T06:11:35Z", "hours": 3.2194, "text": "Today I started replacing the original cube with the first real object in the game: a fridge. Most of the work went into getting the Signed Distance Field (SDF) collider working correctly, since the reentry plasma effect relies on it to collide with the object’s surface instead of passing straight through it.I imported the fridge model, prepared it for Unity, and worked on baking a new SDF that matched its shape. Compared to the simple cube, this was a much better test because the fridge has more detailed geometry, making it a good way to see how well the plasma effect wraps around different objects during reentry.The long-term goal is for every object in the game to have its own mesh, collider, and SDF while still sharing the same reentry system. That means I can eventually swap between things like fridges, pizzas, cars, and other random objects without rebuilding all of the effects each time.Although most of today’s progress happened behind the scenes, it’s an important step toward turning the project into an actual game instead of a simple physics demo. Soon the player will be able to choose what object they want to throw into Earth’s atmosphere and see if it survives the trip."}, {"post_id": 27051, "ts": "2026-07-12T07:45:01Z", "hours": 1.0494, "text": "Today I started working on making the reentry system more flexible by preparing the game for multiple objects instead of just the test cube.I experimented with the idea of making every object its own prefab, allowing things like fridges, pizzas, cars, and other random objects to be thrown into the atmosphere. The plan is to keep the same reentry system, but swap out the mesh, collider, and SDF data for each object so every item has its own way of interacting with the plasma and heat effects.I also looked into making the VFX system more reusable by using one main reentry plasma graph while giving each object its own settings, like different SDF collision shapes and different fire trail styles. This should make adding new objects much faster instead of rebuilding the entire system every time.A big focus today was thinking about the future structure of the game. Instead of one object being launched, the player will eventually be able to choose what they want to send into reentry and see if it survives.The project is starting to move from a physics test into an actual game with different challenges, objects, and replay value."}, {"post_id": 26448, "ts": "2026-07-11T07:59:17Z", "hours": 1.5622, "text": "Today I worked on improving the gameplay loop for Pantry Reantry and focused on making the launch, crash, and respawn systems work properly.I added a respawn button that appears after the object crashes, allowing the player to try again without restarting the game. I also worked on fixing the camera so it doesn’t randomly teleport during resets and stays attached to the player object when needed.A big part of today was debugging the VFX systems. The reentry plasma and fire trail were having issues where they would start at the wrong time or keep existing particles after respawning. I worked on making the atmosphere trigger control when the effects activate, instead of them starting automatically when the object launches.There are still a few small VFX issues to clean up, but the overall reentry loop is coming together. The object can now launch, enter the atmosphere, activate the heat effects, crash, and be reset for another attempt.The next steps are finishing the UI and adding things like altitude, speed, heat, and survival stats to make the reentry experience feel more like a real game."}, {"post_id": 25693, "ts": "2026-07-10T03:41:03Z", "hours": 1.6783, "text": "Today I worked on making the reentry experience. I focused on connecting all the systems together so the player can actually watch an object fall from space and survive (or not survive) the journey.I improved the VFX setup by making the reentry plasma and fire trail activate when the object enters the atmosphere. Instead of having the effects constantly running, they now wait until the object reaches the invisible atmosphere boundary, which makes the transition feel much more realistic.I also fixed the particle behaviour so the smoke and fire trail stays behind the object instead of moving with it. This made a huge difference because the trail now actually looks like something burning through the atmosphere.Another challenge was the camera system. The menu camera and gameplay camera were fighting each other because the follow script was constantly overriding the start button position. I fixed this by making the camera follow system activate only after pressing the start button, allowing the camera to transition into the gameplay view properly.There is still a lot to add, like better destruction effects, heat intensity based on speed, and more detailed atmosphere visuals, but the core reentry sequence is finally starting to come together."}, {"post_id": 25125, "ts": "2026-07-09T04:22:04Z", "hours": 1.3044, "text": "Today I worked on making the reentry system feel way more alive. I focused on getting the heat particles to actually interact with the objects instead of just floating around them. After a bit of experimenting with collisions, SDFs, and VFX Graph, I finally got particles reacting properly with the objects flying through the atmosphere.I also started setting up the systems needed for objects to have their own reentry effects. The goal is that every object falling from space can have its own heat trail that follows it, turns on when it hits the atmosphere, and disappears when it escapes or slows down.A big challenge was making everything follow moving objects correctly. Static effects are easy, but when you have something travelling at high speed, everything needs to stay perfectly synced. I worked on making the particle emitter follow the object and keeping the collision data aligned so the effects don’t lag behind.There is still more to improve, like making the heat intensity change based on speed and adding better visuals, but the foundation is now working. Seeing the particles actually wrap around and react to the objects makes the whole reentry experience feel much more realistic."}, {"post_id": 24481, "ts": "2026-07-08T01:46:35Z", "hours": 0.4189, "text": "so uhh today i continued my work from yesterday, making the reentry plasma, i realized there was no way in history i was gonna make a blender made modular physics based reentry plasma system and tried to make a plasma one normally, using a sphere. long story short, i failed, fell asleep and then gave up 🥀 hopefully ill be back at it later today, if not wait till tomorrow."}, {"post_id": 23950, "ts": "2026-07-07T05:07:52Z", "hours": 2.9003, "text": "Today was mostly about making reentry look and feel a lot cooler. I spent a good chunk of time learning Shader Graph and experimenting until I had a fire effect that looked much more like an object burning through the atmosphere. It took a lot of trial and error, and I had to fix several bugs along the way, but I eventually got everything working together.After that, I added explosions to the game. I learned how to create and use prefabs, then connected them to my reentry system so objects now explode once they get too hot. Seeing random objects burn up and explode while falling toward Earth makes the game feel much more fun than before. There are still plenty of improvements I want to make, like adding better visual effects and making the explosions even more cinematic, but having the whole reentry-to-explosion sequence working is a big milestone.Overall, today was a really productive day. I learned a lot about Unity’s visual effects tools while making the game look much more exciting, and I’m happy with how much progress I made."}, {"post_id": 23413, "ts": "2026-07-06T11:03:08Z", "hours": 1.2431, "text": "Today I worked on improving the reentry and visual effects system for my Unity project, focusing mainly on making the atmosphere interaction feel more cinematic and less “flat prototype.” I spent time testing how the particle system behaves during high-speed descent, especially around the point where the object hits the upper atmosphere. The initial version was too abrupt — the effect would briefly show particles and then disappear, which completely killed the sense of momentum and scale. I experimented with smoothing the transition using gradual intensity changes instead of instant triggers. I also adjusted local offsets and rotation values to better align the effect with the object’s trajectory, since some of the transforms were behaving inconsistently between the inspector and runtime. That took a bit of debugging because some values were being overridden or reset in unexpected ways. After that, I started exploring how to push the visuals further toward a “glowing plasma cone” look, with stronger edge concentration and a softer fade into the surrounding atmosphere. I also began looking into Visual Effect Graph as a possible upgrade path for more advanced GPU-driven effects. Overall, it was a day of fixing broken motion, improving visual flow, and pushing the system closer to something cinematic rather than purely functional."}, {"post_id": 22743, "ts": "2026-07-05T10:08:55Z", "hours": 1.7656, "text": "Today I worked on a space reentry style simulation and spent most of my time getting the gravity and camera systems feeling right. I set up the test object so it’s always pulled toward the planet and rotates to face it as it moves, which makes its motion feel more like it’s actually orbiting and falling through space instead of just drifting around. That part was pretty important because it sets the foundation for everything else. A big chunk of time went into the camera. I tried a bunch of different follow styles because at first it kept jittering, flipping, or ending up in weird positions where I couldn’t even see the planet properly. I went from a basic follow camera, to trying rotation copying, to LookAt setups, and eventually simplified it down to a system where the camera stays in a fixed position relative to the object and just rotates with it in a stable way. After a lot of trial and error (and a few broken camera moments), I ended up with a setup where the object behaves correctly under gravity and the camera stays locked in a consistent orbit view so the planet is always visible and the motion is readable. however i still have issues with the camera and the tetobject that ill b using for ll the objects thrown into the atmosphere so ill probbably fix that tomorrow"}, {"post_id": 21990, "ts": "2026-07-04T06:41:10Z", "hours": 1.9978, "text": "Today I worked on the reentry system for pantry reantry and fixed a bunch of annoying physics bugs, especially the crazy jittering when the ship got far from the origin. I separated the skybox movement from the actual physics so the visuals don’t break anymore at high altitude. Reentry feels way more stable now and doesn’t glitch out when you’re coming in fast. I also tested a few high-speed drops to make sure it doesn’t fall apart. Next up is adding heat damage and making reentry actually dangerous instead of just falling through the atmosphere. i put in a screenshot of the progress on the button and the earth not jittering, it is definitly starting to come together! stay tuned for the second devlog surely coming tomorrow i hope maybe"}]...
|
Title: PANTRY REANTRY by @mikhailnotfish | Stardan Title: PANTRY REANTRY by @mikhailnotfish | Stardance
Devlogs:
Today I worked on the reentry system for pantry reantry and fixed a bunch of annoying physics bugs, especially the crazy jittering when the ship got far from the origin. I separated the skybox movement from the actual physics so the visuals don’t break anymore at high altitude. Reentry feels way more stable now and doesn’t glitch out when you’re coming in fast. I also tested a few high-speed drops to make sure it doesn’t fall apart. Next up is adding heat damage and making reentry actually dangerous instead of just falling through the atmosphere. i put in a screenshot of the progress on the button and the earth not jittering, it is definitly starting to come together! stay tuned for the second devlog surely coming tomorrow i hope maybe
Today I worked on a space reentry style simulation and spent most of my time getting the gravity and camera systems feeling right. I set up the test object so it’s always pulled toward the planet and rotates to face it as it moves, which makes its motion feel more like it’s actually orbiting and falling through space instead of just drifting around. That part was pretty important because it sets the foundation for everything else. A big chunk of time went into the camera. I tried a bunch of different follow styles because at first it kept jittering, flipping, or ending up in weird positions where I couldn’t even see the planet properly. I went from a basic follow camera, to trying rotation copying, to LookAt setups, and eventually simplified it down to a system where the camera stays in a fixed position relative to the object and just rotates with it in a stable way. After a lot of trial and error (and a few broken camera moments), I ended up with a setup where the object behaves correctly under gravity and the camera stays locked in a consistent orbit view so the planet is always visible and the motion is readable. however i still have issues with the camera and the tetobject that ill b using for ll the objects thrown into the atmosphere so ill probbably fix that tomorrow
Today I worked on improving the reentry and visual effects system for my Unity project, focusing mainly on making the atmosphere interaction feel more cinematic and less “flat prototype.” I spent time testing how the particle system behaves during high-speed descent, especially around the point where the object hits the upper atmosphere. The initial version was too abrupt — the effect would briefly show particles and then disappear, which completely killed the sense of momentum and scale. I experimented with smoothing the transition using gradual intensity changes instead of instant triggers. I also adjusted local offsets and rotation values to better align the effect with the object’s trajectory, since some of the transforms were behaving inconsistently between the inspector and runtime. That took a bit of debugging because some values were being overridden or reset in unexpected ways. After that, I started exploring how to push the visuals further toward a “glowing plasma cone” look, with stronger edge concentration and a softer fade into the surrounding atmosphere. I also began looking into Visual Effect Graph as a possible upgrade path for more advanced GPU-driven effects. Overall, it was a day of fixing broken motion, improving visual flow, and pushing the system closer to something cinematic rather than purely functional.
Today was mostly about making reentry look and feel a lot cooler. I spent a good chunk of time learning Shader Graph and experimenting until I had a fire effect that looked much more like an object burning through the atmosphere. It took a lot of trial and error, and I had to fix several bugs along the way, but I eventually got everything working together.After that, I added explosions to the game. I learned how to create and use prefabs, then connected them to my reentry system so objects now explode once they get too hot. Seeing random objects burn up and explode while falling toward Earth makes the game feel much more fun than before. There are still plenty of improvements I want to make, like adding better visual effects and making the explosions even more cinematic, but having the whole reentry-to-explosion sequence working is a big milestone.Overall, today was a really productive day. I learned a lot about Unity’s visual effects tools while making the game look much more exciting, and I’m happy with how much progress I made.
so uhh today i continued my work from yesterday, making the reentry plasma, i realized there was no way in history i was gonna make a blender made modular physics based reentry plasma system and tried to make a plasma one normally, using a sphere. long story short, i failed, fell asleep and then gave up 🥀 hopefully ill be back at it later today, if not wait till tomorrow.
Today I worked on making the reentry system feel way more alive. I focused on getting the heat particles to actually interact with the objects instead of just floating around them. After a bit of experimenting with collisions, SDFs, and VFX Graph, I finally got particles reacting properly with the objects flying through the atmosphere.I also started setting up the systems needed for objects to have their own reentry effects. The goal is that every object falling from space can have its own heat trail that follows it, turns on when it hits the atmosphere, and disappears when it escapes or slows down.A big challenge was making everything follow moving objects correctly. Static effects are easy, but when you have something travelling at high speed, everything needs to stay perfectly synced. I worked on making the particle emitter follow the object and keeping the collision data aligned so the effects don’t lag behind.There is still more to improve, like making the heat intensity change based on speed and adding better visuals, but the foundation is now working. Seeing the particles actually wrap around and react to the objects makes the whole reentry experience feel much more realistic.
Today I worked on making the reentry experience. I focused on connecting all the systems together so the player can actually watch an object fall from space and survive (or not survive) the journey.I improved the VFX setup by making the reentry plasma and fire trail activate when the object enters the atmosphere. Instead of having the effects constantly running, they now wait until the object reaches the invisible atmosphere boundary, which makes the transition feel much more realistic.I also fixed the particle behaviour so the smoke and fire trail stays behind the object instead of moving with it. This made a huge difference because the trail now actually looks like something burning through the atmosphere.Another challenge was the camera system. The menu camera and gameplay camera were fighting each other because the follow script was constantly overriding the start button position. I fixed this by making the camera follow system activate only after pressing the start button, allowing the camera to transition into the gameplay view properly.There is still a lot to add, like better destruction effects, heat intensity based on speed, and more detailed atmosphere visuals, but the core reentry sequence is finally starting to come together.
Today I worked on improving the gameplay loop for Pantry Reantry and focused on making the launch, crash, and respawn systems work properly.I added a respawn button that appears after the object crashes, allowing the player to try again without restarting the game. I also worked on fixing the camera so it doesn’t randomly teleport during resets and stays attached to the player object when needed.A big part of today was debugging the VFX systems. The reentry plasma and fire trail were having issues where they would start at the wrong time or keep existing particles after respawning. I worked on making the atmosphere trigger control when the effects activate, instead of them starting automatically when the object launches.There are still a few small VFX issues to clean up, but the overall reentry loop is coming together. The object can now launch, enter the atmosphere, activate the heat effects, crash, and be reset for another attempt.The next steps are finishing the UI and adding things like altitude, speed, heat, and survival stats to make the reentry experience feel more like a real game.
Today I started working on making the reentry system more flexible by preparing the game for multiple objects instead of just the test cube.I experimented with the idea of making every object its own prefab, allowing things like fridges, pizzas, cars, and other random objects to be thrown into the atmosphere. The plan is to keep the same reentry system, but swap out the mesh, collider, and SDF data for each object so every item has its own way of interacting with the plasma and heat effects.I also looked into making the VFX system more reusable by using one main reentry plasma graph while giving each object its own settings, like different SDF collision shapes and different fire trail styles. This should make adding new objects much faster instead of rebuilding the entire system every time.A big focus today was thinking about the future structure of the game. Instead of one object being launched, the player will eventually be able to choose what they want to send into reentry and see if it survives.The project is starting to move from a physics test into an actual game with different challenges, objects, and replay value.
Today I started replacing the original cube with the first real object in the game: a fridge. Most of the work went into getting the Signed Distance Field (SDF) collider working correctly, since the reentry plasma effect relies on it to collide with the object’s surface instead of passing straight through it.I imported the fridge model, prepared it for Unity, and worked on baking a new SDF that matched its shape. Compared to the simple cube, this was a much better test because the fridge has more detailed geometry, making it a good way to see how well the plasma effect wraps around different objects during reentry.The long-term goal is for every object in the game to have its own mesh, collider, and SDF while still sharing the same reentry system. That means I can eventually swap between things like fridges, pizzas, cars, and other random objects without rebuilding all of the effects each time.Although most of today’s progress happened behind the scenes, it’s an important step toward turning the project into an actual game instead of a simple physics demo. Soon the player will be able to choose what object they want to throw into Earth’s atmosphere and see if it survives the trip.
this devlog is a mistake! i accidentally transferred 2 hours via lapse onto this project, instead of youtubeds i accedentally clicked this project. ive gone to help on slack, but the ABSOLUTE CLANKERS there said “there is no way to” like bro why did you reply then
i have decided, that becuse stardance has been extended, i am going to convert pantry reantry, to hdrp!! lit shaders look much better there, and the particles are gonna be volumetric. this game is going to look fabulous! for shipwright: i get whats happening now. how do i have 8 hours? i havent been on unity that much in the past 2 weeks! its because VScode tracks “ple0017’ SO WHENEVER I USE VSCODE, WHATEVER IT MAY BE IM DOING, IT TRACKS HERE. if fraud squad is seeing this you may remove some of these hours, i wasnt vscoding for unity the whole time!!!
ive been working for a while!! so, for the past 2 and a half hours, i have as promised converted the entire project to HDRP, because stock unity looks horrible. i have made a few desicions, including removing the planet entirely and just spawning a blue circle with c#, and removing the particle systems nd swapping them out for PLASMA MESHES! i have made a quick UI using c# here is a image (theres a burning up bean shelf)
pantryReeantry IS FINISHED!!! i have added a settings menu, becuse youre gonna have to download the game, i did some work on github stuff and i uploaded it to itch.io. this has really been a great journy and this MAY be my last project on stardance, because it is ending in about 2 weeks. i hope you like the project! here is a gameplay image of a piano burning up.
Ships:
THIS is pantry reentry. a game where you throw houshold objects, into the atmosphere. it includes: 8 different objects UNITY HDRP shaders plasma meshes, instead of particles. offline play portability (downloadable .exe) please leave me a good rating, i hope you enjoy the game!...
|
1792806688.7054882
|
1792893088.7054882
|
|
58963
|
MindState by @RudranshShukla | Stardance
|
RudranshShukla
|
1
|
26.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T04:28:02Z", "hours": 26.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Built MindState, an open platform where young people can share their stories, express themselves, and feel heard. I worked on the UI/UX and development, building features like articles, journaling, mood tracking, community contributions, and more. The biggest challenge was making everything feel simple and welcoming while handling user data carefully, especially since the platform deals with mental health. V1 is now ready, and we’re still fixing bugs and improving things. I’d love for you to explore the platform, test its features, and share any feedback or bugs you find. Still a lot to build, but excited about how far we’ve come!", "repo": "https://github.com/rudranshshuklaofficial/mindstate-public", "demo": "https://mindstate.space"}]...
|
[{"post_id": 79611, "ts": "202 [{"post_id": 79611, "ts": "2026-10-14T18:19:05Z", "hours": 1.5869, "text": "Final bugs solving and UI refining is done! Shipping the project."}, {"post_id": 79483, "ts": "2026-10-14T07:50:31Z", "hours": 3.1431, "text": "Finally finished everything, soon gonna add the github repo and publish the platform without any bugs!"}, {"post_id": 78948, "ts": "2026-10-12T04:55:36Z", "hours": 3.5111, "text": "Made a wholesale amount of changes and fixes in the platform, though I cannot add all in here, I’ll keep y’all updated and will soon drop the github!"}, {"post_id": 78713, "ts": "2026-10-11T11:57:45Z", "hours": 18.2133, "text": "I’ve been working on MindState, a platform I’m helping build to support young people’s mental health and encourage civic engagement. Today I worked on the website, fixed some bugs, improved parts of the design, and set up email verification for user accounts. There’s still a lot to build, but it’s exciting to see everything slowly come together!"}]...
|
Title: MindState by @RudranshShukla | Stardance
D Title: MindState by @RudranshShukla | Stardance
Devlogs:
I’ve been working on MindState, a platform I’m helping build to support young people’s mental health and encourage civic engagement. Today I worked on the website, fixed some bugs, improved parts of the design, and set up email verification for user accounts. There’s still a lot to build, but it’s exciting to see everything slowly come together!
Made a wholesale amount of changes and fixes in the platform, though I cannot add all in here, I’ll keep y’all updated and will soon drop the github!
Finally finished everything, soon gonna add the github repo and publish the platform without any bugs!
Final bugs solving and UI refining is done! Shipping the project.
Ships:
Built MindState, an open platform where young people can share their stories, express themselves, and feel heard. I worked on the UI/UX and development, building features like articles, journaling, mood tracking, community contributions, and more. The biggest challenge was making everything feel simple and welcoming while handling user data carefully, especially since the platform deals with mental health. V1 is now ready, and we’re still fixing bugs and improving things. I’d love for you to explore the platform, test its features, and share any feedback or bugs you find. Still a lot to build, but excited about how far we’ve come!...
|
1792777759.3282952
|
1792864159.3282952
|
|
69430
|
My very own WebOS by @kevgar1810 | Stardance
|
kevgar1810
|
1
|
4.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T01:25:54Z", "hours": 4.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made this to see if stuff like this is something I want to continue or do", "repo": "https://github.com/kevgar1810-design/OS", "demo": "https://kevgar1810-design.github.io/OS/"}]...
|
[{"post_id": 80035, "ts": "202 [{"post_id": 80035, "ts": "2026-10-16T01:18:37Z", "hours": 0.9983, "text": "I finished the note taking app i am finished with my os for now"}, {"post_id": 79666, "ts": "2026-10-15T00:43:50Z", "hours": 0.9072, "text": "Im working on getting an app started although i am having troubles with the fragging and closing function i need help"}, {"post_id": 79440, "ts": "2026-10-14T00:23:33Z", "hours": 1.0311, "text": "I added a drag function and made it so you can close and open the window"}, {"post_id": 79204, "ts": "2026-10-13T01:03:07Z", "hours": 1.0797, "text": "I created a background,enter,screen and working clock element."}]...
|
Title: My very own WebOS by @kevgar1810 | Stardanc Title: My very own WebOS by @kevgar1810 | Stardance
Devlogs:
I created a background,enter,screen and working clock element.
I added a drag function and made it so you can close and open the window
Im working on getting an app started although i am having troubles with the fragging and closing function i need help
I finished the note taking app i am finished with my os for now
Ships:
I made this to see if stuff like this is something I want to continue or do...
|
1792821298.718517
|
1792907698.718517
|
|
67952
|
Personal Website by @daval | Stardance
|
daval
|
1
|
5.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-16T00:04:09Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I completed the Personal Site mission. I made a personal website with zero AI, right now it’s only one page, but I am planning on adding a lot more, specially using the code I made to connect with Last.fm, and adding my Digital Portfolio would be cool. I really enjoyed the flashcard theme, I didn’t know there was a way to make something look 3D in HTML before, guess we learn something new each day.", "repo": "https://github.com/davalanisv1/daval", "demo": "https://davalanisv1.github.io/daval/index.html"}]...
|
[{"post_id": 80017, "ts": "202 [{"post_id": 80017, "ts": "2026-10-16T00:01:47Z", "hours": 1.4389, "text": "Added a bunch of stuff, like a grid system that organizes the flashcards better. I made the flashcards change sizes depending on the content inside them, and then made the flashcards be the same size as the biggest card. Added some particles in the back along with animations in the navigation tab (making the links lighten up when hovered)"}, {"post_id": 78899, "ts": "2026-10-11T23:06:22Z", "hours": 3.8836, "text": "Rest is for the weak I got started on a less formal website, I’ll probably use this one for like, social media and stuff, and keep the first one for more profesional environments… I’ll have to adapt it though, maybe change the pictures and information in it… Whatever. This time I’m going for a more playful style, my Physics test is coming in two days, so I was doing some flashcards, hence the idea, the hardest part was definetly making the flashcards flip when hovered on and making the lines align with the text. I did not use AI! (except for debugging because I’m too lazy to do that myself) but after a bunch of Youtube tutorials and a couple Wikihow searches I managed to do this by hand!"}]...
|
Title: Personal Website by @daval | Stardance
Dev Title: Personal Website by @daval | Stardance
Devlogs:
Rest is for the weak I got started on a less formal website, I’ll probably use this one for like, social media and stuff, and keep the first one for more profesional environments… I’ll have to adapt it though, maybe change the pictures and information in it… Whatever. This time I’m going for a more playful style, my Physics test is coming in two days, so I was doing some flashcards, hence the idea, the hardest part was definetly making the flashcards flip when hovered on and making the lines align with the text. I did not use AI! (except for debugging because I’m too lazy to do that myself) but after a bunch of Youtube tutorials and a couple Wikihow searches I managed to do this by hand!
Added a bunch of stuff, like a grid system that organizes the flashcards better. I made the flashcards change sizes depending on the content inside them, and then made the flashcards be the same size as the biggest card. Added some particles in the back along with animations in the navigation tab (making the links lighten up when hovered)
Ships:
I completed the Personal Site mission. I made a personal website with zero AI, right now it’s only one page, but I am planning on adding a lot more, specially using the code I made to connect with Last.fm, and adding my Digital Portfolio would be cool. I really enjoyed the flashcard theme, I didn’t know there was a way to make something look 3D in HTML before, guess we learn something new each day....
|
1792857185.3541932
|
1793721185.3541932
|
|
62333
|
Time-Bridge by @AidenHammy | Stardance
|
AidenHammy
|
1
|
7.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T20:05:18Z", "hours": 7.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I finally shipped TimeBridge, a Chrome extension I built to solve a problem I have every single day. Doing mental math for timezone scheduling while typing in chat apps. Not just for me but every remote worker knows the pain. You type “let’s call tomorrow at 3pm” in Slack. Then you stop, open a new tab, plug it into a timezone converter, figure out what time that is in Tokyo and come back to type it. Undoubtedly it does break your flow. TimeBridge fixes this by living right inside your chat box. Instead of bouncing between Slack and a timezone converter, TimeBridge uses natural language processing to read what you’re typing. When it sees a time phrase, it quietly drops a little clock icon next to your text box. You click it and it tells you what time that is for your contacts. Why it’s different: Passive UI: It doesn’t shout at you. Well, don’t take it literally. It’s just a quiet 26px clock icon you can click or ignore. Real language: Understands phrases like “next Tuesday at noon” or “in 2 hours” using natural language parsing. Privacy-first: It doesn’t run on every website. It defaults to an allowlist (Slack, WhatsApp, Gmail) that you control.", "repo": "https://github.com/AidenHammy/timeBridge", "demo": "https://github.com/AidenHammy/timeBridge/releases/tag/v1.0.0"}]...
|
[{"post_id": 79991, "ts": "202 [{"post_id": 79991, "ts": "2026-10-15T19:59:39Z", "hours": 0.7172, "text": "Logging the leftover time that got caught up during the project maintenance and finalization"}, {"post_id": 79980, "ts": "2026-10-15T18:42:52Z", "hours": 1.4169, "text": "Devlog #3: Playing Nice (Allowlists & Passive UI) The core loop works. So you type a time, the badge pops up and it tells you what time it is for your contact. But after using it for a few days, two massive problems became obvious: it was running everywhere and it was too loud. Here’s how I fixed the extension to play nice with your browsing experience. Problem 1: The “Everywhere” Problem Originally, the manifest was set to <all_urls> . This meant the content script was injecting itself into every single page you visited. Your banking site, Reddit, random blogs. Even if the badge didn’t pop up, the event listeners were running on every text box on the internet which felt invasive and heavy. So I added an enabledSites list to chrome.storage.local . The extension now defaults to only running on whatsapp.com, slack.com and mail.google.com. I also updated the popup UI. If you want to add a new site (like discord.com), you can either type it manually in the popup or just hit the “+ Add current site” button which grabs the URL of the tab you’re currently looking at. The content script listens to storage changes so if you add a site, the extension instantly activates on that tab and no reload is required. Problem 2: The Noise Problem The badge was a full card which activated whenever you typed a time or date, a giant dark tooltip would expand below your text box. If you were just typing a normal message that happened to include a time, the UI was visually shouting at you. SO I shrunk the UI down to a tiny 26x26 pixel clock icon (🕐). It still appears when you type a time phrase but it stays out of your way. If you actually want to see the conversion, you click the icon and the full panel expands. If you click away, it collapses back to the icon. It’s much less stressful to type with!"}, {"post_id": 79846, "ts": "2026-10-15T16:32:13Z", "hours": 2.755, "text": "Devlog #2: The Core Loop The skeleton is alive, the real-world quirks are patched and the timezone picker doesn’t suck anymore. But how does it actually feel to use? Here’s how it works. You add a contact and the extension detects the time for them right where you’re typing. Step 1: Telling TimeBridge who you know When you click the extension icon, the popup opens. That right there is your contact book. Before, I was using a native <select> dropdown for the timezones which meant scrolling through 418 IANA zones which was terrible. Now, it’s a custom search-as-you-type combobox. You just type a name (like “Jean”) then start typing a country, city or abbreviation in the timezone box. If you type “Europe” the combobox instantly surfaces the available results because of the alias map I added. It still needs to be refined since it doesn’t yet contain ALL of the timezones. Also when you hit Enter and click “Add Contact”, it saves to chrome.storage.local , Jean now shows up in your list with her current local time updating live. Step 2: Typing in the wild Now you head over to Gmail, Slack web or Twitter, anywhere with a text box. You start typing a message, lets say “Let’s sync tomorrow at 3pm” Behind the scenes, it works like this: The Listener: A content script is running on the page. It’s using a single delegated document.addEventListener in the capture phase. This means it catches your typing whether you’re in a plain , a rich text with nested formatting spans or even a contact form embedded in an iframe. The Debounce: It doesn’t parse on every single keystroke (that would lag the browser). It uses a 250ms debounce. When you pause typing for a quarter of a second, it grabs the text. The Parser: It passes that text to chrono-node, the parsing library I bundled. Chrono looks at the phrase “tomorrow at 3pm” and figures out what “tomorrow” actually is based on today’s date and spits out an actual Date object. Step 3: The Badge If Chrono finds a time, the extension builds a floating, dark-colored tooltip (the badge) and injects it right below the text box you’re typing in. The badge does three things: It shows you the exact phrase it detected: “tomorrow at 3pm” It grabs the last contact you used (in this case, Jean) and automatically converts that 3pm time into her local time, displaying it right there. It gives you a dropdown. If you actually meant to schedule this with a different contact, you can switch the dropdown right in the badge and it recalculates the time instantly. One of the most annoying things to figure out was what happens when you hit Enter. On Slack or WhatsApp, Enter sends the message and clears the text box immediately. Because of my 250ms debounce, the extension was occasionally showing the badge after the message was already sent, making it float over an empty text box. The fix was adding a specific keydown listener. If you hit enter (without shift), the extension kills the debounce timer and hides the badge instantly which means no more ghost badges"}, {"post_id": 79289, "ts": "2026-10-13T10:33:20Z", "hours": 2.2542, "text": "Devlog #1: Getting TimeBridge Off the Ground Spent the weekend building the first version of TimeBridge, a small Chrome extension aimed at making timezone coordination less of a headache. The idea is to detect time references as you type and eventually let you convert them to your contacts’ local times without doing the math yourself. I started with two core features. A popup contact book that saves names and timezones using chrome.storage.local and a live text parser powered by chrono-node . The popup displays contacts’ local times while the parser detects phrases like “let’s call tomorrow at 3pm” using a debounced content script. I also used the browser’s native Intl.supportedValuesOf(\"timeZone\") API to populate the timezone list instead of maintaining one manually and bundled only the English parser to bring its size down from around 400 KB to 100 KB but getting everything to run turned out to be its own challenge. Chrome refused to load the extension because the bundled parser file was missing and regenerating it exposed an empty package.json that caused npm to throw an EJSONPARSE error. After fixing the dependencies, rebuilding the bundle with esbuild and correcting the script order in the manifest, the extension finally loaded. I also had to enable file URL access in Chrome before my local test page would work with the content script. The skeleton is alive and well, the contacts persist, local times update and time expressions are detected as I type. There’s no UI for the parser yet so everything still goes to the console"}]...
|
Title: Time-Bridge by @AidenHammy | Stardance
Dev Title: Time-Bridge by @AidenHammy | Stardance
Devlogs:
Devlog #1: Getting TimeBridge Off the Ground Spent the weekend building the first version of TimeBridge, a small Chrome extension aimed at making timezone coordination less of a headache. The idea is to detect time references as you type and eventually let you convert them to your contacts’ local times without doing the math yourself. I started with two core features. A popup contact book that saves names and timezones using chrome.storage.local and a live text parser powered by chrono-node . The popup displays contacts’ local times while the parser detects phrases like “let’s call tomorrow at 3pm” using a debounced content script. I also used the browser’s native Intl.supportedValuesOf("timeZone") API to populate the timezone list instead of maintaining one manually and bundled only the English parser to bring its size down from around 400 KB to 100 KB but getting everything to run turned out to be its own challenge. Chrome refused to load the extension because the bundled parser file was missing and regenerating it exposed an empty package.json that caused npm to throw an EJSONPARSE error. After fixing the dependencies, rebuilding the bundle with esbuild and correcting the script order in the manifest, the extension finally loaded. I also had to enable file URL access in Chrome before my local test page would work with the content script. The skeleton is alive and well, the contacts persist, local times update and time expressions are detected as I type. There’s no UI for the parser yet so everything still goes to the console
Devlog #2: The Core Loop The skeleton is alive, the real-world quirks are patched and the timezone picker doesn’t suck anymore. But how does it actually feel to use? Here’s how it works. You add a contact and the extension detects the time for them right where you’re typing. Step 1: Telling TimeBridge who you know When you click the extension icon, the popup opens. That right there is your contact book. Before, I was using a native <select> dropdown for the timezones which meant scrolling through 418 IANA zones which was terrible. Now, it’s a custom search-as-you-type combobox. You just type a name (like “Jean”) then start typing a country, city or abbreviation in the timezone box. If you type “Europe” the combobox instantly surfaces the available results because of the alias map I added. It still needs to be refined since it doesn’t yet contain ALL of the timezones. Also when you hit Enter and click “Add Contact”, it saves to chrome.storage.local , Jean now shows up in your list with her current local time updating live. Step 2: Typing in the wild Now you head over to Gmail, Slack web or Twitter, anywhere with a text box. You start typing a message, lets say “Let’s sync tomorrow at 3pm” Behind the scenes, it works like this: The Listener: A content script is running on the page. It’s using a single delegated document.addEventListener in the capture phase. This means it catches your typing whether you’re in a plain , a rich text with nested formatting spans or even a contact form embedded in an iframe. The Debounce: It doesn’t parse on every single keystroke (that would lag the browser). It uses a 250ms debounce. When you pause typing for a quarter of a second, it grabs the text. The Parser: It passes that text to chrono-node, the parsing library I bundled. Chrono looks at the phrase “tomorrow at 3pm” and figures out what “tomorrow” actually is based on today’s date and spits out an actual Date object. Step 3: The Badge If Chrono finds a time, the extension builds a floating, dark-colored tooltip (the badge) and injects it right below the text box you’re typing in. The badge does three things: It shows you the exact phrase it detected: “tomorrow at 3pm” It grabs the last contact you used (in this case, Jean) and automatically converts that 3pm time into her local time, displaying it right there. It gives you a dropdown. If you actually meant to schedule this with a different contact, you can switch the dropdown right in the badge and it recalculates the time instantly. One of the most annoying things to figure out was what happens when you hit Enter. On Slack or WhatsApp, Enter sends the message and clears the text box immediately. Because of my 250ms debounce, the extension was occasionally showing the badge after the message was already sent, making it float over an empty text box. The fix was adding a specific keydown listener. If you hit enter (without shift), the extension kills the debounce timer and hides the badge instantly which means no more ghost badges
Devlog #3: Playing Nice (Allowlists & Passive UI) The core loop works. So you type a time, the badge pops up and it tells you what time it is for your contact. But after using it for a few days, two massive problems became obvious: it was running everywhere and it was too loud. Here’s how I fixed the extension to play nice with your browsing experience. Problem 1: The “Everywhere” Problem Originally, the manifest was set to <all_urls> . This meant the content script was injecting itself into every single page you visited. Your banking site, Reddit, random blogs. Even if the badge didn’t pop up, the event listeners were running on every text box on the internet which felt invasive and heavy. So I added an enabledSites list to chrome.storage.local . The extension now defaults to only running on whatsapp.com, slack.com and mail.google.com. I also updated the popup UI. If you want to add a new site (like discord.com), you can either type it manually in the popup or just hit the “+ Add current site” button which grabs the URL of the tab you’re currently looking at. The content script listens to storage changes so if you add a site, the extension instantly activates on that tab and no reload is required. Problem 2: The Noise Problem The badge was a full card which activated whenever you typed a time or date, a giant dark tooltip would expand below your text box. If you were just typing a normal message that happened to include a time, the UI was visually shouting at you. SO I shrunk the UI down to a tiny 26x26 pixel clock icon (🕐). It still appears when you type a time phrase but it stays out of your way. If you actually want to see the conversion, you click the icon and the full panel expands. If you click away, it collapses back to the icon. It’s much less stressful to type with!
Logging the leftover time that got caught up during the project maintenance and finalization
Ships:
I finally shipped TimeBridge, a Chrome extension I built to solve a problem I have every single day. Doing mental math for timezone scheduling while typing in chat apps. Not just for me but every remote worker knows the pain. You type “let’s call tomorrow at 3pm” in Slack. Then you stop, open a new tab, plug it into a timezone converter, figure out what time that is in Tokyo and come back to type it. Undoubtedly it does break your flow. TimeBridge fixes this by living right inside your chat box. Instead of bouncing between Slack and a timezone converter, TimeBridge uses natural language processing to read what you’re typing. When it sees a time phrase, it quietly drops a little clock icon next to your text box. You click it and it tells you what time that is for your contacts. Why it’s different: Passive UI: It doesn’t shout at you. Well, don’t take it literally. It’s just a quiet 26px clock icon you can click or ignore. Real language: Understands phrases like “next Tuesday at noon” or “in 2 hours” using natural language parsing. Privacy-first: It doesn’t run on every website. It defaults to an allowlist (Slack, WhatsApp, Gmail) that you control....
|
1792857102.7165565
|
1792943502.7165565
|
|
52506
|
Particle simulation (Vulkan Compute Shaders + C++) Particle simulation (Vulkan Compute Shaders + C++) by @Knaj | Stardance...
|
Knaj
|
1
|
33.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T19:12:22Z", "hours": 33.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Particle Simulation, semi-finished. At last I’ve done it, this a mini-dream come true. I’ve finally “mastered” Vulkan compute shaders and got better at using C++ and GLSL. The program spawns 2000 particles (a very humble number, so I can run it on almost any machine) and simulates their gravity and collisions. In my very humble opinion, it’s quite impressive.", "repo": "https://github.com/Knajp/ParticleSimulation", "demo": "https://github.com/Knajp/ParticleSimulation/releases/tag/1.0.0"}]...
|
[{"post_id": 79981, "ts": "202 [{"post_id": 79981, "ts": "2026-10-15T18:46:09Z", "hours": 7.6886, "text": "The end? Probably not, but it sounds cool and is a Minecraft reference. Anyway, as you can see, I (sadly along with the help of an LLM, since I’m not the best at physics (i promise I only used it to explain the physics part and fix some insanely weird bugs)) implemented the collision system. What it took So, to achieve this and not make my computer burn down, I used a spatial grid. The way this one worked is: I added 2 buffers, one for cell heads, and other for next particles Created a linked list using those, with the last one pointing to index -1. Then, using some nonsense calculations, for every particle I checked every particle in their own cell and the 8 surrounding ones. That way I didn’t have to make a literal billion if statements per second. Then I fiddled around with making the particles stop moving on their own, and bim bam boom, I’ve got a nice layer of particles at the bottom. What’s next? I probably won’t finish this during stardance, but I’ll add some mouse interactions so the simulation isn’t so stagnant, and that should probably be it. Attachments In the attachments you’ve got a simulation of 2,000 and 100,000 particles, and a screenshot of the final result."}, {"post_id": 76212, "ts": "2026-10-02T18:03:56Z", "hours": 9.3442, "text": "Not a nothingburger anymore! Just a regular burger now, though. As you can see, the particles are there. And there’s many of them. Three thousand if I remember correctly. I can’t lie, implementing this took a lot and made me experiment with a lot of new things and especially modern Vulkan. What it took So, in my last devlog I said that the particles were in memory. They in fact were not, because my compute invocation was broken. But as you might imagine by now, I fixed that. What was wrong is that I was calling vkDispatch(cb, [actual number of dispatches], 0, 0) . Since x * 0 * 0 = 0 , the total number of calls was, you guessed it - zero. Changed it to vkDispatch(..., 1, 1) and it worked like a charm. Then I had issues with displaying the stuff (passing uninitialized values to the shaders), and also making the particles round. Overall, a nice challenging part of the project."}, {"post_id": 70047, "ts": "2026-09-18T11:08:06Z", "hours": 8.6511, "text": "A very big nothingburger. Yup. Despite working on this devlog for about 9 hours, I’ve made no visible progress. There’s still no window displaying anything (there is one on traditional DEs, but it won’t work on Hyprland for some unknown reason). However, it’s not as simple as it sounds, since I had to be working on something, right? Right. That thing being the base for the particle simulation – The compute pipeline, the compute shader, the compute everything. Additionally, I’ve finished the renderer init. Now the program launches without any issues! Somehow. Lol. The obvious next step is to actually get something rendering, and since the particles, or at least potential particles should be in their SSBO by now, I think I should be able to make a humble hundred-thousand-vertex draw call and be good! In theory, of course. How it will turn out in practice, we will see. And because as I said, I don’t have any visual output yet, you can have another picture of the terminal output as a treat."}, {"post_id": 61481, "ts": "2026-09-04T12:47:12Z", "hours": 7.3406, "text": "Devlog #1 Project Setup This was supposed to be covered a separate devlog, however posting the devlog failed and I simply gave up. Anyhow, I set up the project in quite a simple way, hoping to minimize the amount of bloat in the vendor directory. The project uses C++, Vulkan (my two beloved technologies) and CMake, which is a first for me. Renderer base So far, I’ve made use of GLFW to create a window and then used Vulkan to create a window surface and prepare the swapchain. What the swapchain in plain terms is that it makes sure you dont have to wait for the next frame to be rendered with a blank screen. Next Steps The next obvious step would be a graphics pipeline, however this time I’m thinking of going straight into rendering particles instead of the regular triangle. That would require a different (possibly instanced) . graphics pipeline, more sophisticated shaders and of course, a compute pipeline, learning which is the very point of this project. -# ignore assert failed please"}]...
|
Title: Particle simulation (Vulkan Compute Shaders Title: Particle simulation (Vulkan Compute Shaders + C++) by @Knaj | Stardance
Devlogs:
Devlog #1 Project Setup This was supposed to be covered a separate devlog, however posting the devlog failed and I simply gave up. Anyhow, I set up the project in quite a simple way, hoping to minimize the amount of bloat in the vendor directory. The project uses C++, Vulkan (my two beloved technologies) and CMake, which is a first for me. Renderer base So far, I’ve made use of GLFW to create a window and then used Vulkan to create a window surface and prepare the swapchain. What the swapchain in plain terms is that it makes sure you dont have to wait for the next frame to be rendered with a blank screen. Next Steps The next obvious step would be a graphics pipeline, however this time I’m thinking of going straight into rendering particles instead of the regular triangle. That would require a different (possibly instanced) . graphics pipeline, more sophisticated shaders and of course, a compute pipeline, learning which is the very point of this project. -# ignore assert failed please
A very big nothingburger. Yup. Despite working on this devlog for about 9 hours, I’ve made no visible progress. There’s still no window displaying anything (there is one on traditional DEs, but it won’t work on Hyprland for some unknown reason). However, it’s not as simple as it sounds, since I had to be working on something, right? Right. That thing being the base for the particle simulation – The compute pipeline, the compute shader, the compute everything. Additionally, I’ve finished the renderer init. Now the program launches without any issues! Somehow. Lol. The obvious next step is to actually get something rendering, and since the particles, or at least potential particles should be in their SSBO by now, I think I should be able to make a humble hundred-thousand-vertex draw call and be good! In theory, of course. How it will turn out in practice, we will see. And because as I said, I don’t have any visual output yet, you can have another picture of the terminal output as a treat.
Not a nothingburger anymore! Just a regular burger now, though. As you can see, the particles are there. And there’s many of them. Three thousand if I remember correctly. I can’t lie, implementing this took a lot and made me experiment with a lot of new things and especially modern Vulkan. What it took So, in my last devlog I said that the particles were in memory. They in fact were not, because my compute invocation was broken. But as you might imagine by now, I fixed that. What was wrong is that I was calling vkDispatch(cb, [actual number of dispatches], 0, 0) . Since x * 0 * 0 = 0 , the total number of calls was, you guessed it - zero. Changed it to vkDispatch(..., 1, 1) and it worked like a charm. Then I had issues with displaying the stuff (passing uninitialized values to the shaders), and also making the particles round. Overall, a nice challenging part of the project.
The end? Probably not, but it sounds cool and is a Minecraft reference. Anyway, as you can see, I (sadly along with the help of an LLM, since I’m not the best at physics (i promise I only used it to explain the physics part and fix some insanely weird bugs)) implemented the collision system. What it took So, to achieve this and not make my computer burn down, I used a spatial grid. The way this one worked is: I added 2 buffers, one for cell heads, and other for next particles Created a linked list using those, with the last one pointing to index -1. Then, using some nonsense calculations, for every particle I checked every particle in their own cell and the 8 surrounding ones. That way I didn’t have to make a literal billion if statements per second. Then I fiddled around with making the particles stop moving on their own, and bim bam boom, I’ve got a nice layer of particles at the bottom. What’s next? I probably won’t finish this during stardance, but I’ll add some mouse interactions so the simulation isn’t so stagnant, and that should probably be it. Attachments In the attachments you’ve got a simulation of 2,000 and 100,000 particles, and a screenshot of the final result.
Ships:
Particle Simulation, semi-finished. At last I’ve done it, this a mini-dream come true. I’ve finally “mastered” Vulkan compute shaders and got better at using C++ and GLSL. The program spawns 2000 particles (a very humble number, so I can run it on almost any machine) and simulates their gravity and collisions. In my very humble opinion, it’s quite impressive....
|
1792712855.4908545
|
1792799255.4908545
|
|
61531
|
Ducks Can Fly Too! by @Choc0latesauce | Stardance
|
Choc0latesauce
|
1
|
15.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T18:13:51Z", "hours": 15.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is my first ever proper game, I hope I did Ok!! Here’s a description: Ducks Can Fly Too! 🦆 My surreal adventure about ducks and appreciating their ability to fly! - Created for Haven Jumpstart Game Mechanics / Features: Flappy bird style flying mechanics Dynamic animations Energy system Energy pickups Enemies Traps Interactable NPCs Dynamic parallax backgrounds Dynamic music system What I Learnt: Almost everything to do with my project, I learnt from scratch. I had made basic Godot games before but hadn’t gotten past making a basic character script and tile map level. I am pretty experienced with python which helped with coding GD script a little. It was so much fun to learn everything though! How do I play? Controls: Space to jump, D to move right, A to move left and E to interact Play from the releases tab! General Info: The game is very short at the moment! Plan to do more though! There is an ending, please keep going even if you find certain parts hard! :3 IN VERY EARLY DEVELOPMENT!", "repo": "https://github.com/Choc0latesauce/Ducks-Can-Fly-Too", "demo": "https://choc0fr.itch.io/ducks"}]...
|
[{"post_id": 79947, "ts": "202 [{"post_id": 79947, "ts": "2026-10-15T18:11:39Z", "hours": 0.3194, "text": "Gained a few extra mins from doing some final polish, this was a lot of fun to make and I’m looking forward to continuing it in the future! Hope you enjoy!"}, {"post_id": 73048, "ts": "2026-09-24T08:32:50Z", "hours": 4.5411, "text": "The first playable build is complete and is up on itch! I’ve added more interact-able npcs, a whole new underground level, more lore, new biomes and fan traps. I started making this game as my haven jumpstart project but am going to continue working on it as there’s still so much more I want to do. (especially polishing it more)"}, {"post_id": 70870, "ts": "2026-09-19T22:04:42Z", "hours": 5.7614, "text": "Been hard at work! Improved the levels, added an interactable npc, enemies, energy pickups, easter eggs and more!! I’m having a lot of fun learning as this is my first time actually putting effort into getting to grips with godot . Gone for a surreal mix of photorealistic imagery and pixel art"}, {"post_id": 67384, "ts": "2026-09-13T14:09:23Z", "hours": 3.4561, "text": "Almost done with the basics required for the game! Added in new flappy bird style jumping, dynamic camera movement, parallax backgrounds, animations, and energy system and ui, new tile sets, etc etc. I can’t wait to add some actual objectives next! I’m having a lot of fun"}, {"post_id": 66880, "ts": "2026-09-12T20:35:33Z", "hours": 0.7856, "text": "Following the haven jumpstart guide as a basis for the game and am about to move on from it, gotten basic movement and some admittedly creepy placeholder textures in place."}]...
|
Title: Ducks Can Fly Too! by @Choc0latesauce | Sta Title: Ducks Can Fly Too! by @Choc0latesauce | Stardance
Devlogs:
Following the haven jumpstart guide as a basis for the game and am about to move on from it, gotten basic movement and some admittedly creepy placeholder textures in place.
Almost done with the basics required for the game! Added in new flappy bird style jumping, dynamic camera movement, parallax backgrounds, animations, and energy system and ui, new tile sets, etc etc. I can’t wait to add some actual objectives next! I’m having a lot of fun
Been hard at work! Improved the levels, added an interactable npc, enemies, energy pickups, easter eggs and more!! I’m having a lot of fun learning as this is my first time actually putting effort into getting to grips with godot . Gone for a surreal mix of photorealistic imagery and pixel art
The first playable build is complete and is up on itch! I’ve added more interact-able npcs, a whole new underground level, more lore, new biomes and fan traps. I started making this game as my haven jumpstart project but am going to continue working on it as there’s still so much more I want to do. (especially polishing it more)
Gained a few extra mins from doing some final polish, this was a lot of fun to make and I’m looking forward to continuing it in the future! Hope you enjoy!
Ships:
This is my first ever proper game, I hope I did Ok!! Here’s a description: Ducks Can Fly Too! 🦆 My surreal adventure about ducks and appreciating their ability to fly! - Created for Haven Jumpstart Game Mechanics / Features: Flappy bird style flying mechanics Dynamic animations Energy system Energy pickups Enemies Traps Interactable NPCs Dynamic parallax backgrounds Dynamic music system What I Learnt: Almost everything to do with my project, I learnt from scratch. I had made basic Godot games before but hadn’t gotten past making a basic character script and tile map level. I am pretty experienced with python which helped with coding GD script a little. It was so much fun to learn everything though! How do I play? Controls: Space to jump, D to move right, A to move left and E to interact Play from the releases tab! General Info: The game is very short at the moment! Plan to do more though! There is an ending, please keep going even if you find certain parts hard! :3 IN VERY EARLY DEVELOPMENT!...
|
1792857097.0818067
|
1792943497.0818067
|
|
52418
|
ANK Bank - A virtual ATM by @najil_kilayil | Stard ANK Bank - A virtual ATM by @najil_kilayil | Stardance...
|
najil_kilayil
|
3
|
19.0
|
186
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T16:08:34Z", "hours": 4.0, "multiplier": 9.68, "payout": 41, "blessing": "neutral", "text": "This is a ATM virtual simulation using JavaScript, HTML and CSS. I coded this from scratch by my own! I created a blueprint of this project on papers as roughly with 18 frames. So i just created each by each frame and connect together! This project is created on the mindset that may helpful for kids who can practice how the ATM works, Its just simulation. Anyway you need to fill a form to enter the page note that the all data in that form such your name and security it doesn’t saved or transferred to anywhere. It is just used for the name and pin for the better experience. User can check the balance, withdraw and deposit money and even user can change its own PIN! I tried to give by maximum effort for making the user experience better for that i added the animations, and also made responsive that user can experience the website from both devices - Desktop and as well as mobile phone. I hope you will try my website and explore every corner of the website in mobile and as well as in desktop, Btw feel free to give suggestions!", "repo": "https://github.com/najilkilayil/ANK-bank", "demo": "https://ank-bank.vercel.app/"}, {"ship_num": 2, "ts": "2026-09-16T10:18:50Z", "hours": 8.0, "multiplier": 13.65, "payout": 108, "blessing": "neutral", "text": "This is a ATM virtual simulation using JavaScript, HTML and CSS. I coded this from scratch by my own! I created a blueprint of this project on papers as roughly with 18 frames. So i just created each by each frame and connect together! You can experience the real ATM Machine in your Browser , note that it is just simulation. At first you need to fill the form to continue the the website and to enter the ATM. Then you can explore options such balance, deposit, withdraw, and as well as you can change the PIN. Note that it doesn’t connect with localStorage or any cloud storage that you need to fill and submit the form each time you visit the website, i will work on that to make it local storage available. And note that i changed the entire website testing colours theme into a dark-shaded theme which give a realistic experience of a ATM. Hope you will go through my devlogs and code as well as explore all the features in my website and feel to free make suggestions!", "repo": "https://github.com/najilkilayil/ANK-bank", "demo": "https://ank-bank.vercel.app/"}, {"ship_num": 3, "ts": "2026-08-25T12:45:43Z", "hours": 7.0, "multiplier": 5.52, "payout": 37, "blessing": "neutral", "text": "This is a ATM virtual simulation using JavaScript, HTML and CSS. I coded this from scratch by my own! I created a blueprint of this project on papers as roughly with 18 frames. So i just created each by each frame and connect together! In this project user can experience as same as that of a ATM in your browser (NB: Need to register each time you open the website). Now it’s time to ship this project but note that i would like share my JS and implementing logics only I spend time on CSS! I would like hear your response and like hear what should i change and suggest me what should i do in CSS, Iam totally confused about CSS styling this project", "repo": "https://github.com/najilkilayil/ANK-bank", "demo": "https://ank-bank.vercel.app/"}]...
|
[{"post_id": 79832, "ts": "202 [{"post_id": 79832, "ts": "2026-10-15T15:49:42Z", "hours": 1.125, "text": "Devlog 2.3 - Frame 12 - 18 In Frame 12 , There is nothing extraordinary changes. Just aligned the whole texts into center and also increased the size of button as per made in other frames. In Frame 13 , I first made all texts into center then i feel like there are a lot space between the lines so tried solve that, I changed that by removing the margin top and margin bottom as well as the line spacing and line height. Btw i changed the button width as same others. In Frame 14 , In this frame i removed the default padding and margins and then restarted to arrange everything perfectly such as made to be aligned center and added margin top where was needed. Then also change the length of the button. In Frame 15 , There is no change which had removed this frame from main website. That for there is no change required but automatically it working perfectly on the mobile screens. In Frame 16 , Just aligned and made suitable change as per the same method that used in the previous frames. In Frame 17 , There is no change required since there is perfectly aligned already! In Frame 18 , It is very easy when sees but i tried to make it aligned as perfect centered it doesn’t working. I tried a lot of time and i found a cheap solution which had i adjust that using margin function! ##Now the UI design of the mobile responsive website is completed. But i found some bugs. Devlog 2.4 Now it’s time recheck that there is any bug or errors are occurring. First of all, i found a bug that only in desktop mode (in mobile screen it’s working perfectly) which is animation between two frames 3 and 4 are doesn’t working basic not showing. So i tried one by one each method and finally i found it! Then the animations is working perfectly. Then i would find any further bugs or errors in both screen. Then i noticed that the alert notification in mobile screen is seems to boring so i decide to change the fade-in and fade-out animation into transition of y axis from x axis. Now i think its time to reship the project!"}, {"post_id": 79757, "ts": "2026-10-15T09:12:58Z", "hours": 1.8514, "text": "Devlog 2.2 - Frame 5 - 11 Today i started to continue the project after a two week break! So started to working hardly to submit my project. I am working on making the project mobile responsive. I completed everything under frame 4, Now working from frame 5… In frame 5 , I would like to make more attractive and user friendly. For that i made the main option and welcome text in full screen with height and width 100%. That’s all i made change in this frame, Btw i also changed the line-height, i felt that the texts in the frame 5 are feeling like congested, so i increased the line-height through it. In frame 6 , I found a logical error, whereas the Dialpad is not showing since i changed the subsection display into none before on mobile responsive. I think why should i solve this using CSS function such :has and :not, I need to hide the subsection on the main menu so i used the if the frame contains the id that #menu_option it has to hide the subsection and similarly if not make the height of the main section and subsection in 3:2 ratio with 100% width. Then i increased the gap between the Dialpad and as well as the width of the buttons. In frame 7 , Now i am facing i huge logical error again i have no idea and i failed that i already implemented method. As before i managed the logical error of showing subsection and main section just by using has and not function in CSS and that time it still hiding in the all frame, in ratio 3:2, whereas the subsection is showing where the Dialpad is doesn’t help. After a long try i found a solution from the google (redit) by replacing a line in the script code. I added a line of code which in the function ‘balWindow()’ first declaring the that in innerHTML of the subsection into empty then hide it now it would working without any error!… After all i made the text aligned center and also increased the width of the button… In frame 8 , It is really simple there is no any logical error just increased the width of input and also removed the padding of the whole content and so there changed only! In Frame 9 , I aligned all the text into center and also increased the width and margin of the button. In the frame file (‘frame9.html’), it looks like as we expected but in the main website (‘index.html’) it doesn’t seems good. Since the Dialpad is not hiding after onwards the frame 8, After a detailed observation i found that the Dialpad is never hiding even when the main menu’s frame is came again. Anyway i solved the error by doing the same way that i did in frame 7. In Frame 10 , In this frame i thought that to make the ‘other’ button into 100% and make the others into grid form. Since when we exclude the other button the number of buttons become odd and seems a bad alignment, So i added another button with amount 3000. Now the alignment working perfectly. My next issue in this frame was that when the user clicks on the other button the whole view will moves upward. So i made the height into auto then unfortunately its working i don’t know what is actually happing in my code!! In Frame 11 , i just hide the showing Dialpad i mean the subsection and made the main section into full screen. simply adding that subsection.innerHTML into empty in the function ‘loadingWindow()’"}, {"post_id": 75233, "ts": "2026-09-29T15:24:23Z", "hours": 1.3094, "text": "Devlog 2.0 Today i am planning to make important change in the website. I found that, the website is looking bad and not working the UI properly in mobile screens. So i decided to make the website responsive and dynamic in mobile screens also as well as the desktop screens So let start to design the whole webpage again! Devlog 2.1 | Frame 1 - 5 First of all i made some research about making a webpage into a responsive one, and i found that we can simply edit the layout of the element according to screen width using @media function in CSS file. So i found that the maximum width of a mobile screen is 480px. So decided to adjust the @media function with screen width 480px. In frame 1, i doesn’t made any changes for the mobile screen. But in frame 2 i found that it doesn’t align the text exact that of the center of the screen height and width. And also find that the text typing animation is the issue regarding that! So i tried my maximum to solve that but unfortunately i couldn’t, So i decided to remove the animation in the mobile screen. In frame 3, Then i moved into next frame. I made the main div into 100% width and height that of the screen. Also made the input box into a little smaller than that of the 100% width. Similarly also changed the width of the button. In frame 4, I made everything exactly center to the whole screen. by making the layout position as absolute and then made top and left as 50% move. Solving Bugs and logical errors. I found a bug in the animation period on the mobile screen. It has been working perfectly until the animation between frames 3 & 4. I found that the fade-out animation of frame 3 is working perfectly but the fade-in animation of frame 4 is working but placing the frame at the very bottom-right side. After a huge think i created a id tag for a this special animation issue which has the issue for these two frames only. Then i connected them using JS now its working perfectly."}, {"post_id": 69068, "ts": "2026-09-16T09:58:48Z", "hours": 3.2153, "text": "Devlog 12 - Remaining frames Today i decided to work all the remaining frames, which is almost 10+ frames. But it seems to be easy because i already setted the theme and colour palette now i just need to change accordingly. In frame 8 , I changed the font-size and colour of the heading and also changed the almost everything that of input field. In frame 9 , there are 2 main heading 2 big digits text and a button. first of all, i changed the colours and text font-size of all 4 texts into different ones. and made the button as other buttons with text “Back to Menu”. In frame 10 , There one heading and 6 buttons. i made the buttons as same as others and made the “Other” button with another text colour and border colour if the user clicks on that it will appear an input field and as well as dialpad. In frame 11 , Just created and made a animation which is changeing the opacity, and letterspacing as well as scale of the text which makes more interesting for the user as it will give a sign that it is under processing… In frame 12 , this frame is styled as everything same as that of the frame 9. In frame 13 , this frame is also same as that of frame 9 but there is some changes in font size and colour of text since it is for failure that for used red-shade colour text. In frame 14 , In this frame made the input section and text more styled adn also removed the outline of the input box if the user focus on the input box. In frame 16 , It is just a text with green coloured as indicating successful and a button with caption ‘Back to Menu’. In frame 17 , It is text with ‘Quitting…’ i added animation for that text which is changing its opacity, and motion of y-axis. In frame 18 , This is the last frame of this project it is as shows as the conclusion of the project. I added a span tag in-between the text for changeing colour of ‘ANK’ only into blue. After all these the basic styling is completed! Final Changed I noticed that it is very boring and showing separately that the default js alert() is function to change that i decided to make more attractive and simple one. So i created another div called ‘error_alert’ which is similarly show up the notification at top-right of the screen when there is any error or alert occurs. I added showing animation which is changed the x-axis and opacity of the div and as well as the hideing animation. For make this dynamically i created a new function called ‘errorAlert()’ with one parameter which is function as this div is displayed with the text that in parameter whenever the function is called. And also made that it need to hide automatically after 3 seconds with hideing animation. Then i changed the alert() into errorAlert({text}) which made more interesting for the website and ATM simulation. Solving Bugs I found i bug that in the section ‘change PIN’ there is a major bug which is like these, if the user enters ‘2222’ in the first input field and ‘1111’ in the second one then the user clicks on the update button it will update the PIN as ‘2222’ but the conform PIN and entered PIN are not same after a detailed look through my JS code i found the error at the function updatePIN() then i solved that bug. Iam proud that i solved this bug without help any resources."}, {"post_id": 68700, "ts": "2026-09-15T15:50:26Z", "hours": 2.3792, "text": "Devlog 11 - Frame 5 & Frame 6 & Frame 7 In these days, i made a lot of changes in the project. I started to make the project more attractive and i need to be show up this project as 100% simulation design of ATM Machine. So i decided to use font-family of inter and selected a dark-shade background and theme for the whole project though out the entire project! In frame 5 , As we know this frame is the main frame and important frame which is showing the main options and homepage of this simulation. For that i changed the text interface into more useful and attractive. Currently the text at the top is just “Welcome, {username}” below that “{accountnumber}” just these only, which gives a normal and booring look and not much branding look. I need to make sure that to look and design like a branding project! For that i changed the text into like these “Welcome Back, {username}” then “{accountnumber}” below that i added another text “What would you like to do?”. At last for these texts i added different colour pattern and size according to text importance! then i spend time to work on the section of buttons, first of all i changed the texts from “Balance” into “Check Balance”, “Deposit” to “Deposit Money”, “Withdraw” to “Withdraw money” and “Quit” into “Exit”. As well as i changed the button background colour and border colours and removes the default border-radius and also added hovering animation which made the buttons more like a ATM. In frame 6 , I added another text below the current text and also changed the input box size and colour as well as the border and background colour and given the same button effects that of the main menu buttons (in frame 5). At there i added few more features - I updated pinInputFun() which is the user enters input with length of 4 letters then the dial-pad’s “Check” button will automatically highlights which the user can understand it time to enter that button and check the PIN. Then also removed the alert notification into that when the user enters wrong password the input password’s colour will change into red and then back to normal after 2 seconds. In frame 7 , I added another text below the current text and changed the button caption. And also designed the texts in different font size and font colour. and Addded the button style as in frame 5. NB: Tried out a lot of animations and styling ways to occur this output which wasted me a much time to spend on it and need to remove into trash :)"}, {"post_id": 60950, "ts": "2026-09-03T17:09:43Z", "hours": 2.2897, "text": "Lets continue on this project more! I decided to change the colours and themes into a single UI design. I choose dark blue colour and planned to remove bright colours such as yellow, green etc which makes the user more distraction from the website (not suitable for ATM Simulation). So lets redesign the whole webpage frame by frame again Devlog 10 - Frame 1 & Frame 2 & Frame 3 & Frame 4 First of all, i created a var css function of :root of colors i used in the website for making easy to reuse the color all over the website. In All over the website , I changed the white background into dark navy blue colour and sky-blue colour for basic normal text. And as well as i selected some font from google fonts . And i added a font name ‘Inter’ to the body for making the default font-family thought out the webpage. In frame 1 , I broke one line text into two line text and also removed the black background into default website background. And also changed the default font-family into ‘Segoe UI’ font-family which i had connected from google fonts. In frame 2 , I made the letters into uppercase which made the website heading more attractive and branding look! And as well as i changed the font into ‘Space Grotesk’. In frame 3 , I added a card effect to the whole section with a slight decreasing the darkness to the background colour. Changed the default input box colour into another colour that matches to the background and also given the colour to the border of input box when the user focus on that input box and also added :disabled condition to ensure and make identification to the user that it is un-editable by making the darkness in background colour of the input box. And also i added a fixed margin between texts and input boxes. Then i changed the submit button’s background colour into the default colour of the normal text which i saved in the :root function with white text. Btw, i also changed the text such as balance into initial balance and pin into security pin etc.. In frame 4 , As per the feedback i found that i made a lot of spelling mistaken in this frame. So i changed them into correct. Then i added the same background that i used in the frame 3 for the card. Then i added a successful tick mark icon at the top with green background with only using div tag. Then i changed the heading to ‘Account Created Successfully’ with a line break at before the text ‘Successfully’ which i had added span tag between them to change the colour of that word into green which gives more branding feel to the user! Then i added another sub-text below the heading. Then i created two cards one with holder name and another with account number. At last changed the animation that from appearing left and hiding to right into hiding and showing at right with ease-in-out function and also changed the animation time from 3s into 1.2s which made the animation more faster and furious!"}, {"post_id": 54406, "ts": "2026-08-25T12:24:25Z", "hours": 0.6292, "text": "Devlog 9 Created README.md file with i included the brief description. And also mentioned that need more to work on CSS! And also i included the use of each and main functions using table in md file . It is my first time ever using table in md file Also mentioned the details of each frame as in a table!"}, {"post_id": 54319, "ts": "2026-08-25T08:27:52Z", "hours": 0.4175, "text": "Devlog 8 - Frame 17 & Frame 18 In frame 17 , It will just a loading screen with text quiting… In frame 18 , It is page that will shows after frame 17. And It is the last frame of this project! when the user clicks on quit button from homepage menu it will trigger the function optQuit(), then it will show up the frame 17 for 2.5 second then it will show frame 18 as the last frame! After all i created a another function called loadingWindow() which is the frame 11. I called this function everywhere as a processing windows as loading screen for 2 second. Now the project has been completed but it just looks like a template and only backend project, i need to wokr on CSS file to make this project more attractive!"}, {"post_id": 54284, "ts": "2026-08-25T06:36:41Z", "hours": 0.7269, "text": "Devlog 7 - Frame 14 & Frame 16 In frame 14 , It is the window that shows the user when the user select Change PIN option from home page. Then the user need to enter the current PIN (frame 6) then it will show up the frame 14. There the user needs to enter new 4 digit PIN as well as need to conform that! In frame 16 , it is shows when the New pin and conform PIN are matching, This windows shows the user that PIN has been changed successfully with a button that direct to home page menu. In here i created a function optPIN() which will direct to enter the current PIN and then it direct to changePinWindo() it will shows up the frame 14 with a dial pad the user can enter new PIN using the dial pad. Then created changePinInputFun() with one parameter which will the clicked number will enter in the first input box. After the 4 digits in the first input box it will direct to next input box. After both input boxes attain 4 digit and matching digits it will show up the changePinSuccess() (frame 16). Otherwise users can also click the update button from the frame 14, that will trigger updatePIN(), it will do the same thing! After all PIN changing option is completed!"}, {"post_id": 53893, "ts": "2026-08-24T16:20:55Z", "hours": 1.4303, "text": "Devlog 6 - Frame 10 & Frame 11 & Frame 12 & Frame 13 In frame 10 , when the user clicks on withdraw button from the home page menu. First it will direct towards a PIN entering page (frame 6). Then if the user enters the PIN correctly then frame 10 will show up! In this frame the user can select few buttons with amount and also user can enter when the user clicks on custom button then it will show up a input that can user enter custom amount using the Dialpad. And added a same condition error as well as the deposit amount section. In frame 11 , It is just a loading frame with the text processing. I added this frame to add a time between the processing of the ATM! In frame 12 , In this frame will show up when the user withdraw the amount successfully. In this page it shows the amount user withdrawn and the balance after that and as well as there is button to back to the home page. In frame 13 , Similarly in this frame it will show up when withdraw is failed. I created a function called customAmountWindow() which will trigger when the user clicks on the button ‘other’ from the withdraw window. When this function triggers it show frame 10. And also created another function called withdrawAmount() with one parameter. It will check that the user entered amount is less than or equal to the current balance using if-else condition. If the user entered amount is greater than that of the current balance it will show up the frame 13 otherwise it will show the frame 12. Both frames had the back to home button. I also added this function trigger when the user using the buttons at frame 10 for fixed amount. Now withdraw section is Completed!"}, {"post_id": 53613, "ts": "2026-08-24T08:13:46Z", "hours": 1.1081, "text": "Devlog 5 - Frame 8 & Frame 9 In Frame 8 , it is the entering amount window of the deposit option but before accessing that need to verify the PIN so PIN entering screen (frame 6) before frame 8. created function optDepo() to view the keypad when user clicks deposit button from homepage. When user enters the PIN correctly it direct towards the exact frame 8 which is the window for the user can enter the amount to be deposited. So i created the dial with a function called moneyInputFun() with two parameters as same as the function pinInputFun(), thus moneyInputFun() helps the user to enter the amount using the Dialpad, In this window i also added a condition that only allows the user to enter x100 otherwise it shows an error for which i added, event dispatch when every button clicks, it may checks the error condition for each letter is clicks.! In frame 9 , It is the window that shows after the user enter the deposit money which shows the successful window that shows the amount that the user deposited and also the shows the balance amount. At last added button that direct towards the main menu After all deposit option is completed!"}, {"post_id": 52134, "ts": "2026-08-22T07:07:32Z", "hours": 0.7444, "text": "Devlog 4 - Frame 6 & Frame 7 In frame 6 , It is pin entering window which will allow or disallow the user for the next action based on the correct PIN or not! I am working on the balance btn, that for i created a function called ‘optBal()’ which will trigger when the user clicks on the balance button from the home page. On optBal() added Dialpad in sub-section to display it. I got an idea put this Dialpad function in a another function with a parameter, which may help to remove static coding for the future PIN entering window for other button actions. So i created a another function with two parameters one is to focus the which input is and another is which number is user pressed on Dialpad - ‘pinInputFun(Xinput, num)’ This is function is only tigger when the user clicks buttons on the dial pad! In frame 7 , It is the main window that shows the balance amount to the user. btw this window only shows when the user enter PIN correctly. For that in the pinInputFun() inside that another function called checkPin(), i added a another if condition if the user enters the password correctly it checks that which input it was because i thought use the pinInputFun() for all the Pin entering window, so the function need understand which function is to be triggered next. So that if the input is balance input then show the function showBal(). In showBal(), i designed simply without any much styling because now it is testing phase. btw i added a button with action showMenu() which will move to homepage!"}, {"post_id": 52109, "ts": "2026-08-22T05:59:30Z", "hours": 0.5069, "text": "Devlog 3 - Frame 5 Now iam working on Frame 5, which is the real interface of the ATM. At first i converted this whole page into main-section and sub-section with 3:2 width. In main-section i would like to display the text and options in ATM as main window, and in sub-section it only for keypad to enter values and numbers… So i created two section at frame5. In main window there is no need of keypad i hide sub-section. And also added to welcome with name of the user and below that i added account number then it will shows the buttons of function which are user can choose the options such as Balance, Deposit, Withdraw, Change PIN, Quit. I made whole this mainWindow in a function called ‘showMenu()’ which will help to call the homepage from everywhere in the future! And as well as, iam very lazy to type name, pin and conform each time i debugging or running the website again and again so i currently initialized each values."}, {"post_id": 52093, "ts": "2026-08-22T05:12:08Z", "hours": 0.6936, "text": "Devlog 2 - Frame 3 & Frame 4 Today, iam continue making frames one by one! So i added frame 3 which is the fill form of the user account with Form name, account number, initial balance amount and 4 digit PIN and conforming again PIN and a submit button.. I thought that the account number must random which is more attractive and realistic. otherwise the user need to enter something boring numbers. So i created function ‘AccountNum()’ which collect two type of digits, i mean i thought that there is a professional look in the account number So first bank code (“ANK”) then a 4 digit random number between 1000 and 1019 which is a model of user branch number and other 4 digit is section 1000 to 9999 which is unique for each user. Btw i added a perfect if else condition for the submit button on the form to make sure that the user entered all the values and made perfect. In frame 4, it is notification loading which will summarise the data the user entered in the fill form. It will hide automatically in 3 seconds."}, {"post_id": 51740, "ts": "2026-08-21T15:57:20Z", "hours": 0.3803, "text": "In this project iam planning to create a virtual simulation of ATM! using HTML, CSS and JavaScript, From BluePrint/Scratch I had plan for this project in my mind for few months. But now its the suitable time for that! On my free time, i planned the project roughly and noted everything and created my own blueprint with about 18 frames and i written whole plan as algorithm (As in my own words and shortform :) ). Devlog 1 - Frame 1 & Frame 2 Today i created files such as script.js, style.css and index.html and also a folder ‘frames’. I thought it would be easy to create frames one by one as matching to my blue print, so i decided to create each file as each frame then join together which make debugging and styling more easier. But my first time ever i coding by this approach. Btw, i completed first 2 frames which are both welcoming animation first is a warning animation like “Use desktop for better experience” and second is main welcoming to the project i also made animation with suitable hiding using a function welcomeLoad()"}]...
|
Title: ANK Bank - A virtual ATM by @najil_kilayil Title: ANK Bank - A virtual ATM by @najil_kilayil | Stardance
Devlogs:
In this project iam planning to create a virtual simulation of ATM! using HTML, CSS and JavaScript, From BluePrint/Scratch I had plan for this project in my mind for few months. But now its the suitable time for that! On my free time, i planned the project roughly and noted everything and created my own blueprint with about 18 frames and i written whole plan as algorithm (As in my own words and shortform :) ). Devlog 1 - Frame 1 & Frame 2 Today i created files such as script.js, style.css and index.html and also a folder ‘frames’. I thought it would be easy to create frames one by one as matching to my blue print, so i decided to create each file as each frame then join together which make debugging and styling more easier. But my first time ever i coding by this approach. Btw, i completed first 2 frames which are both welcoming animation first is a warning animation like “Use desktop for better experience” and second is main welcoming to the project i also made animation with suitable hiding using a function welcomeLoad()
Devlog 2 - Frame 3 & Frame 4 Today, iam continue making frames one by one! So i added frame 3 which is the fill form of the user account with Form name, account number, initial balance amount and 4 digit PIN and conforming again PIN and a submit button.. I thought that the account number must random which is more attractive and realistic. otherwise the user need to enter something boring numbers. So i created function ‘AccountNum()’ which collect two type of digits, i mean i thought that there is a professional look in the account number So first bank code (“ANK”) then a 4 digit random number between 1000 and 1019 which is a model of user branch number and other 4 digit is section 1000 to 9999 which is unique for each user. Btw i added a perfect if else condition for the submit button on the form to make sure that the user entered all the values and made perfect. In frame 4, it is notification loading which will summarise the data the user entered in the fill form. It will hide automatically in 3 seconds.
Devlog 3 - Frame 5 Now iam working on Frame 5, which is the real interface of the ATM. At first i converted this whole page into main-section and sub-section with 3:2 width. In main-section i would like to display the text and options in ATM as main window, and in sub-section it only for keypad to enter values and numbers… So i created two section at frame5. In main window there is no need of keypad i hide sub-section. And also added to welcome with name of the user and below that i added account number then it will shows the buttons of function which are user can choose the options such as Balance, Deposit, Withdraw, Change PIN, Quit. I made whole this mainWindow in a function called ‘showMenu()’ which will help to call the homepage from everywhere in the future! And as well as, iam very lazy to type name, pin and conform each time i debugging or running the website again and again so i currently initialized each values.
Devlog 4 - Frame 6 & Frame 7 In frame 6 , It is pin entering window which will allow or disallow the user for the next action based on the correct PIN or not! I am working on the balance btn, that for i created a function called ‘optBal()’ which will trigger when the user clicks on the balance button from the home page. On optBal() added Dialpad in sub-section to display it. I got an idea put this Dialpad function in a another function with a parameter, which may help to remove static coding for the future PIN entering window for other button actions. So i created a another function with two parameters one is to focus the which input is and another is which number is user pressed on Dialpad - ‘pinInputFun(Xinput, num)’ This is function is only tigger when the user clicks buttons on the dial pad! In frame 7 , It is the main window that shows the balance amount to the user. btw this window only shows when the user enter PIN correctly. For that in the pinInputFun() inside that another function called checkPin(), i added a another if condition if the user enters the password correctly it checks that which input it was because i thought use the pinInputFun() for all the Pin entering window, so the function need understand which function is to be triggered next. So that if the input is balance input then show the function showBal(). In showBal(), i designed simply without any much styling because now it is testing phase. btw i added a button with action showMenu() which will move to homepage!
Devlog 5 - Frame 8 & Frame 9 In Frame 8 , it is the entering amount window of the deposit option but before accessing that need to verify the PIN so PIN entering screen (frame 6) before frame 8. created function optDepo() to view the keypad when user clicks deposit button from homepage. When user enters the PIN correctly it direct towards the exact frame 8 which is the window for the user can enter the amount to be deposited. So i created the dial with a function called moneyInputFun() with two parameters as same as the function pinInputFun(), thus moneyInputFun() helps the user to enter the amount using the Dialpad, In this window i also added a condition that only allows the user to enter x100 otherwise it shows an error for which i added, event dispatch when every button clicks, it may checks the error condition for each letter is clicks.! In frame 9 , It is the window that shows after the user enter the deposit money which shows the successful window that shows the amount that the user deposited and also the shows the balance amount. At last added button that direct towards the main menu After all deposit option is completed!
Devlog 6 - Frame 10 & Frame 11 & Frame 12 & Frame 13 In frame 10 , when the user clicks on withdraw button from the home page menu. First it will direct towards a PIN entering page (frame 6). Then if the user enters the PIN correctly then frame 10 will show up! In this frame the user can select few buttons with amount and also user can enter when the user clicks on custom button then it will show up a input that can user enter custom amount using the Dialpad. And added a same condition error as well as the deposit amount section. In frame 11 , It is just a loading frame with the text processing. I added this frame to add a time between the processing of the ATM! In frame 12 , In this frame will show up when the user withdraw the amount successfully. In this page it shows the amount user withdrawn and the balance after that and as well as there is button to back to the home page. In frame 13 , Similarly in this frame it will show up when withdraw is failed. I created a function called customAmountWindow() which will trigger when the user clicks on the button ‘other’ from the withdraw window. When this function triggers it show frame 10. And also created another function called withdrawAmount() with one parameter. It will check that the user entered amount is less than or equal to the current balance using if-else condition. If the user entered amount is greater than that of the current balance it will show up the frame 13 otherwise it will show the frame 12. Both frames had the back to home button. I also added this function trigger when the user using the buttons at frame 10 for fixed amount. Now withdraw section is Completed!
Devlog 7 - Frame 14 & Frame 16 In frame 14 , It is the window that shows the user when the user select Change PIN option from home page. Then the user need to enter the current PIN (frame 6) then it will show up the frame 14. There the user needs to enter new 4 digit PIN as well as need to conform that! In frame 16 , it is shows when the New pin and conform PIN are matching, This windows shows the user that PIN has been changed successfully with a button that direct to home page menu. In here i created a function optPIN() which will direct to enter the current PIN and then it direct to changePinWindo() it will shows up the frame 14 with a dial pad the user can enter new PIN using the dial pad. Then created changePinInputFun() with one parameter which will the clicked number will enter in the first input box. After the 4 digits in the first input box it will direct to next input box. After both input boxes attain 4 digit and matching digits it will show up the changePinSuccess() (frame 16). Otherwise users can also click the update button from the frame 14, that will trigger updatePIN(), it will do the same thing! After all PIN changing option is completed!
Devlog 8 - Frame 17 & Frame 18 In frame 17 , It will just a loading screen with text quiting… In frame 18 , It is page that will shows after frame 17. And It is the last frame of this project! when the user clicks on quit button from homepage menu it will trigger the function optQuit(), then it will show up the frame 17 for 2.5 second then it will show frame 18 as the last frame! After all i created a another function called loadingWindow() which is the frame 11. I called this function everywhere as a processing windows as loading screen for 2 second. Now the project has been completed but it just looks like a template and only backend project, i need to wokr on CSS file to make this project more attractive!
Devlog 9 Created README.md file with i included the brief description. And also mentioned that need more to work on CSS! And also i included the use of each and main functions using table in md file . It is my first time ever using table in md file Also mentioned the details of each frame as in a table!
Lets continue on this project more! I decided to change the colours and themes into a single UI design. I choose dark blue colour and planned to remove bright colours such as yellow, green etc which makes the user more distraction from the website (not suitable for ATM Simulation). So lets redesign the whole webpage frame by frame again Devlog 10 - Frame 1 & Frame 2 & Frame 3 & Frame 4 First of all, i created a var css function of :root of colors i used in the website for making easy to reuse the color all over the website. In All over the website , I changed the white background into dark navy blue colour and sky-blue colour for basic normal text. And as well as i selected some font from google fonts . And i added a font name ‘Inter’ to the body for making the default font-family thought out the webpage. In frame 1 , I broke one line text into two line text and also removed the black background into default website background. And also changed the default font-family into ‘Segoe UI’ font-family which i had connected from google fonts. In frame 2 , I made the letters into uppercase which made the website heading more attractive and branding look! And as well as i changed the font into ‘Space Grotesk’. In frame 3 , I added a card effect to the whole section with a slight decreasing the darkness to the background colour. Changed the default input box colour into another colour that matches to the background and also given the colour to the border of input box when the user focus on that input box and also added :disabled condition to ensure and make identification to the user that it is un-editable by making the darkness in background colour of the input box. And also i added a fixed margin between texts and input boxes. Then i changed the submit button’s background colour into the default colour of the normal text which i saved in the :root function with white text. Btw, i also changed the text such as balance into initial balance and pin into security pin etc.. In frame 4 , As per the feedback i found that i made a lot of spelling mistaken in this frame. So i changed them into correct. Then i added the same background that i used in the frame 3 for the card. Then i added a successful tick mark icon at the top with green background with only using div tag. Then i changed the heading to ‘Account Created Successfully’ with a line break at before the text ‘Successfully’ which i had added span tag between them to change the colour of that word into green which gives more branding feel to the user! Then i added another sub-text below the heading. Then i created two cards one with holder name and another with account number. At last changed the animation that from appearing left and hiding to right into hiding and showing at right with ease-in-out function and also changed the animation time from 3s into 1.2s which made the animation more faster and furious!
Devlog 11 - Frame 5 & Frame 6 & Frame 7 In these days, i made a lot of changes in the project. I started to make the project more attractive and i need to be show up this project as 100% simulation design of ATM Machine. So i decided to use font-family of inter and selected a dark-shade background and theme for the whole project though out the entire project! In frame 5 , As we know this frame is the main frame and important frame which is showing the main options and homepage of this simulation. For that i changed the text interface into more useful and attractive. Currently the text at the top is just “Welcome, {username}” below that “{accountnumber}” just these only, which gives a normal and booring look and not much branding look. I need to make sure that to look and design like a branding project! For that i changed the text into like these “Welcome Back, {username}” then “{accountnumber}” below that i added another text “What would you like to do?”. At last for these texts i added different colour pattern and size according to text importance! then i spend time to work on the section of buttons, first of all i changed the texts from “Balance” into “Check Balance”, “Deposit” to “Deposit Money”, “Withdraw” to “Withdraw money” and “Quit” into “Exit”. As well as i changed the button background colour and border colours and removes the default border-radius and also added hovering animation which made the buttons more like a ATM. In frame 6 , I added another text below the current text and also changed the input box size and colour as well as the border and background colour and given the same button effects that of the main menu buttons (in frame 5). At there i added few more features - I updated pinInputFun() which is the user enters input with length of 4 letters then the dial-pad’s “Check” button will automatically highlights which the user can understand it time to enter that button and check the PIN. Then also removed the alert notification into that when the user enters wrong password the input password’s colour will change into red and then back to normal after 2 seconds. In frame 7 , I added another text below the current text and changed the button caption. And also designed the texts in different font size and font colour. and Addded the button style as in frame 5. NB: Tried out a lot of animations and styling ways to occur this output which wasted me a much time to spend on it and need to remove into trash :)
Devlog 12 - Remaining frames Today i decided to work all the remaining frames, which is almost 10+ frames. But it seems to be easy because i already setted the theme and colour palette now i just need to change accordingly. In frame 8 , I changed the font-size and colour of the heading and also changed the almost everything that of input field. In frame 9 , there are 2 main heading 2 big digits text and a button. first of all, i changed the colours and text font-size of all 4 texts into different ones. and made the button as other buttons with text “Back to Menu”. In frame 10 , There one heading and 6 buttons. i made the buttons as same as others and made the “Other” button with another text colour and border colour if the user clicks on that it will appear an input field and as well as dialpad. In frame 11 , Just created and made a animation which is changeing the opacity, and letterspacing as well as scale of the text which makes more interesting for the user as it will give a sign that it is under processing… In frame 12 , this frame is styled as everything same as that of the frame 9. In frame 13 , this frame is also same as that of frame 9 but there is some changes in font size and colour of text since it is for failure that for used red-shade colour text. In frame 14 , In this frame made the input section and text more styled adn also removed the outline of the input box if the user focus on the input box. In frame 16 , It is just a text with green coloured as indicating successful and a button with caption ‘Back to Menu’. In frame 17 , It is text with ‘Quitting…’ i added animation for that text which is changing its opacity, and motion of y-axis. In frame 18 , This is the last frame of this project it is as shows as the conclusion of the project. I added a span tag in-between the text for changeing colour of ‘ANK’ only into blue. After all these the basic styling is completed! Final Changed I noticed that it is very boring and showing separately that the default js alert() is function to change that i decided to make more attractive and simple one. So i created another div called ‘error_alert’ which is similarly show up the notification at top-right of the screen when there is any error or alert occurs. I added showing animation which is changed the x-axis and opacity of the div and as well as the hideing animation. For make this dynamically i created a new function called ‘errorAlert()’ with one parameter which is function as this div is displayed with the text that in parameter whenever the function is called. And also made that it need to hide automatically after 3 seconds with hideing animation. Then i changed the alert() into errorAlert({text}) which made more interesting for the website and ATM simulation. Solving Bugs I found i bug that in the section ‘change PIN’ there is a major bug which is like these, if the user enters ‘2222’ in the first input field and ‘1111’ in the second one then the user clicks on the update button it will update the PIN as ‘2222’ but the conform PIN and entered PIN are not same after a detailed look through my JS code i found the error at the function updatePIN() then i solved that bug. Iam proud that i solved this bug without help any resources.
Devlog 2.0 Today i am planning to make important change in the website. I found that, the website is looking bad and not working the UI properly in mobile screens. So i decided to make the website responsive and dynamic in mobile screens also as well as the desktop screens So let start to design the whole webpage again! Devlog 2.1 | Frame 1 - 5 First of all i made some research about making a webpage into a responsive one, and i found that we can simply edit the layout of the element according to screen width using @media function in CSS file. So i found that the maximum width of a mobile screen is 480px. So decided to adjust the @media function with screen width 480px. In frame 1, i doesn’t made any changes for the mobile screen. But in frame 2 i found that it doesn’t align the text exact that of the center of the screen height and width. And also find that the text typing animation is the issue regarding that! So i tried my maximum to solve that but unfortunately i couldn’t, So i decided to remove the animation in the mobile screen. In frame 3, Then i moved into next frame. I made the main div into 100% width and height that of the screen. Also made the input box into a little smaller than that of the 100% width. Similarly also changed the width of the button. In frame 4, I made everything exactly center to the whole screen. by making the layout position as absolute and then made top and left as 50% move. Solving Bugs and logical errors. I found a bug in the animation period on the mobile screen. It has been working perfectly until the animation between frames 3 & 4. I found that the fade-out animation of frame 3 is working perfectly but the fade-in animation of frame 4 is working but placing the frame at the very bottom-right side. After a huge think i created a id tag for a this special animation issue which has the issue for these two frames only. Then i connected them using JS now its working perfectly.
Devlog 2.2 - Frame 5 - 11 Today i started to continue the project after a two week break! So started to working hardly to submit my project. I am working on making the project mobile responsive. I completed everything under frame 4, Now working from frame 5… In frame 5 , I would like to make more attractive and user friendly. For that i made the main option and welcome text in full screen with height and width 100%. That’s all i made change in this frame, Btw i also changed the line-height, i felt that the texts in the frame 5 are feeling like congested, so i increased the line-height through it. In frame 6 , I found a logical error, whereas the Dialpad is not showing since i changed the subsection display into none before on mobile responsive. I think why should i solve this using CSS function such :has and :not, I need to hide the subsection on the main menu so i used the if the frame contains the id that #menu_option it has to hide the subsection and similarly if not make the height of the main section and subsection in 3:2 ratio with 100% width. Then i increased the gap between the Dialpad and as well as the width of the buttons. In frame 7 , Now i am facing i huge logical error again i have no idea and i failed that i already implemented method. As before i managed the logical error of showing subsection and main section just by using has and not function in CSS and that time it still hiding in the all frame, in ratio 3:2, whereas the subsection is showing where the Dialpad is doesn’t help. After a long try i found a solution from the google (redit) by replacing a line in the script code. I added a line of code which in the function ‘balWindow()’ first declaring the that in innerHTML of the subsection into empty then hide it now it would working without any error!… After all i made the text aligned center and also increased the width of the button… In frame 8 , It is really simple there is no any logical error just increased the width of input and also removed the padding of the whole content and so there changed only! In Frame 9 , I aligned all the text into center and also increased the width and margin of the button. In the frame file (‘frame9.html’), it looks like as we expected but in the main website (‘index.html’) it doesn’t seems good. Since the Dialpad is not hiding after onwards the frame 8, After a detailed observation i found that the Dialpad is never hiding even when the main menu’s frame is came again. Anyway i solved the error by doing the same way that i did in frame 7. In Frame 10 , In this frame i thought that to make the ‘other’ button into 100% and make the others into grid form. Since when we exclude the other button the number of buttons become odd and seems a bad alignment, So i added another button with amount 3000. Now the alignment working perfectly. My next issue in this frame was that when the user clicks on the other button the whole view will moves upward. So i made the height into auto then unfortunately its working i don’t know what is actually happing in my code!! In Frame 11 , i just hide the showing Dialpad i mean the subsection and made the main section into full screen. simply adding that subsection.innerHTML into empty in the function ‘loadingWindow()’
Devlog 2.3 - Frame 12 - 18 In Frame 12 , There is nothing extraordinary changes. Just aligned the whole texts into center and also increased the size of button as per made in other frames. In Frame 13 , I first made all texts into center then i feel like there are a lot space between the lines so tried solve that, I changed that by removing the margin top and margin bottom as well as the line spacing and line height. Btw i changed the button width as same others. In Frame 14 , In this frame i removed the default padding and margins and then restarted to arrange everything perfectly such as made to be aligned center and added margin top where was needed. Then also change the length of the button. In Frame 15 , There is no change which had removed this frame from main website. That for there is no change required but automatically it working perfectly on the mobile screens. In Frame 16 , Just aligned and made suitable change as per the same method that used in the previous frames. In Frame 17 , There is no change required since there is perfectly aligned already! In Frame 18 , It is very easy when sees but i tried to make it aligned as perfect centered it doesn’t working. I tried a lot of time and i found a cheap solution which had i adjust that using margin function! ##Now the UI design of the mobile responsive website is completed. But i found some bugs. Devlog 2.4 Now it’s time recheck that there is any bug or errors are occurring. First of all, i found a bug that only in desktop mode (in mobile screen it’s working perfectly) which is animation between two frames 3 and 4 are doesn’t working basic not showing. So i tried one by one each method and finally i found it! Then the animations is working perfectly. Then i would find any further bugs or errors in both screen. Then i noticed that the alert notification in mobile screen is seems to boring so i decide to change the fade-in and fade-out animation into transition of y axis from x axis. Now i think its time to reship the project!
Ships:
This is a ATM virtual simulation using JavaScript, HTML and CSS. I coded this from scratch by my own! I created a blueprint of this project on papers as roughly with 18 frames. So i just created each by each frame and connect together! In this project user can experience as same as that of a ATM in your browser (NB: Need to register each time you open the website). Now it’s time to ship this project but note that i would like share my JS and implementing logics only I spend time on CSS! I would like hear your response and like hear what should i change and suggest me what should i do in CSS, Iam totally confused about CSS styling this project
This is a ATM virtual simulation using JavaScript, HTML and CSS. I coded this from scratch by my own! I created a blueprint of this project on papers as roughly with 18 frames. So i just created each by each frame and connect together! You can experience the real ATM Machine in your Browser , note that it is just simulation. At first you need to fill the form to continue the the website and to enter the ATM. Then you can explore options such balance, deposit, withdraw, and as well as you can change the PIN. Note that it doesn’t connect with localStorage or any cloud storage that you need to fill and submit the form each time you visit the website, i will work on that to make it local storage available. And note that i changed the entire website testing colours theme into a dark-shaded theme which give a realistic experience of a ATM. Hope you will go through my devlogs and code as well as explore all the features in my website and feel to free make suggestions!
This is a ATM virtual simulation using JavaScript, HTML and CSS. I coded this from scratch by my own! I created a blueprint of this project on papers as roughly with 18 frames. So i just created each by each frame and connect together! This project is created on the mindset that may helpful for kids who can practice how the ATM works, Its just simulation. Anyway you need to fill a form to enter the page note that the all data in that form such your name and security it doesn’t saved or transferred to anywhere. It is just used for the name and pin for the better experience. User can check the balance, withdraw and deposit money and even user can change its own PIN! I tried to give by maximum effort for making the user experience better for that i added the animations, and also made responsive that user can experience the website from both devices - Desktop and as well as mobile phone. I hope you will try my website and explore every corner of the website in mobile and as well as in desktop, Btw feel free to give suggestions!...
|
1792824477.664222
|
1793688477.664222
|
|
69879
|
JT Innoventions Website by @ahmadhassan | Stardanc JT Innoventions Website by @ahmadhassan | Stardance...
|
ahmadhassan
|
1
|
10.11
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T15:43:24Z", "hours": 9.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a website for my school’s science olympiad where students from various schools come and participate in several STEM categories. This website was mainly to showcase our event and allow users to register for the event. I used another application to make the forms then integrated it to google sheets. I have attached some screenshots but i would recommend to check it out using this url: https://lgsjtinnoventions.com", "repo": "https://github.com/ahmad-56/jtinno26", "demo": "https://lgsjtinnoventions.com"}]...
|
[{"post_id": 81816, "ts": "202 [{"post_id": 81816, "ts": "2026-10-22T16:52:09Z", "hours": 1.1147, "text": "LGS JT Innoventions 2026 Hey Everyone, I worked on this website for our school’s science event. The event was a STEM Olympiad for Highschool students, therefore the webiste had a tech inspired layout and theme. The fonts used, background images and the category images were all integrated in such sense to make sure that the website gave the user the vibes of the event itself. To visit it yourself please use this url: https://www.lgsjtinnoventions.com/ Moreover coming to the features: Website is used by delegates to get a know-how of the event and their specific categories In the background we have the school’s picture followed up by a black overlay to create tech vibes. The cursor has a Hover Glow Effect The Header The Header or the navigation bar had some unique features such as Scroll Response . Wehnever the user scrolls to a new section the header is updated accordingly. For categories a Drop Down Menu was added for even easier navigation. Hero Tried to keep it simple, user is met by: logo date timer (now that the event is over, the countdown timer has automatically switched to a text message) registration button (most imp as this is what they are here for) The Category Page displays the logos of each category and allows users to download the study guides for each one of them. On hover a small decription is shown. When clicked users are redirected to specific category pages where they can download the studyguide or it in browser is given. The registrations section. The form was made in Fillout Forms which was integerated with Google Sheets so that the Event Management team could easily configure who has registered for the event. Note: Registration form is closed now. About Section Simple description about the event and its history. Sponsor(s) + Contact Section Location + Links Footer For credits and rights reservation Google Search Console & SEO Added meta descriptions for search results Connected it to Google Search Console to monitor its visibility in Google Search Please visit website or see attached images"}, {"post_id": 79826, "ts": "2026-10-15T15:36:59Z", "hours": 8.6447, "text": "I worked on school science event website"}]...
|
Title: JT Innoventions Website by @ahmadhassan | S Title: JT Innoventions Website by @ahmadhassan | Stardance
Devlogs:
I worked on school science event website
LGS JT Innoventions 2026 Hey Everyone, I worked on this website for our school’s science event. The event was a STEM Olympiad for Highschool students, therefore the webiste had a tech inspired layout and theme. The fonts used, background images and the category images were all integrated in such sense to make sure that the website gave the user the vibes of the event itself. To visit it yourself please use this url: https://www.lgsjtinnoventions.com/ Moreover coming to the features: Website is used by delegates to get a know-how of the event and their specific categories In the background we have the school’s picture followed up by a black overlay to create tech vibes. The cursor has a Hover Glow Effect The Header The Header or the navigation bar had some unique features such as Scroll Response . Wehnever the user scrolls to a new section the header is updated accordingly. For categories a Drop Down Menu was added for even easier navigation. Hero Tried to keep it simple, user is met by: logo date timer (now that the event is over, the countdown timer has automatically switched to a text message) registration button (most imp as this is what they are here for) The Category Page displays the logos of each category and allows users to download the study guides for each one of them. On hover a small decription is shown. When clicked users are redirected to specific category pages where they can download the studyguide or it in browser is given. The registrations section. The form was made in Fillout Forms which was integerated with Google Sheets so that the Event Management team could easily configure who has registered for the event. Note: Registration form is closed now. About Section Simple description about the event and its history. Sponsor(s) + Contact Section Location + Links Footer For credits and rights reservation Google Search Console & SEO Added meta descriptions for search results Connected it to Google Search Console to monitor its visibility in Google Search Please visit website or see attached images
Ships:
I made a website for my school’s science olympiad where students from various schools come and participate in several STEM categories. This website was mainly to showcase our event and allow users to register for the event. I used another application to make the forms then integrated it to google sheets. I have attached some screenshots but i would recommend to check it out using this url: https://lgsjtinnoventions.com...
|
1792810316.4602473
|
1792896716.4602473
|
|
61203
|
live elbow angle detection by @madheysh | Stardanc live elbow angle detection by @madheysh | Stardance...
|
madheysh
|
1
|
6.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T15:22:29Z", "hours": 6.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "so my first serious python project working with camera feeds, it detects your elbow angle live and displays it on the top left corner. This took way more time than it should have (I didn’t know what mediapipe was at first) so yea, feel free to try this lil thing out ( also streamlit was a DRAG)", "repo": "https://github.com/Madheysh/Elbow-angles", "demo": "https://elbow-angles-fg5f7dpb8qpqsebeatmb4v.streamlit.app/"}]...
|
[{"post_id": 79816, "ts": "202 [{"post_id": 79816, "ts": "2026-10-15T15:06:15Z", "hours": 0.3331, "text": "got a live demo"}, {"post_id": 79037, "ts": "2026-10-12T13:46:20Z", "hours": 0.9381, "text": "its working (forgot to post this omg)"}, {"post_id": 66578, "ts": "2026-09-12T12:41:07Z", "hours": 5.0678, "text": "A code to detect my hands, and elbows, eventually displaying my elbow angles in the video i upload i wanted to detect elbows but for sume reason it detected hands???? i fixed it but what was that about"}]...
|
Title: live elbow angle detection by @madheysh | S Title: live elbow angle detection by @madheysh | Stardance
Devlogs:
A code to detect my hands, and elbows, eventually displaying my elbow angles in the video i upload i wanted to detect elbows but for sume reason it detected hands???? i fixed it but what was that about
its working (forgot to post this omg)
got a live demo
Ships:
so my first serious python project working with camera feeds, it detects your elbow angle live and displays it on the top left corner. This took way more time than it should have (I didn’t know what mediapipe was at first) so yea, feel free to try this lil thing out ( also streamlit was a DRAG)...
|
1792857090.6919053
|
1792943490.6919053
|
|
69743
|
about me by @lollo22 | Stardance
|
lollo22
|
1
|
2.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T15:08:06Z", "hours": 2.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a personal site with a lot of passion and cool things!. I’m proud to have reached this result and i hope ypu enjoy visiting my work. btw I love pingu.", "repo": "https://github.com/lorenzo22mercurio/personal_site", "demo": "https://lorenzo22mercurio.github.io/personal_site/"}]...
|
[{"post_id": 79813, "ts": "202 [{"post_id": 79813, "ts": "2026-10-15T14:58:32Z", "hours": 1.8803, "text": "about me site! pingu. noot noot."}]...
|
Title: about me by @lollo22 | Stardance
Devlogs:
Title: about me by @lollo22 | Stardance
Devlogs:
about me site! pingu. noot noot.
Ships:
I made a personal site with a lot of passion and cool things!. I’m proud to have reached this result and i hope ypu enjoy visiting my work. btw I love pingu....
|
1792857344.154998
|
1792943744.154998
|
|
29
|
Hackatime Stats (Android App) by @stefdp | Stardan Hackatime Stats (Android App) by @stefdp | Stardance...
|
stefdp
|
1
|
13.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T14:29:01Z", "hours": 13.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "The main things i did were switching to Hackatime OAuth2 (earlier people were just pasting their API key in a password text input) and added the leaderboard tab. Most challenging part was the OAuth2 since this was my first time implementing OAuth2 in an Android app", "repo": "https://git.stefdp.com/Stef/Hackatime-Android-App", "demo": "https://hackatime.stefdp.com"}]...
|
[{"post_id": 58205, "ts": "202 [{"post_id": 58205, "ts": "2026-08-30T15:45:23Z", "hours": 4.1458, "text": "Added the leaderboard screen Took Pager , PullToRefresh and TextInput components from my other apps Added pull to refresh in all screens (goals, home, projects & leaderboard (for leaderboard u gotta do it specifically on the leaderboard, not outside)) Fixed a crash when opening a project git repo Fixed login failing to send the API key to the server because i had put it before actually storing the access token so it would error with “Missing access token” installed a lib to load images form the network (used for the avatars in the leaderboard) Improved the .shimmerable modifier Improved spacing in the settings save buttons between the text and the icon/loading spinner Fixed backend API’s sendApiKey function using wrong tag in logging"}, {"post_id": 57738, "ts": "2026-08-30T00:17:08Z", "hours": 2.3383, "text": "Fixed the missing types so now the app builds Updated all HTTP requests that needed an API key so instead of only fetching it, they also cache it Added a HTTP request to revoke the Hackatime OAuth2 access token which is used on logout Added waterfall padding to the Header component (waterfall padding is a larger horizontal padding for phones that have rounded/curved screen edges) Moved LoginScreen , ProjectsScreen , GoalsScreen and SettingsScreen to viewModel Added a scrollbar in all scrollable screens (took the scrollbar code from my other apps) Added the Notification object (this too took from ym other apps) Added base skeleton for the leaderboard tab (just shows “WIP”) GL to the GOIs, the commits for this devlogs were a mess cuz i made alot of changes at once and then tried to split it in multiple commits to avoid making a huge one 😭 🥀"}, {"post_id": 57662, "ts": "2026-08-29T21:41:13Z", "hours": 6.2825, "text": "Switched login to Hackatime OAuth2 (untested) Moved MainActivity to use a viewModel and update the FCM registering Moved HomeScreen to use a viewModel Added a custom Logger class (taken from my other apps) Entirely rewritten the API endpoints using the new API docs Updated the Firebase token registration handling (untested) Made SecureStorage keys constant Updated some function types Renamed “API Key” to “data” in the share to server switch as now it shares the access token Updated libs and raised target SDK from 36 (Android 16) to 37 (Android 17) Current code can not be currently built as most screens have missing types after the API endpoints rewrite also idk what to put as pic since it’s all code changes and can’t build the app so i’ll put the OAuth2 handling with the net.openid:appauth library"}]...
|
Title: Hackatime Stats (Android App) by @stefdp | Title: Hackatime Stats (Android App) by @stefdp | Stardance
Devlogs:
Switched login to Hackatime OAuth2 (untested) Moved MainActivity to use a viewModel and update the FCM registering Moved HomeScreen to use a viewModel Added a custom Logger class (taken from my other apps) Entirely rewritten the API endpoints using the new API docs Updated the Firebase token registration handling (untested) Made SecureStorage keys constant Updated some function types Renamed “API Key” to “data” in the share to server switch as now it shares the access token Updated libs and raised target SDK from 36 (Android 16) to 37 (Android 17) Current code can not be currently built as most screens have missing types after the API endpoints rewrite also idk what to put as pic since it’s all code changes and can’t build the app so i’ll put the OAuth2 handling with the net.openid:appauth library
Fixed the missing types so now the app builds Updated all HTTP requests that needed an API key so instead of only fetching it, they also cache it Added a HTTP request to revoke the Hackatime OAuth2 access token which is used on logout Added waterfall padding to the Header component (waterfall padding is a larger horizontal padding for phones that have rounded/curved screen edges) Moved LoginScreen , ProjectsScreen , GoalsScreen and SettingsScreen to viewModel Added a scrollbar in all scrollable screens (took the scrollbar code from my other apps) Added the Notification object (this too took from ym other apps) Added base skeleton for the leaderboard tab (just shows “WIP”) GL to the GOIs, the commits for this devlogs were a mess cuz i made alot of changes at once and then tried to split it in multiple commits to avoid making a huge one 😭 🥀
Added the leaderboard screen Took Pager , PullToRefresh and TextInput components from my other apps Added pull to refresh in all screens (goals, home, projects & leaderboard (for leaderboard u gotta do it specifically on the leaderboard, not outside)) Fixed a crash when opening a project git repo Fixed login failing to send the API key to the server because i had put it before actually storing the access token so it would error with “Missing access token” installed a lib to load images form the network (used for the avatars in the leaderboard) Improved the .shimmerable modifier Improved spacing in the settings save buttons between the text and the icon/loading spinner Fixed backend API’s sendApiKey function using wrong tag in logging
Ships:
The main things i did were switching to Hackatime OAuth2 (earlier people were just pasting their API key in a password text input) and added the leaderboard tab. Most challenging part was the OAuth2 since this was my first time implementing OAuth2 in an Android app...
|
1792669890.8951502
|
1792756290.8951502
|
|
69838
|
THE GAMES by @roshank | Stardance
|
roshank
|
1
|
19.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T14:01:38Z", "hours": 19.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I’ve made a static website of the OG games that was most played since 2000 yr.", "repo": "https://github.com/roshan-12design/The-most11", "demo": "https://roshan-12design.github.io/The-most11/"}]...
|
[{"post_id": 79796, "ts": "202 [{"post_id": 79796, "ts": "2026-10-15T13:47:53Z", "hours": 19.4564, "text": "To change the hover animation in games card of flip."}]...
|
Title: THE GAMES by @roshank | Stardance
Devlogs: Title: THE GAMES by @roshank | Stardance
Devlogs:
To change the hover animation in games card of flip.
Ships:
I’ve made a static website of the OG games that was most played since 2000 yr....
|
1792857362.468953
|
1792943762.468953
|
|
67542
|
Edith by @Midhunesh | Stardance
|
Midhunesh
|
1
|
3.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T12:20:38Z", "hours": 3.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I have made a language translator which translates some languages while travelling around the world. You can use this app while travelling in India, France, Germany, Spain and some other European countries. My main challenge was to convert one language to another but I managed it well because I knew python before doing this project. I feel proud that after launching this app, many tourists will be able to explore more places and can use this app to make conversations with the people in that country. People should accept this project because this will enhance tourism and help tourists.", "repo": "https://github.com/midhuneshbraj123/Edith", "demo": "https://midhuneshbraj123.github.io/Edith/"}]...
|
[{"post_id": 79765, "ts": "202 [{"post_id": 79765, "ts": "2026-10-15T09:46:38Z", "hours": 0.4669, "text": "Devlog Number 7: I have finally completed making the project. I have made some modifications like adding new languages which is used in India. The app is successfully working and I am excited to ship my project"}, {"post_id": 78961, "ts": "2026-10-12T06:19:38Z", "hours": 0.3722, "text": "Devlog Number 6: I have almost completed. There are few works left to do like writing Readme and some modifications in the code. I tested my translator app by translating various languages and it translated them successfully!"}, {"post_id": 78943, "ts": "2026-10-12T03:33:30Z", "hours": 0.2803, "text": "Devlog Number 5: I have almost finished the coding and now I am testing my translator app with various languages. It is working but I think it is bit slow. I am trying to fix that problem too."}, {"post_id": 78686, "ts": "2026-10-11T09:19:53Z", "hours": 0.4064, "text": "Devlog Number 4: I have decided to control my translator into few languages because translating many languages might be a burden for coding. So I decided to translate only German, French, Hindi, Dutch, Spanish and English."}, {"post_id": 78388, "ts": "2026-10-10T16:58:35Z", "hours": 0.3056, "text": "Devlog Number 3: I am continuing with coding works and the app has a problem with translating languages. I am trying to fix it along with writing the code."}, {"post_id": 77858, "ts": "2026-10-08T15:46:07Z", "hours": 0.2506, "text": "Devlog Number 2: I am giving my translator the right coding to translate any language to English. This app features to translate only to English due to its limitations. I am excited to execute it after coding. I think this will be a best app for travel around the world"}, {"post_id": 77603, "ts": "2026-10-07T16:29:57Z", "hours": 0.4936, "text": "Devlog Number 1: I am creating a translator app which makes life better and smoother while we are on a travel or trip. It translates any language into English. I was facing a problem with Hackatime because it didn’t record the time. So, I fixed that problem and continued to start coding."}]...
|
Title: Edith by @Midhunesh | Stardance
Devlogs:
D Title: Edith by @Midhunesh | Stardance
Devlogs:
Devlog Number 1: I am creating a translator app which makes life better and smoother while we are on a travel or trip. It translates any language into English. I was facing a problem with Hackatime because it didn’t record the time. So, I fixed that problem and continued to start coding.
Devlog Number 2: I am giving my translator the right coding to translate any language to English. This app features to translate only to English due to its limitations. I am excited to execute it after coding. I think this will be a best app for travel around the world
Devlog Number 3: I am continuing with coding works and the app has a problem with translating languages. I am trying to fix it along with writing the code.
Devlog Number 4: I have decided to control my translator into few languages because translating many languages might be a burden for coding. So I decided to translate only German, French, Hindi, Dutch, Spanish and English.
Devlog Number 5: I have almost finished the coding and now I am testing my translator app with various languages. It is working but I think it is bit slow. I am trying to fix that problem too.
Devlog Number 6: I have almost completed. There are few works left to do like writing Readme and some modifications in the code. I tested my translator app by translating various languages and it translated them successfully!
Devlog Number 7: I have finally completed making the project. I have made some modifications like adding new languages which is used in India. The app is successfully working and I am excited to ship my project
Ships:
I have made a language translator which translates some languages while travelling around the world. You can use this app while travelling in India, France, Germany, Spain and some other European countries. My main challenge was to convert one language to another but I managed it well because I knew python before doing this project. I feel proud that after launching this app, many tourists will be able to explore more places and can use this app to make conversations with the people in that country. People should accept this project because this will enhance tourism and help tourists....
|
1792857179.9345753
|
1792943579.9345753
|
|
66814
|
My own site! by @amarnath | Stardance
|
amarnath
|
2
|
5.0
|
5
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T10:51:49Z", "hours": 4.0, "multiplier": 1.07, "payout": 5, "blessing": "neutral", "text": "This is a Cool Website Model , Html and css are used to build the website model , I realize and corrected so many errors in the work of mine . ’ my readme.md ’ file in my repository is the creation of me . i learned so many lessons from this project, and the website is filled with hover effect in buttons and hyperlinks. and sure did you like my cool project, thank you.", "repo": "https://github.com/Shadow-X-TECH/AMAR-PROJECT.git", "demo": "https://shadow-x-tech.github.io/AMAR-PROJECT/"}, {"ship_num": 2, "ts": "2026-10-03T12:58:31Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is my First website ,please give your support & it is in under Development…", "repo": "https://github.com/Shadow-X-TECH/AMAR-PROJECT.git", "demo": "https://shadow-x-tech.github.io/AMAR-PROJECT/"}]...
|
[{"post_id": 79333, "ts": "202 [{"post_id": 79333, "ts": "2026-10-13T15:27:40Z", "hours": 0.8208, "text": "NEW UPDATES ARE OUT NOW."}, {"post_id": 78252, "ts": "2026-10-10T04:39:45Z", "hours": 1.1547, "text": "Buttons ,Hyperlinks And the readme is updated…"}, {"post_id": 78129, "ts": "2026-10-09T17:31:11Z", "hours": 2.3167, "text": "The Some buttons are updated and some pages are created . and also it is in underdevelopment."}, {"post_id": 76050, "ts": "2026-10-02T06:03:02Z", "hours": 0.6844, "text": "My First Website & it is under development…"}]...
|
Title: My own site! by @amarnath | Stardance
Devl Title: My own site! by @amarnath | Stardance
Devlogs:
My First Website & it is under development…
The Some buttons are updated and some pages are created . and also it is in underdevelopment.
Buttons ,Hyperlinks And the readme is updated…
NEW UPDATES ARE OUT NOW.
Ships:
This is my First website ,please give your support & it is in under Development…
This is a Cool Website Model , Html and css are used to build the website model , I realize and corrected so many errors in the work of mine . ’ my readme.md ’ file in my repository is the creation of me . i learned so many lessons from this project, and the website is filled with hover effect in buttons and hyperlinks. and sure did you like my cool project, thank you....
|
1792817361.2840717
|
1793681361.2840717
|
|
58573
|
spacecrew by @jakub-ginal | Stardance
|
jakub-ginal
|
1
|
227.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T10:03:07Z", "hours": 227.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "spacecrew - mission control for your terminal What I made: I got tired of opening five browser tabs to follow space, so I built one command that brings them all together. spacecrew tells you who’s in orbit this second, tells you when the ISS is about to cross your sky, counts down the next liftoff with a rocket photo beside it, displays NASA’s Picture of the Day in terminal characters, and tracks solar activity with a verdict on whether you’ll see auroras tonight. What was challenging: At one point, every satellite prediction was perfectly calculated, but for the mirror image of Earth. A single flipped sign in the orbital math put passes on the wrong side of the planet, and nothing looked obviously broken until I cross-checked each pass against an independent physics library, minute by minute, until reality matched. The other fight was time itself: switching an app built around UTC to local time without breaking a single countdown. What I’m proud of: The app now distrusts the internet by default. Dead APIs, rate limits, airplane mode: it keeps working from cached data and built-in satellite TLEs whenever possible. It also includes real orbital calculations, satellite tracking, radio frequencies, and a full interactive terminal interface, all installable with a single command. Features: People in Space, NASA APOD, Launches, ISS Tracking, Space Weather, Satellite Passes, Themes, Dashboard The GitHub README includes a detailed breakdown of the features, modes, configuration options, and command-line flags, along with screenshots and examples. Try it yourself: Install with either command: pipx install spacecrew or pip install spacecrew", "repo": "https://github.com/jakub-ginal/spacecrew", "demo": "https://pypi.org/project/spacecrew/"}]...
|
[{"post_id": 79650, "ts": "202 [{"post_id": 79650, "ts": "2026-10-14T21:49:05Z", "hours": 0.5514, "text": "spacecrew - quick terminal tour Quick tour of spacecrew in action: interactive menu, people in space, live ISS position, Tonight’s Best satellite passes, a launch countdown with the rocket photo view and more. Video is now available on the GitHub project page."}, {"post_id": 79610, "ts": "2026-10-14T18:19:01Z", "hours": 2.1667, "text": "v1.2.18 and v1.2.19 - Documentation and run fixes **Tzdata dependency ** - added the Windows-only tzdata dependency so timezones resolve correctly instead of falling back to UTC Dashboard navigation - fixed Enter-to-exit on Windows using msvcrt , while keeping existing POSIX behavior unchanged Module execution - python -m spacecrew now works via the new __main__.py Version detection - falls back to pyproject.toml in development checkouts to avoid reporting stale versions Docs - completely rewrote the README with feature sections and screenshots Published - v1.2.19 is now available on GitHub and PyPI"}, {"post_id": 79498, "ts": "2026-10-14T09:55:01Z", "hours": 10.1031, "text": "v1.2.17 - Timezones, rocket photos, and satellite pass fixes Local timezones - added --timezone flag, saved timezone settings, and automatic detection. Times display locally (e.g. 20:00 CEST), with UTC in parentheses in detail views UTC consistency - countdowns and --json output remain in UTC Rocket photos - press p in launch details to view a large, high-resolution rocket photo with minimal accompanying info Satellite pass accuracy - fixed a rotation sign error that caused incorrect predictions, verified against an independent reference to within ±1 minute Low-elevation passes - fixed filtering that silently dropped visible passes Settings persistence - fixed settings that sometimes failed to save Clean JSON output - status banners no longer pollute --json output Published - v1.2.17 is now available on GitHub and PyPI"}, {"post_id": 79399, "ts": "2026-10-13T20:13:28Z", "hours": 10.2, "text": "v1.2.16 - Fixes and configuration improvements Cache control - fixed --no-cache , which was parsed but previously ignored Custom configuration - added --config DIR , SPACE_CREW_CONFIG_DIR , and XDG_CONFIG_HOME support for isolated configs NASA API errors - added clearer DEMO_KEY rate-limit hints with an API link, plus 5xx and offline guidance in the APOD view SatNOGS cache - fixed cache typing to support both dictionaries and lists Offline weather - fixed offline responses to return the complete expected data structure Code cleanup - removed a duplicate docstring Documentation - updated the man page to v1.2.16 and synced README examples for --json and --config Published - v1.2.16 is now available on GitHub and PyPI"}, {"post_id": 79178, "ts": "2026-10-12T22:22:37Z", "hours": 8.0389, "text": "v1.2.15 - Scriptability, radio, and aurora JSON output - added --json support for passes, people, and launches, with machine-readable data for scripts, jq , cron jobs, and home automation Pass data - JSON includes satellite name, group, start/end times, max elevation, duration, magnitude, quality, cloud cover, moon phase, and visibility Downlink frequencies - new FREQUENCIES panel with SatNOGS transmitter data, including frequency, mode, uplink, baud rate, and description Offline frequency cache - transmitter data cached for 90 days and available offline Aurora forecast - dashboard and space weather view now show whether aurora is Overhead possible, Low on horizon possible, or Unlikely based on Kp and your location Reliable satellite data - 396-satellite offline TLE fallback across all 13 groups, with stale-cache failover when Celestrak is unavailable Faster fetching - shorter timeouts and improved data loading Published - v1.2.15 is now available on GitHub and PyPI"}, {"post_id": 79019, "ts": "2026-10-12T11:47:58Z", "hours": 10.3897, "text": "v1.2.14 - Live dashboard, countdowns, satellite info, and fetch improvements Live dashboard - updates every second, with background data refreshes every 60 seconds and Enter-only exit Countdowns everywhere - shows time until passes, red NOW for active passes, and dim ENDED for finished passes Pass filtering - ended passes are filtered out so lists start with the next upcoming pass Satellite info panel - displays NORAD ID, launch date, operator, country, and status from cached SatNOGS data Reliable data fetching - fast failover to stale cache and 396-satellite built-in fallback Parallel fetching - satellite groups load in parallel for better performance Cache protection - empty results never overwrite valid cached data Dashboard accuracy - Tiangong no longer displays ISS data Published - v1.2.14 is now available on GitHub and PyPI"}, {"post_id": 78781, "ts": "2026-10-11T16:18:02Z", "hours": 9.7994, "text": "v1.2.13 - Satellite data, dashboard, performance and documentation Offline satellite data - 396 real satellites across all 13 groups Satellite groups - fixed dead GROUP=other and empty iridium groups Dashboard fixes - q quits, Tiangong displays correct data, and unused imports removed Lazy-loaded images - Pillow and chafa no longer required at startup, with a new --no-image flag Performance improvements - optimized observer calculations and parallel group fetching Cache fixes - empty results no longer overwrite cached satellite data Documentation - updated README with all modes, configuration, and flags Man page - fixed documentation and removed duplicate man directory Published - v1.2.13 is now available on GitHub and PyPI"}, {"post_id": 78657, "ts": "2026-10-11T06:07:37Z", "hours": 11.6944, "text": "v1.2.12 - Bug fixes and packaging improvements Core stability - fixed argument parsing and replaced recursive refresh loops with proper loops Astronaut view - fixed crashes when photos are missing Moon phases - all 8 phases now work correctly, with proper UTC timestamps Satellite passes - fixed filter persistence, empty lists, group tags, and missing URLs ISS tracking - improved retries, offline handling, and location accuracy Dashboard - fixed storm level detection, now shows actual conditions Cache and display - improved corrupted cache handling and screen clearing APOD and space weather - fixed API key handling, date requests, and image loading with fallbacks Packaging - wheel now includes the man page and fallback TLE data Published - v1.2.12 is now available on GitHub and PyPI"}, {"post_id": 78399, "ts": "2026-10-10T17:20:02Z", "hours": 10.4, "text": "v1.2.10, v1.2.11 - Satellite tracker improvements Fallback TLE data - 24 satellites across 6 groups, available when network sources fail Detail view fixes Full-width panels - expanded panels for improved layout Faster TLE fetching Published - v1.2.11 is now available on GitHub and PyPI"}, {"post_id": 78156, "ts": "2026-10-09T20:18:48Z", "hours": 9.8033, "text": "v1.2.9 - Satellite detail view & themes Satellite detail redesign - new panel and table layout matching the launches and people views Header panel - satellite name, group badge, and FAV indicator Next Pass panel - highlighted summary with time, elevation, direction, duration, magnitude, quality, cloud cover, and moon phase Full passes table - date, time, max elevation, direction, duration, magnitude, quality, cloud cover, moon phase, and visibility Visibility indicators - green rows for visible passes and dimmed rows for non-visible passes Refined styling - subtle borders and softer colors for a cleaner look 10 themes - added Dracula Published - v1.2.9 is now available on GitHub and PyPI"}, {"post_id": 77945, "ts": "2026-10-08T22:00:46Z", "hours": 6.5667, "text": "v1.2.8 - Satellite Passes visual improvements Panel-based layout - each satellite now has a bordered card with its number, name, group badge, and [FAV] indicator Multiple passes - up to 3 passes per satellite, configurable Quality-tier borders - Best, Good, OK, and Dim tiers with matching colors Clean pass data - time, elevation, compass direction, duration, magnitude, and quality score Visibility details - cloud cover, moon phase, and VISIBLE status shown for each pass Satellite groups - fixed categorization: ISS & Stations, Starlink, Navigation, Science & Weather, Other Favorites integration - [FAV] badge, favorites-only mode with 5 , and F to toggle favorites Detail view navigation - Enter returns to the previous list instead of the main menu Published - v1.2.8 is now available on GitHub and PyPI"}, {"post_id": 77840, "ts": "2026-10-08T14:16:42Z", "hours": 9.7667, "text": "v1.2.6 - Satellite groups, navigation & visual improvements Satellite groups - proper categorization: ISS & Stations, Starlink, Navigation, Science & Weather, Other Detail view navigation - Enter now returns to the previous list instead of the main menu Cloud cover - displayed as ☁︎ XX% Azimuth - compass direction added, e.g. 45°NE → 135°SE Moon phase - displayed as Moon XX% Code cleanup Published - v1.2.5 is now available on GitHub and PyPI"}, {"post_id": 77668, "ts": "2026-10-07T19:40:00Z", "hours": 10.5333, "text": "v1.2.6 - Favorites satellites Favorites - add or remove satellites from the detail view with F Favorites mode - press 5 in the satellite passes menu to show only favorited satellites Favorites badge - ★ FAV badge shown in satellite detail view Persistent favorites - saved in ~/.config/spacecrew/config.toml Published - v1.2.5 is now available on GitHub and PyPI"}, {"post_id": 77374, "ts": "2026-10-06T18:11:40Z", "hours": 9.9, "text": "v1.2.5 - Satellite tracker fixes & polish Tonight’s Best fixed - no longer loads 10k+ Starlink satellites, only ISS + Stations Tiered quality system - Best (mag < 2, el > 45°, dur > 5 min), Good (mag < 4, el > 25°), OK (mag < 5.5, el > 15°) Filter menu - fixed duplicate code Calculating passes… - removed duplicate message Man page - added man spacecrew Shell completions - added bash, zsh, and fish support via spacecrew --generate-completion GitHub Release - added automatic release creation on tag push Published - v1.2.5 is now available on GitHub and PyPI"}, {"post_id": 77171, "ts": "2026-10-05T22:04:11Z", "hours": 5.9333, "text": "v1.2.3 - Pass Predictor fixes and UX improvements Tonight’s Best no longer loads 10k+ Starlink satellites Tiered quality system - Best, Good, OK instead of one strict filter Filter menu duplicate code fixed Calculating passes… duplicate message removed Night filtering fixed with sun_el_max v1.2.3 on GitHub and PyPI."}, {"post_id": 77035, "ts": "2026-10-05T13:12:07Z", "hours": 10.0, "text": "v1.2.3 - Satellite tracker redesign Pass Predictor redesign - Tonight’s Best, All Passes, Specific Satellite Cloud cover from Open-Meteo, cached for 1 hour Moon phase via local Meeus algorithm, fully offline Night pass info - cloud cover and moon phase when relevant Satellite groups reorganized for easier browsing Direct satellite search across all groups Type badges added to satellite details Simplified controls - Enter = back everywhere"}, {"post_id": 76893, "ts": "2026-10-04T23:29:10Z", "hours": 9.3603, "text": "v1.2.3 - Cloud cover and moon phase now appear alongside every predicted pass in the satellite tracker. Cloud cover - Real-time data from Open-Meteo. Shows percentage at exact pass time and location. Cached 1 hour. Moon phase - Local Meeus algorithm, zero API calls. Only shown for night passes (sun elevation < -6°). Displays phase name + illumination: MOON FIRST QUARTER 44%. v1.2.3 on GitHub and PyPI."}, {"post_id": 76707, "ts": "2026-10-04T11:48:44Z", "hours": 10.5, "text": "spacecrew v1.2.1 Dashboard mode (option 8) - 2-column btop-like grid: ISS/Tiangong/Passes left, Weather/People/Launches/APOD right; renders via Rich Layout grid 9 themes: default, Catppuccin Mocha/Latte, Tokyo Night, Gruvbox, Nord, Everforest, Rose Pine, Kanagawa - semantic styles, zero hardcoded colors, persist in config.toml v1.2.1 on GitHub and PyPI"}, {"post_id": 76537, "ts": "2026-10-03T21:14:34Z", "hours": 10.4872, "text": "v1.1.18 - Themes, progress bars, consistent Enter=back 5 themes: default, dark, solarized, dracula, monokai Progress bars: spinner for single fetch, count bar for multi-group TLE Enter = back everywhere for consistent navigation Replaced hardcoded colors with semantic theme styles Theme selection persists in config.toml v1.1.18 on GitHub and PyPI."}, {"post_id": 76264, "ts": "2026-10-02T23:41:38Z", "hours": 10.5508, "text": "v1.1.16-17 - Pass quality scores and real magnitudes: Quality (0-100) - elevation, duration, darkness, magnitude, rarity combined Real mags - per-type standards (ISS -1.3, Starlink 5.5, GPS 4.0) with range + phase correction Phase angle math - proper Sun-sat-observer geometry for realistic brightness UI shows both - mag -2.6 Q80 on every pass in list and detail views All groups covered - stations, Starlink, military, NOAA, GOES, GPS, Galileo, BeiDou, Iridium Offline–irst - cached TLE, zero network needed The predictor now tells you which passes are worth waking up for. v1.1.17 on GitHub and PyPI."}, {"post_id": 76099, "ts": "2026-10-02T10:05:54Z", "hours": 8.0419, "text": "spacecrew v1.1.15 - Satellite Pass Predictor update. Fixed TLE cache: each group (stations, starlink, military, gps, weather, science, amateur, radar, cubesat, geo, iridium). Menu: full menu (all/tonight/stations/starlink quick/days config), tonight’s best (quick 24h), specific satellite picker with group selector, search, pagination, 7-day detail, change location, back. 11 groups, 11,500+ satellites. Works offline (cached TLEs, 1-day TTL). v1.1.15 on GitHub and PyPI."}, {"post_id": 75904, "ts": "2026-10-01T15:35:24Z", "hours": 11.1056, "text": "spacecrew v1.1.14 - Satellite Pass Predictor. Menu option 6 / spacecrew –mode passes. Celestrak TLE data + local sgp4 propagation, no API keys, no rate limits, works offline after first run. Tracks ISS, Starlink trains, and many more satellites. Calculates visible passes for the next three days: elevation >10°, sky dark, satellite sunlit. Shows start time, max elevation, duration, direction, visibility flag. Location saved to config, prompted once. Example: ISS 05:53 UTC max 53° 6min west→east ✓, Starlink-1017 11:21 UTC max 80° 7min ✓. v1.1.14 on GitHub and PyPI."}, {"post_id": 75680, "ts": "2026-09-30T18:50:20Z", "hours": 10.3292, "text": "Today I released spacecrew v1.1.10, v1.1.11, and v1.1.12. v1.1.10 - Added –offline flag: runs entirely from local SQLite cache with zero network requests. Avoids rate limits, works without internet. All four modes work if previously cached. Banner shows “Offline mode: using cached data only”. v1.1.11 - Launch countdown timer: live T- in launches list (cyan to yellow to red as launch nears, LAUNCHED for past). Space Weather dashboard (menu option 5, –mode weather): solar flares (X/M/C colored), CMEs with speed, Kp index with storm level (Quiet to G5), NOAA 3-day forecast highlights. All cached (1-day TTL), works offline. v1.1.12 - Fixed few things. Published to GitHub (tags v1.1.10, v1.1.11, v1.1.12) and PyPI via automated workflow."}, {"post_id": 75385, "ts": "2026-09-29T22:02:03Z", "hours": 5.7128, "text": "Today I released spacecrew v1.1.9. The main addition is an ISS Tracker using wheretheiss.at (real-time TLE calculation) as primary source with open-notify.org fallback - shows latitude, longitude, altitude (~425 km), velocity (~27,500 km/h), visibility, and location name via reverse geocoding, plus a Google Maps link. Core improvements: persistent SQLite cache with configurable TTL (30 days default) for all API responses, a config file at ~/.config/spacecrew/config.toml (NASA API key, cache TTL, theme, default mode), CLI arguments for direct mode access (–mode {people,apod,launches,iss}), –clear-cache, –no-cache, Windows-compatible screen clearing, and Python 3.10 support via conditional tomli dependency. Published to GitHub (tag v1.1.9) and PyPI via the automated workflow."}, {"post_id": 74899, "ts": "2026-09-28T15:39:13Z", "hours": 10.4289, "text": "Today I worked on spacecrew and enhanced the project with major improvements. I enhanced NASA’s Astronomy Picture of the Day (APOD) with date navigation (previous day), HD image opening in browser, and full metadata display. I also added a new Upcoming Launches feature using The Space Devs API, showing 15 upcoming launches from all agencies with a clean panel-based list view and detailed view including links to launch transmissions when available, mission patch, and info/Wikipedia links. I restructured the CLI with a main menu for three modes (People in Space, APOD, Launches), added NASA_API_KEY environment variable support with DEMO_KEY fallback, and implemented in-memory session caching for both features. Published v1.1.8 to GitHub and PyPI."}, {"post_id": 74542, "ts": "2026-09-27T16:30:32Z", "hours": 4.5878, "text": "Today I worked on spacecrew and made several improvements to the project. I added NASA’s Astronomy Picture of the Day (APOD), so users can now view the current astronomical picture directly from the CLI. I also tested the feature, updated the project documentation, and published the updated version to GitHub and PyPI. I also worked on improving the overall project and making the CLI easier to use."}, {"post_id": 74031, "ts": "2026-09-26T15:43:20Z", "hours": 0.2561, "text": "Im working on spacecrew, a linux command line tool for managing and organizing space-related information directly from the terminal. Im improving the CLI, adding features, fixing bugs, and making the project easier to use."}]...
|
Title: spacecrew by @jakub-ginal | Stardance
Devl Title: spacecrew by @jakub-ginal | Stardance
Devlogs:
Im working on spacecrew, a linux command line tool for managing and organizing space-related information directly from the terminal. Im improving the CLI, adding features, fixing bugs, and making the project easier to use.
Today I worked on spacecrew and made several improvements to the project. I added NASA’s Astronomy Picture of the Day (APOD), so users can now view the current astronomical picture directly from the CLI. I also tested the feature, updated the project documentation, and published the updated version to GitHub and PyPI. I also worked on improving the overall project and making the CLI easier to use.
Today I worked on spacecrew and enhanced the project with major improvements. I enhanced NASA’s Astronomy Picture of the Day (APOD) with date navigation (previous day), HD image opening in browser, and full metadata display. I also added a new Upcoming Launches feature using The Space Devs API, showing 15 upcoming launches from all agencies with a clean panel-based list view and detailed view including links to launch transmissions when available, mission patch, and info/Wikipedia links. I restructured the CLI with a main menu for three modes (People in Space, APOD, Launches), added NASA_API_KEY environment variable support with DEMO_KEY fallback, and implemented in-memory session caching for both features. Published v1.1.8 to GitHub and PyPI.
Today I released spacecrew v1.1.9. The main addition is an ISS Tracker using wheretheiss.at (real-time TLE calculation) as primary source with open-notify.org fallback - shows latitude, longitude, altitude (~425 km), velocity (~27,500 km/h), visibility, and location name via reverse geocoding, plus a Google Maps link. Core improvements: persistent SQLite cache with configurable TTL (30 days default) for all API responses, a config file at ~/.config/spacecrew/config.toml (NASA API key, cache TTL, theme, default mode), CLI arguments for direct mode access (–mode {people,apod,launches,iss}), –clear-cache, –no-cache, Windows-compatible screen clearing, and Python 3.10 support via conditional tomli dependency. Published to GitHub (tag v1.1.9) and PyPI via the automated workflow.
Today I released spacecrew v1.1.10, v1.1.11, and v1.1.12. v1.1.10 - Added –offline flag: runs entirely from local SQLite cache with zero network requests. Avoids rate limits, works without internet. All four modes work if previously cached. Banner shows “Offline mode: using cached data only”. v1.1.11 - Launch countdown timer: live T- in launches list (cyan to yellow to red as launch nears, LAUNCHED for past). Space Weather dashboard (menu option 5, –mode weather): solar flares (X/M/C colored), CMEs with speed, Kp index with storm level (Quiet to G5), NOAA 3-day forecast highlights. All cached (1-day TTL), works offline. v1.1.12 - Fixed few things. Published to GitHub (tags v1.1.10, v1.1.11, v1.1.12) and PyPI via automated workflow.
spacecrew v1.1.14 - Satellite Pass Predictor. Menu option 6 / spacecrew –mode passes. Celestrak TLE data + local sgp4 propagation, no API keys, no rate limits, works offline after first run. Tracks ISS, Starlink trains, and many more satellites. Calculates visible passes for the next three days: elevation >10°, sky dark, satellite sunlit. Shows start time, max elevation, duration, direction, visibility flag. Location saved to config, prompted once. Example: ISS 05:53 UTC max 53° 6min west→east ✓, Starlink-1017 11:21 UTC max 80° 7min ✓. v1.1.14 on GitHub and PyPI.
spacecrew v1.1.15 - Satellite Pass Predictor update. Fixed TLE cache: each group (stations, starlink, military, gps, weather, science, amateur, radar, cubesat, geo, iridium). Menu: full menu (all/tonight/stations/starlink quick/days config), tonight’s best (quick 24h), specific satellite picker with group selector, search, pagination, 7-day detail, change location, back. 11 groups, 11,500+ satellites. Works offline (cached TLEs, 1-day TTL). v1.1.15 on GitHub and PyPI.
v1.1.16-17 - Pass quality scores and real magnitudes: Quality (0-100) - elevation, duration, darkness, magnitude, rarity combined Real mags - per-type standards (ISS -1.3, Starlink 5.5, GPS 4.0) with range + phase correction Phase angle math - proper Sun-sat-observer geometry for realistic brightness UI shows both - mag -2.6 Q80 on every pass in list and detail views All groups covered - stations, Starlink, military, NOAA, GOES, GPS, Galileo, BeiDou, Iridium Offline–irst - cached TLE, zero network needed The predictor now tells you which passes are worth waking up for. v1.1.17 on GitHub and PyPI.
v1.1.18 - Themes, progress bars, consistent Enter=back 5 themes: default, dark, solarized, dracula, monokai Progress bars: spinner for single fetch, count bar for multi-group TLE Enter = back everywhere for consistent navigation Replaced hardcoded colors with semantic theme styles Theme selection persists in config.toml v1.1.18 on GitHub and PyPI.
spacecrew v1.2.1 Dashboard mode (option 8) - 2-column btop-like grid: ISS/Tiangong/Passes left, Weather/People/Launches/APOD right; renders via Rich Layout grid 9 themes: default, Catppuccin Mocha/Latte, Tokyo Night, Gruvbox, Nord, Everforest, Rose Pine, Kanagawa - semantic styles, zero hardcoded colors, persist in config.toml v1.2.1 on GitHub and PyPI
v1.2.3 - Cloud cover and moon phase now appear alongside every predicted pass in the satellite tracker. Cloud cover - Real-time data from Open-Meteo. Shows percentage at exact pass time and location. Cached 1 hour. Moon phase - Local Meeus algorithm, zero API calls. Only shown for night passes (sun elevation < -6°). Displays phase name + illumination: MOON FIRST QUARTER 44%. v1.2.3 on GitHub and PyPI.
v1.2.3 - Satellite tracker redesign Pass Predictor redesign - Tonight’s Best, All Passes, Specific Satellite Cloud cover from Open-Meteo, cached for 1 hour Moon phase via local Meeus algorithm, fully offline Night pass info - cloud cover and moon phase when relevant Satellite groups reorganized for easier browsing Direct satellite search across all groups Type badges added to satellite details Simplified controls - Enter = back everywhere
v1.2.3 - Pass Predictor fixes and UX improvements Tonight’s Best no longer loads 10k+ Starlink satellites Tiered quality system - Best, Good, OK instead of one strict filter Filter menu duplicate code fixed Calculating passes… duplicate message removed Night filtering fixed with sun_el_max v1.2.3 on GitHub and PyPI.
v1.2.5 - Satellite tracker fixes & polish Tonight’s Best fixed - no longer loads 10k+ Starlink satellites, only ISS + Stations Tiered quality system - Best (mag < 2, el > 45°, dur > 5 min), Good (mag < 4, el > 25°), OK (mag < 5.5, el > 15°) Filter menu - fixed duplicate code Calculating passes… - removed duplicate message Man page - added man spacecrew Shell completions - added bash, zsh, and fish support via spacecrew --generate-completion GitHub Release - added automatic release creation on tag push Published - v1.2.5 is now available on GitHub and PyPI
v1.2.6 - Favorites satellites Favorites - add or remove satellites from the detail view with F Favorites mode - press 5 in the satellite passes menu to show only favorited satellites Favorites badge - ★ FAV badge shown in satellite detail view Persistent favorites - saved in ~/.config/spacecrew/config.toml Published - v1.2.5 is now available on GitHub and PyPI
v1.2.6 - Satellite groups, navigation & visual improvements Satellite groups - proper categorization: ISS & Stations, Starlink, Navigation, Science & Weather, Other Detail view navigation - Enter now returns to the previous list instead of the main menu Cloud cover - displayed as ☁︎ XX% Azimuth - compass direction added, e.g. 45°NE → 135°SE Moon phase - displayed as Moon XX% Code cleanup Published - v1.2.5 is now available on GitHub and PyPI
v1.2.8 - Satellite Passes visual improvements Panel-based layout - each satellite now has a bordered card with its number, name, group badge, and [FAV] indicator Multiple passes - up to 3 passes per satellite, configurable Quality-tier borders - Best, Good, OK, and Dim tiers with matching colors Clean pass data - time, elevation, compass direction, duration, magnitude, and quality score Visibility details - cloud cover, moon phase, and VISIBLE status shown for each pass Satellite groups - fixed categorization: ISS & Stations, Starlink, Navigation, Science & Weather, Other Favorites integration - [FAV] badge, favorites-only mode with 5 , and F to toggle favorites Detail view navigation - Enter returns to the previous list instead of the main menu Published - v1.2.8 is now available on GitHub and PyPI
v1.2.9 - Satellite detail view & themes Satellite detail redesign - new panel and table layout matching the launches and people views Header panel - satellite name, group badge, and FAV indicator Next Pass panel - highlighted summary with time, elevation, direction, duration, magnitude, quality, cloud cover, and moon phase Full passes table - date, time, max elevation, direction, duration, magnitude, quality, cloud cover, moon phase, and visibility Visibility indicators - green rows for visible passes and dimmed rows for non-visible passes Refined styling - subtle borders and softer colors for a cleaner look 10 themes - added Dracula Published - v1.2.9 is now available on GitHub and PyPI
v1.2.10, v1.2.11 - Satellite tracker improvements Fallback TLE data - 24 satellites across 6 groups, available when network sources fail Detail view fixes Full-width panels - expanded panels for improved layout Faster TLE fetching Published - v1.2.11 is now available on GitHub and PyPI
v1.2.12 - Bug fixes and packaging improvements Core stability - fixed argument parsing and replaced recursive refresh loops with proper loops Astronaut view - fixed crashes when photos are missing Moon phases - all 8 phases now work correctly, with proper UTC timestamps Satellite passes - fixed filter persistence, empty lists, group tags, and missing URLs ISS tracking - improved retries, offline handling, and location accuracy Dashboard - fixed storm level detection, now shows actual conditions Cache and display - improved corrupted cache handling and screen clearing APOD and space weather - fixed API key handling, date requests, and image loading with fallbacks Packaging - wheel now includes the man page and fallback TLE data Published - v1.2.12 is now available on GitHub and PyPI
v1.2.13 - Satellite data, dashboard, performance and documentation Offline satellite data - 396 real satellites across all 13 groups Satellite groups - fixed dead GROUP=other and empty iridium groups Dashboard fixes - q quits, Tiangong displays correct data, and unused imports removed Lazy-loaded images - Pillow and chafa no longer required at startup, with a new --no-image flag Performance improvements - optimized observer calculations and parallel group fetching Cache fixes - empty results no longer overwrite cached satellite data Documentation - updated README with all modes, configuration, and flags Man page - fixed documentation and removed duplicate man directory Published - v1.2.13 is now available on GitHub and PyPI
v1.2.14 - Live dashboard, countdowns, satellite info, and fetch improvements Live dashboard - updates every second, with background data refreshes every 60 seconds and Enter-only exit Countdowns everywhere - shows time until passes, red NOW for active passes, and dim ENDED for finished passes Pass filtering - ended passes are filtered out so lists start with the next upcoming pass Satellite info panel - displays NORAD ID, launch date, operator, country, and status from cached SatNOGS data Reliable data fetching - fast failover to stale cache and 396-satellite built-in fallback Parallel fetching - satellite groups load in parallel for better performance Cache protection - empty results never overwrite valid cached data Dashboard accuracy - Tiangong no longer displays ISS data Published - v1.2.14 is now available on GitHub and PyPI
v1.2.15 - Scriptability, radio, and aurora JSON output - added --json support for passes, people, and launches, with machine-readable data for scripts, jq , cron jobs, and home automation Pass data - JSON includes satellite name, group, start/end times, max elevation, duration, magnitude, quality, cloud cover, moon phase, and visibility Downlink frequencies - new FREQUENCIES panel with SatNOGS transmitter data, including frequency, mode, uplink, baud rate, and description Offline frequency cache - transmitter data cached for 90 days and available offline Aurora forecast - dashboard and space weather view now show whether aurora is Overhead possible, Low on horizon possible, or Unlikely based on Kp and your location Reliable satellite data - 396-satellite offline TLE fallback across all 13 groups, with stale-cache failover when Celestrak is unavailable Faster fetching - shorter timeouts and improved data loading Published - v1.2.15 is now available on GitHub and PyPI
v1.2.16 - Fixes and configuration improvements Cache control - fixed --no-cache , which was parsed but previously ignored Custom configuration - added --config DIR , SPACE_CREW_CONFIG_DIR , and XDG_CONFIG_HOME support for isolated configs NASA API errors - added clearer DEMO_KEY rate-limit hints with an API link, plus 5xx and offline guidance in the APOD view SatNOGS cache - fixed cache typing to support both dictionaries and lists Offline weather - fixed offline responses to return the complete expected data structure Code cleanup - removed a duplicate docstring Documentation - updated the man page to v1.2.16 and synced README examples for --json and --config Published - v1.2.16 is now available on GitHub and PyPI
v1.2.17 - Timezones, rocket photos, and satellite pass fixes Local timezones - added --timezone flag, saved timezone settings, and automatic detection. Times display locally (e.g. 20:00 CEST), with UTC in parentheses in detail views UTC consistency - countdowns and --json output remain in UTC Rocket photos - press p in launch details to view a large, high-resolution rocket photo with minimal accompanying info Satellite pass accuracy - fixed a rotation sign error that caused incorrect predictions, verified against an independent reference to within ±1 minute Low-elevation passes - fixed filtering that silently dropped visible passes Settings persistence - fixed settings that sometimes failed to save Clean JSON output - status banners no longer pollute --json output Published - v1.2.17 is now available on GitHub and PyPI
v1.2.18 and v1.2.19 - Documentation and run fixes **Tzdata dependency ** - added the Windows-only tzdata dependency so timezones resolve correctly instead of falling back to UTC Dashboard navigation - fixed Enter-to-exit on Windows using msvcrt , while keeping existing POSIX behavior unchanged Module execution - python -m spacecrew now works via the new __main__.py Version detection - falls back to pyproject.toml in development checkouts to avoid reporting stale versions Docs - completely rewrote the README with feature sections and screenshots Published - v1.2.19 is now available on GitHub and PyPI
spacecrew - quick terminal tour Quick tour of spacecrew in action: interactive menu, people in space, live ISS position, Tonight’s Best satellite passes, a launch countdown with the rocket photo view and more. Video is now available on the GitHub project page.
Ships:
spacecrew - mission control for your terminal What I made: I got tired of opening five browser tabs to follow space, so I built one command that brings them all together. spacecrew tells you who’s in orbit this second, tells you when the ISS is about to cross your sky, counts down the next liftoff with a rocket photo beside it, displays NASA’s Picture of the Day in terminal characters, and tracks solar activity with a verdict on whether you’ll see auroras tonight. What was challenging: At one point, every satellite prediction was perfectly calculated, but for the mirror image of Earth. A single flipped sign in the orbital math put passes on the wrong side of the planet, and nothing looked obviously broken until I cross-checked each pass against an independent physics library, minute by minute, until reality matched. The other fight was time itself: switching an app built around UTC to local time without breaking a single countdown. What I’m proud of: The app now distrusts the internet by default. Dead APIs, rate limits, airplane mode: it keeps working from cached data and built-in satellite TLEs whenever possible. It also includes real orbital calculations, satellite tracking, radio frequencies, and a full interactive terminal interface, all installable with a single command. Features: People in Space, NASA APOD, Launches, ISS Tracking, Space Weather, Satellite Passes, Themes, Dashboard The GitHub README includes a detailed breakdown of the features, modes, configuration options, and command-line flags, along with screenshots and examples. Try it yourself: Install with either command: pipx install spacecrew or pip install spacecrew...
|
1792756516.4344232
|
1792842916.4344232
|
|
17291
|
an EPIC Light Sail Simulation by @SpaceEvee | Star an EPIC Light Sail Simulation by @SpaceEvee | Stardance...
|
SpaceEvee
|
1
|
49.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T08:42:06Z", "hours": 49.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This is the first ship of an interstellar light sail simulation for a research paper I am working on. The simulation models an idealised Gaussian laser beam with a fixed nominal propagation direction along +Z. The beam settings include peak intensity (I_0), waist (w_0), wavelength (\\lambda), and lateral beam-centre offsets. The sail model estimates radiation-pressure force and torque over the discretised surface, then advances translational and rotational state. The workbench records time histories so configurations can be inspected and compared. A local radiative-equilibrium calculation estimates surface temperature from absorbed illumination and the configured emissivity. Few Notes: The simulation is not very optimised so it may take some time to function on lower end PCs I have added a video performing some functions of the software in the github ReadMe. (As in the ship of my last project, many people told me to have a video as they didn’t want to download the package itself.) If there the runner throws an exception or error pop up at the end, i.e. after running the program, the data can still be accessed (plots, .json, .csv, etc.)", "repo": "https://github.com/Evyvaan-Space-Lover/Nyx", "demo": "https://github.com/Evyvaan-Space-Lover/Nyx/releases/tag/v1.0"}]...
|
[{"post_id": 79732, "ts": "202 [{"post_id": 79732, "ts": "2026-10-15T07:54:51Z", "hours": 0.3886, "text": "Mini Devlog :yoooo-chat-whats-up–are-yall-ready-for-another-weekly-journal–i-hope-so-kitty-dance-mb-sorry-for-b: I completed the parameter sweep and it works (still pretty glitchy tho) and added a 3d visualisation section to the program (prolly the most visually appealing thing ) GONNA SHIP NOW YAY"}, {"post_id": 79555, "ts": "2026-10-14T16:10:53Z", "hours": 9.5667, "text": "NYX DEVLOG MUHEHEHEHHE (NO IDEA BOUT THE INDEX) sorry for being dead for so long. i was busy with irl stuff The Simulator is ALMOST done yay I made the GUI for yall (the program is not user friendly ) and now the simulated data can FINALLY be saved into .json and .csv and some boring physics shit heres the run down: Physics World frame inertia calculation. i CORRECTED THE INERTIA TENSOR TRANSFORMATION so that angular momentum and rotational dynamics use the inertia tensor in the world frame Rotational Dynamics used the rigid body rotational equation normalised the intermediate RK4 orientation states (so yeah lots of attitude control yk) paraboloid COM and hemisphere COM were straight wrong as i found out so they are fixed now respectively GUI added a workbench/gui for the whole program (I HATE this) and in the repo i added the Read Me after two gazillion years ill say Nyx (the simulator) is done and i can ship it FINALLY after so long and start working on the paper FINALLY. btw the BEANS SHALL PREVAIL some things the 3d geometry visualization doesnt work with the gui stack so ill have to fix that and the parameter sweep doesnt work any bit. these things ill have to do before the first ship and besides ill say the same is pretty good and completed"}, {"post_id": 59110, "ts": "2026-08-31T18:55:55Z", "hours": 7.2819, "text": "DEVLOG 6 (and seven soon) Its been soooooooooooooooo long since my last devlog. I had my exams and well I couldn’t much and didn’t write my devlog last time. Oh you don’t know what Nyx? It is a light sail simulation I am working on for a paper I am writing (btw there are emojis now so cool stuff got added when I was gone) NEW ADDITIONS: Introduce a materials package (Material dataclass + presets: Graphene, Aluminium, SiliconCarbide) and an analysis package with plotting helpers and an Experiment helper. Update SimMain to accept a material for each sail type, pull reflectivity/absorptivity from the material, and record max/average temperature history. Fix numeric/geometry issues: correct sphere inertia, improve normal/rotation math for sphere and paraboloid, and ensure positions use rotated local coordinates. Add multiple debug/test scripts and enable analysis plotting at the end of simLoop to visualize force, position, velocity, acceleration, angular velocity and temperature histories. I did NOT copy-paste the commit here trust. If you think I did, you're wrong Well, thats it for now, Ill put more effort in the next devlog See YALL soon (no one cares, but I care )"}, {"post_id": 28180, "ts": "2026-07-14T09:47:43Z", "hours": 8.4836, "text": "DEVLOG - smth im bad at remembering numbers and its been sometime too WHATS UP LOVELY PEOPLE Another Nyx devlog it is! You dont know what Nyx is? Its my light sail simulation for a paper im working on! I did some code refining and yeah lots of boring stuff. Used the Stefan–Boltzmann equilibrium approximation to estimate local surface temperature. Added a temperature mapping system based on absorbed laser intensity (Absolutely obsolete btw ): ) Fixed the paraboloid sign issue so it curved in the intended direction. -Also tried using other libraries for rendering, but MatPlotLib is the best option right now other miscellaneous stuff I cant remember honestly (Next devlog will be more detailed trust)"}, {"post_id": 16406, "ts": "2026-06-26T18:05:21Z", "hours": 12.8053, "text": "Devlog - 4 YO PEOPLE, i am BACK (ts so cringe. literally nobody cares). This devlog is about how almost lost my minds migrating my simulation’s rotation calculations into Quaternions , integrating RK4 and as always solving bugs, because Nyx is filled with bugs (Oh, you dont know what Nyx is? well it is my passive beam riding light sail simulation, for a research paper im working on) Euler Angles Started Tweaking Ok so before this, Nyx used normal Euler angle rotations using thetaX and thetaY for orientation. At first it worked fine, but after longer simulations stuff started tweaking hard The sphere and paraboloid would randomly start flattening into weird pancake/disc things (which i lowkey think might be cuz matplotlib library hates me idk) , rotations started looking cursed, and the orientation slowly became unstable over time. At first I thought matplotlib was just being goofy again, but nah, the actual orientation system itself was kinda cooked (most likely) . The problem was that Euler angles are not really built for stable continuous 3D rotational dynamics. Rotations started interfering with each other and the geometry would slowly drift into nonphysical states during longer simulations.Basically Nyx had reached the point where the old orientation system just wasn’t enough anymore :(. Quaternion Migration (The Pain of ’26 ) So yeah, this devlog was basically the “quaternion suffering” update I replaced the entire orientation system with quaternions. Instead of storing orientation as separate thetaX and thetaY values, Nyx now stores orientation as a quaternion state directly integrated through RK4.This was honestly one of the biggest upgrades to the simulator so far because now orientation itself is physically simulated instead of just being fake angle accumulation and stuff. The migration was WAY more painful than expected At first literally everything exploded: infinitiesNaNsbroken, normals-cursed, and sphere geometry intensity overflows. At one point the simulator straight up started generating inf values and the sphere looked like it got compressed by a hydraulic press .The biggest issue ended up being invalid normal vectors inside the sphere mesh generation. A single broken normal could completely destroy the intensity calculations and then infect the entire simulation state with NaNs.After fixing all that, Nyx now has stable quaternion orientation. quaternion vector rotation, quaternion RK4 integration, much more stable rotational dynamics, no more gimbal-lock-type weird ahh stuff . This was really hard for me to add lol now what ? so thats what took more than 10 hours. I think my boi Nyx is doing pretty good and will help me in great magnitude for my research paper. For now at least, i wanna make a sort of UI and replace ‘matplotlib’ with smth better cuz’ I am lowkey fed up. I would also like to add a feature of mass data collection, so that there is much data to study. – that’s it for me today, I hope YOU have a great day! (BTW, i have no idea why the markdown on this devlog is so weird, i can not seem to fix it lowkey)"}, {"post_id": 13176, "ts": "2026-06-21T15:45:41Z", "hours": 4.1456, "text": "Devlog 3 - NYX HAS FRIED MY BRAN btw, if you havent seen my older devlogs, you are legally obligated to do so, and if not done, the police shall come for you so, after my last devlog, added a new sail geometry, fixed A LOT OF BUGS and made the code efficient (not really) and improved the physics calculation, to a more complex force calculation engine (its not an engine, idk why i said that). also, i realized paraboloids are pretty niffty as with some dingle dangle, we can have a circular sail without even making a new class! Features i added Paraboloid geometry, cleaned up the radiation pressure code, quivers for visualization and better force equation. the force equation is now F = fmag * (2*cosTheta*normal - beamDih) (this is embarrassing, but in my code, the beam direction variable is beamDih ) Whats Next? wanna improve the visualization local force vector rendering time evolution moving sail oscillation simulation ability to upload a .obj file as a sail (The image below is when i broke the code. i accidentally wrote =+ instead of += )"}, {"post_id": 10036, "ts": "2026-06-16T16:26:48Z", "hours": 3.6364, "text": "Nyx Devlog #2: The Curved Sail Arc Status: Nyx V2 Complete Mood: Sleep-deprived aerospace engineer Bug Count: We don’t talk about the 90° bug. So… what happened? This dev cycle started with a simple goal: “Let’s add some tilt to the sails.” Several hours later, we somehow ended up with a computational beam-riding lightsail simulator. Oops. Gaussian Beams Are Cool Nyx uses a Gaussian beam to model the laser intensity distribution. def gaussian(r): return I0 * np.exp(-2 * r 2 / w0 2) Basically: The beam is strongest at the center. The farther away you go, the weaker it gets. Nature decided lasers should have exponential decay because apparently linear wasn’t dramatic enough. Tilting the Sails The sails can now rotate about the X and Y axes. def rotateX(vector, angle): x, y, z = vector return np.array([ x, y*np.cos(angle) - z*np.sin(angle), y*np.sin(angle) + z*np.cos(angle) ]) def rotateY(vector, angle): x, y, z = vector return np.array([ x*np.cos(angle) + z*np.sin(angle), y, -x*np.sin(angle) + z*np.cos(angle) ]) This worked surprisingly well. Unlike the visualization. Introducing: The Hemisphere™ Rectangle sails were getting lonely. So Nyx gained a new geometry: class SphereLightSail(): (Yes, it’s technically a hemisphere. Naming things is hard.) The hemisphere is discretized into tiny patches that each experience radiation pressure from the laser beam. Science! Radiation Pressure Time Every tiny patch gets hit by photons. The force magnitude is calculated using: fmag = (2 * I / c) * (cosTheta**2) * dA where: I is beam intensity, c is the speed of light, cosTheta accounts for sail orientation, dA is the patch area. Translation: Tiny packets of light aggressively boop the sail. Torque Has Entered The Chat Turns out forces acting away from the center like to cause problems. tau = np.cross(position, F) Nyx now computes total torque acting on the sail. This means we can begin asking questions like: Which geometries are stable? instead of: Why is Matplotlib gaslighting me? Visualization! Nyx can now visualize sail geometries using 3D plots. scatter = ax.scatter( self.xPoints, self.yPoints, self.zPoints, c=self.intensities, cmap=‘plasma’, s=30 ) With a colorbar: fig.colorbar( scatter, ax=ax, label=‘Beam Intensity (W/m^2)’ ) And even a force vector: ax.quiver( 0, 0, 0, Force[0], Force[1], Force[2], color=‘red’, length=2, normalize=True ) It looks surprisingly professional. Until you rotate it to 90°. The Great 90° Incident At one point, Nyx decided that rotating things by 90° was optional. Several debugging sessions later: “It’s probably fine.” Nyx is now operating under the internationally recognized engineering principle of: If the physics works, Future Me can fix the plotting (ik guys, ELITE mindset). What Nyx V2 Can Do Nyx V2 ├── Gaussian beam model ✓ ├── Rectangle sail geometry ✓ ├── Hemisphere sail geometry ✓ ├── Sail tilting ✓ ├── Radiation pressure forces ✓ ├── Torque calculations ✓ ├── Intensity heatmaps ✓ └── Force vector visualization ✓ What’s Next? We’re moving beyond random shapes. Future geometries need to answer one question: Could someone actually use this as a lightsail? Possible candidates: □ Paraboloids □ Hyperboloids □ Other beam-riding geometries from literature Party hats are currently under review. Final Thoughts Nyx V2 was the phase where the project stopped feeling like a collection of scripts and started feeling like an actual research tool. Also, I now know far more about Matplotlib’s quirks than any human"}, {"post_id": 7524, "ts": "2026-06-12T15:48:47Z", "hours": 2.8322, "text": "#Devlog 001 — The Beginning of Nyx (I call the light sails Nyx, because why not) Started building the computational simulator for my project on passive beam-riding stability of interstellar lightsails. What I implemented: -A Gaussian laser beam model to simulate how beam intensity changes from the center outward. -A rectangular lightsail simulator divided into tiny surface patches. -Calculations for net force and net torque acting on the sail. -Support for changing the sail’s position relative to the beam. -Support for x-axis and y-axis tilts, allowing the sail to change orientation. -Validation tests showing that centered sails produce near-zero torque and that results converge with increasing resolution. -The beginnings of a 3D geometry engine, including a hemispherical lightsail generator using spherical coordinates. -3D visualization of the hemispherical sail to verify that the geometry was generated correctly. (Am currently working on the the force and torque calculation for the spherical sails) (The test cases are for tilted says, the first one is not tilted at all and the last one is tilted 90 degrees)"}]...
|
Title: an EPIC Light Sail Simulation by @SpaceEvee Title: an EPIC Light Sail Simulation by @SpaceEvee | Stardance
Devlogs:
#Devlog 001 — The Beginning of Nyx (I call the light sails Nyx, because why not) Started building the computational simulator for my project on passive beam-riding stability of interstellar lightsails. What I implemented: -A Gaussian laser beam model to simulate how beam intensity changes from the center outward. -A rectangular lightsail simulator divided into tiny surface patches. -Calculations for net force and net torque acting on the sail. -Support for changing the sail’s position relative to the beam. -Support for x-axis and y-axis tilts, allowing the sail to change orientation. -Validation tests showing that centered sails produce near-zero torque and that results converge with increasing resolution. -The beginnings of a 3D geometry engine, including a hemispherical lightsail generator using spherical coordinates. -3D visualization of the hemispherical sail to verify that the geometry was generated correctly. (Am currently working on the the force and torque calculation for the spherical sails) (The test cases are for tilted says, the first one is not tilted at all and the last one is tilted 90 degrees)
Nyx Devlog #2: The Curved Sail Arc Status: Nyx V2 Complete Mood: Sleep-deprived aerospace engineer Bug Count: We don’t talk about the 90° bug. So… what happened? This dev cycle started with a simple goal: “Let’s add some tilt to the sails.” Several hours later, we somehow ended up with a computational beam-riding lightsail simulator. Oops. Gaussian Beams Are Cool Nyx uses a Gaussian beam to model the laser intensity distribution. def gaussian(r): return I0 * np.exp(-2 * r 2 / w0 2) Basically: The beam is strongest at the center. The farther away you go, the weaker it gets. Nature decided lasers should have exponential decay because apparently linear wasn’t dramatic enough. Tilting the Sails The sails can now rotate about the X and Y axes. def rotateX(vector, angle): x, y, z = vector return np.array([ x, y*np.cos(angle) - z*np.sin(angle), y*np.sin(angle) + z*np.cos(angle) ]) def rotateY(vector, angle): x, y, z = vector return np.array([ x*np.cos(angle) + z*np.sin(angle), y, -x*np.sin(angle) + z*np.cos(angle) ]) This worked surprisingly well. Unlike the visualization. Introducing: The Hemisphere™ Rectangle sails were getting lonely. So Nyx gained a new geometry: class SphereLightSail(): (Yes, it’s technically a hemisphere. Naming things is hard.) The hemisphere is discretized into tiny patches that each experience radiation pressure from the laser beam. Science! Radiation Pressure Time Every tiny patch gets hit by photons. The force magnitude is calculated using: fmag = (2 * I / c) * (cosTheta**2) * dA where: I is beam intensity, c is the speed of light, cosTheta accounts for sail orientation, dA is the patch area. Translation: Tiny packets of light aggressively boop the sail. Torque Has Entered The Chat Turns out forces acting away from the center like to cause problems. tau = np.cross(position, F) Nyx now computes total torque acting on the sail. This means we can begin asking questions like: Which geometries are stable? instead of: Why is Matplotlib gaslighting me? Visualization! Nyx can now visualize sail geometries using 3D plots. scatter = ax.scatter( self.xPoints, self.yPoints, self.zPoints, c=self.intensities, cmap=‘plasma’, s=30 ) With a colorbar: fig.colorbar( scatter, ax=ax, label=‘Beam Intensity (W/m^2)’ ) And even a force vector: ax.quiver( 0, 0, 0, Force[0], Force[1], Force[2], color=‘red’, length=2, normalize=True ) It looks surprisingly professional. Until you rotate it to 90°. The Great 90° Incident At one point, Nyx decided that rotating things by 90° was optional. Several debugging sessions later: “It’s probably fine.” Nyx is now operating under the internationally recognized engineering principle of: If the physics works, Future Me can fix the plotting (ik guys, ELITE mindset). What Nyx V2 Can Do Nyx V2 ├── Gaussian beam model ✓ ├── Rectangle sail geometry ✓ ├── Hemisphere sail geometry ✓ ├── Sail tilting ✓ ├── Radiation pressure forces ✓ ├── Torque calculations ✓ ├── Intensity heatmaps ✓ └── Force vector visualization ✓ What’s Next? We’re moving beyond random shapes. Future geometries need to answer one question: Could someone actually use this as a lightsail? Possible candidates: □ Paraboloids □ Hyperboloids □ Other beam-riding geometries from literature Party hats are currently under review. Final Thoughts Nyx V2 was the phase where the project stopped feeling like a collection of scripts and started feeling like an actual research tool. Also, I now know far more about Matplotlib’s quirks than any human
Devlog 3 - NYX HAS FRIED MY BRAN btw, if you havent seen my older devlogs, you are legally obligated to do so, and if not done, the police shall come for you so, after my last devlog, added a new sail geometry, fixed A LOT OF BUGS and made the code efficient (not really) and improved the physics calculation, to a more complex force calculation engine (its not an engine, idk why i said that). also, i realized paraboloids are pretty niffty as with some dingle dangle, we can have a circular sail without even making a new class! Features i added Paraboloid geometry, cleaned up the radiation pressure code, quivers for visualization and better force equation. the force equation is now F = fmag * (2*cosTheta*normal - beamDih) (this is embarrassing, but in my code, the beam direction variable is beamDih ) Whats Next? wanna improve the visualization local force vector rendering time evolution moving sail oscillation simulation ability to upload a .obj file as a sail (The image below is when i broke the code. i accidentally wrote =+ instead of += )
Devlog - 4 YO PEOPLE, i am BACK (ts so cringe. literally nobody cares). This devlog is about how almost lost my minds migrating my simulation’s rotation calculations into Quaternions , integrating RK4 and as always solving bugs, because Nyx is filled with bugs (Oh, you dont know what Nyx is? well it is my passive beam riding light sail simulation, for a research paper im working on) Euler Angles Started Tweaking Ok so before this, Nyx used normal Euler angle rotations using thetaX and thetaY for orientation. At first it worked fine, but after longer simulations stuff started tweaking hard The sphere and paraboloid would randomly start flattening into weird pancake/disc things (which i lowkey think might be cuz matplotlib library hates me idk) , rotations started looking cursed, and the orientation slowly became unstable over time. At first I thought matplotlib was just being goofy again, but nah, the actual orientation system itself was kinda cooked (most likely) . The problem was that Euler angles are not really built for stable continuous 3D rotational dynamics. Rotations started interfering with each other and the geometry would slowly drift into nonphysical states during longer simulations.Basically Nyx had reached the point where the old orientation system just wasn’t enough anymore :(. Quaternion Migration (The Pain of ’26 ) So yeah, this devlog was basically the “quaternion suffering” update I replaced the entire orientation system with quaternions. Instead of storing orientation as separate thetaX and thetaY values, Nyx now stores orientation as a quaternion state directly integrated through RK4.This was honestly one of the biggest upgrades to the simulator so far because now orientation itself is physically simulated instead of just being fake angle accumulation and stuff. The migration was WAY more painful than expected At first literally everything exploded: infinitiesNaNsbroken, normals-cursed, and sphere geometry intensity overflows. At one point the simulator straight up started generating inf values and the sphere looked like it got compressed by a hydraulic press .The biggest issue ended up being invalid normal vectors inside the sphere mesh generation. A single broken normal could completely destroy the intensity calculations and then infect the entire simulation state with NaNs.After fixing all that, Nyx now has stable quaternion orientation. quaternion vector rotation, quaternion RK4 integration, much more stable rotational dynamics, no more gimbal-lock-type weird ahh stuff . This was really hard for me to add lol now what ? so thats what took more than 10 hours. I think my boi Nyx is doing pretty good and will help me in great magnitude for my research paper. For now at least, i wanna make a sort of UI and replace ‘matplotlib’ with smth better cuz’ I am lowkey fed up. I would also like to add a feature of mass data collection, so that there is much data to study. – that’s it for me today, I hope YOU have a great day! (BTW, i have no idea why the markdown on this devlog is so weird, i can not seem to fix it lowkey)
DEVLOG - smth im bad at remembering numbers and its been sometime too WHATS UP LOVELY PEOPLE Another Nyx devlog it is! You dont know what Nyx is? Its my light sail simulation for a paper im working on! I did some code refining and yeah lots of boring stuff. Used the Stefan–Boltzmann equilibrium approximation to estimate local surface temperature. Added a temperature mapping system based on absorbed laser intensity (Absolutely obsolete btw ): ) Fixed the paraboloid sign issue so it curved in the intended direction. -Also tried using other libraries for rendering, but MatPlotLib is the best option right now other miscellaneous stuff I cant remember honestly (Next devlog will be more detailed trust)
DEVLOG 6 (and seven soon) Its been soooooooooooooooo long since my last devlog. I had my exams and well I couldn’t much and didn’t write my devlog last time. Oh you don’t know what Nyx? It is a light sail simulation I am working on for a paper I am writing (btw there are emojis now so cool stuff got added when I was gone) NEW ADDITIONS: Introduce a materials package (Material dataclass + presets: Graphene, Aluminium, SiliconCarbide) and an analysis package with plotting helpers and an Experiment helper. Update SimMain to accept a material for each sail type, pull reflectivity/absorptivity from the material, and record max/average temperature history. Fix numeric/geometry issues: correct sphere inertia, improve normal/rotation math for sphere and paraboloid, and ensure positions use rotated local coordinates. Add multiple debug/test scripts and enable analysis plotting at the end of simLoop to visualize force, position, velocity, acceleration, angular velocity and temperature histories. I did NOT copy-paste the commit here trust. If you think I did, you're wrong Well, thats it for now, Ill put more effort in the next devlog See YALL soon (no one cares, but I care )
NYX DEVLOG MUHEHEHEHHE (NO IDEA BOUT THE INDEX) sorry for being dead for so long. i was busy with irl stuff The Simulator is ALMOST done yay I made the GUI for yall (the program is not user friendly ) and now the simulated data can FINALLY be saved into .json and .csv and some boring physics shit heres the run down: Physics World frame inertia calculation. i CORRECTED THE INERTIA TENSOR TRANSFORMATION so that angular momentum and rotational dynamics use the inertia tensor in the world frame Rotational Dynamics used the rigid body rotational equation normalised the intermediate RK4 orientation states (so yeah lots of attitude control yk) paraboloid COM and hemisphere COM were straight wrong as i found out so they are fixed now respectively GUI added a workbench/gui for the whole program (I HATE this) and in the repo i added the Read Me after two gazillion years ill say Nyx (the simulator) is done and i can ship it FINALLY after so long and start working on the paper FINALLY. btw the BEANS SHALL PREVAIL some things the 3d geometry visualization doesnt work with the gui stack so ill have to fix that and the parameter sweep doesnt work any bit. these things ill have to do before the first ship and besides ill say the same is pretty good and completed
Mini Devlog :yoooo-chat-whats-up–are-yall-ready-for-another-weekly-journal–i-hope-so-kitty-dance-mb-sorry-for-b: I completed the parameter sweep and it works (still pretty glitchy tho) and added a 3d visualisation section to the program (prolly the most visually appealing thing ) GONNA SHIP NOW YAY
Ships:
This is the first ship of an interstellar light sail simulation for a research paper I am working on. The simulation models an idealised Gaussian laser beam with a fixed nominal propagation direction along +Z. The beam settings include peak intensity (I_0), waist (w_0), wavelength (\lambda), and lateral beam-centre offsets. The sail model estimates radiation-pressure force and torque over the discretised surface, then advances translational and rotational state. The workbench records time histories so configurations can be inspected and compared. A local radiative-equilibrium calculation estimates surface temperature from absorbed illumination and the configured emissivity. Few Notes: The simulation is not very optimised so it may take some time to function on lower end PCs I have added a video performing some functions of the software in the github ReadMe. (As in the ship of my last project, many people told me to have a video as they didn’t want to download the package itself.) If there the runner throws an exception or error pop up at the end, i.e. after running the program, the data can still be accessed (plots, .json, .csv, etc.)...
|
1792716663.1302147
|
1792803063.1302147
|
|
68278
|
My pet by @rigid_valmeo | Stardance
|
rigid_valmeo
|
1
|
5.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T08:32:23Z", "hours": 5.0, "multiplier": 5.17, "payout": 0, "blessing": "neutral", "text": "I created IchiPett, a small desktop pet inspired by my actual cat. It features a walking cat, occasional idle animations, an interactive fish that can be dragged toward the cat, and floating hearts when the cat is clicked. One of the most challenging parts was making the cat move around the window while keeping the interactions working properly, especially dragging the fish and making it disappear temporarily before reappearing. I’m proud that I was able to turn my idea into a working project and create the sprites and animations myself. To test IchiPett, users can download the project or its available build, follow the instructions in the README, and try clicking the cat and dragging the fish toward it. By the way, I made the artworks too. Those took me about 45 minutes.", "repo": "https://github.com/rigidvalmeo03/ichi-s-pet", "demo": "https://rigid-valmeo.itch.io/ichi-pet"}]...
|
[{"post_id": 79564, "ts": "202 [{"post_id": 79564, "ts": "2026-10-14T16:58:35Z", "hours": 4.9158, "text": "yayyy im so happy this worked! my cat is purfectly running mwehehehe"}, {"post_id": 77489, "ts": "2026-10-07T06:38:39Z", "hours": 0.5014, "text": "HELPPP why is it showing only the corner of my cat drawing lololol"}]...
|
Title: My pet by @rigid_valmeo | Stardance
Devlog Title: My pet by @rigid_valmeo | Stardance
Devlogs:
HELPPP why is it showing only the corner of my cat drawing lololol
yayyy im so happy this worked! my cat is purfectly running mwehehehe
Ships:
I created IchiPett, a small desktop pet inspired by my actual cat. It features a walking cat, occasional idle animations, an interactive fish that can be dragged toward the cat, and floating hearts when the cat is clicked. One of the most challenging parts was making the cat move around the window while keeping the interactions working properly, especially dragging the fish and making it disappear temporarily before reappearing. I’m proud that I was able to turn my idea into a working project and create the sprites and animations myself. To test IchiPett, users can download the project or its available build, follow the instructions in the README, and try clicking the cat and dragging the fish toward it. By the way, I made the artworks too. Those took me about 45 minutes....
|
1792857193.902813
|
1793721193.902813
|
|
65727
|
VeryOS by @disgustalt | Stardance
|
disgustalt
|
1
|
13.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T08:18:30Z", "hours": 13.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Made a WebOS that has a camera and filesystem(ish)! :) I had a lot of trouble with setting up the camera stuff. The camera worked at first and then suddenly stopped working. The facingMode of the camera was worse though. It worked nicely until I added the function to take pictures, and then it stopped. Had to change that logic entirely TwT Anywayyyy, I’m pretty proud to have made the camera and stuff work! (I’ve never worked with camera before :D) I’m gonna work more on adding new features to this soon! There’s exams so I’m pretty slow :p", "repo": "https://github.com/disgustalt/VeryOS", "demo": "https://vos.disgustalt.qzz.io"}]...
|
[{"post_id": 77602, "ts": "202 [{"post_id": 77602, "ts": "2026-10-07T16:27:19Z", "hours": 8.9683, "text": "Added Camera! Added a Camera app where u can take pictures, save them and view them later through the file manager ;) I’ll be adding deletes and downloads soon. I’ll try working on navbar first. And then, maybe add file uploading"}, {"post_id": 74047, "ts": "2026-09-26T16:16:24Z", "hours": 1.7731, "text": "Added window dragging, closing and opening using app icon :D I’m gonna try add window contents and main navbar + active windows and minimizing"}, {"post_id": 73985, "ts": "2026-09-26T13:48:30Z", "hours": 2.6589, "text": "Got the Background working and added icons + windowsss. Next I’m gonna make the windows draggable actually function xdd. It uses glassmorphism (I think that’s what u call it) icons and windows :))"}]...
|
Title: VeryOS by @disgustalt | Stardance
Devlogs: Title: VeryOS by @disgustalt | Stardance
Devlogs:
Got the Background working and added icons + windowsss. Next I’m gonna make the windows draggable actually function xdd. It uses glassmorphism (I think that’s what u call it) icons and windows :))
Added window dragging, closing and opening using app icon :D I’m gonna try add window contents and main navbar + active windows and minimizing
Added Camera! Added a Camera app where u can take pictures, save them and view them later through the file manager ;) I’ll be adding deletes and downloads soon. I’ll try working on navbar first. And then, maybe add file uploading
Ships:
Made a WebOS that has a camera and filesystem(ish)! :) I had a lot of trouble with setting up the camera stuff. The camera worked at first and then suddenly stopped working. The facingMode of the camera was worse though. It worked nicely until I added the function to take pictures, and then it stopped. Had to change that logic entirely TwT Anywayyyy, I’m pretty proud to have made the camera and stuff work! (I’ve never worked with camera before :D) I’m gonna work more on adding new features to this soon! There’s exams so I’m pretty slow :p...
|
1792857151.14143
|
1792943551.14143
|
|
69527
|
firstos by @Aarjav_3 | Stardance
|
Aarjav_3
|
1
|
2.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T08:14:47Z", "hours": 2.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "i made a web os (definitely no looking like tht) but i made it my self i knew preety much of html/css but was very new to js so i faced many problems in it and i used ai to rectify errors. it was very fun", "repo": "https://github.com/aarjavjain-in/firstos", "demo": "https://aarjavjain-in.github.io/firstos/"}]...
|
[{"post_id": 79734, "ts": "202 [{"post_id": 79734, "ts": "2026-10-15T08:01:57Z", "hours": 0.4275, "text": "added a live wallpaper in loop"}, {"post_id": 79512, "ts": "2026-10-14T11:58:40Z", "hours": 0.9592, "text": "created 3 draggable/movable windows with js"}, {"post_id": 79360, "ts": "2026-10-13T17:07:10Z", "hours": 0.3933, "text": "added current date and time"}, {"post_id": 79352, "ts": "2026-10-13T16:33:55Z", "hours": 0.5717, "text": "Im workin on a web ob umm i know its very basic but ill definetly improve with time"}]...
|
Title: firstos by @Aarjav_3 | Stardance
Devlogs:
Title: firstos by @Aarjav_3 | Stardance
Devlogs:
Im workin on a web ob umm i know its very basic but ill definetly improve with time
added current date and time
created 3 draggable/movable windows with js
added a live wallpaper in loop
Ships:
i made a web os (definitely no looking like tht) but i made it my self i knew preety much of html/css but was very new to js so i faced many problems in it and i used ai to rectify errors. it was very fun...
|
1792857081.3353124
|
1792943481.3353124
|
|
69596
|
Aakriti Portfolio by @Ankit_7 | Stardance
|
Ankit_7
|
1
|
6.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T07:26:53Z", "hours": 6.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I have make a Portfolio webpage for a content creator of Nepal. I face a bug and in order to fix that it look me some time. I am proud that , I have been able to make this website , debug the errors. To test this I have provided you a link of webpage/demo url . Just click on the url and you will be able to see the webpage. Or simply paste this url : https://ankit-dev-7.github.io/Aakriti_Portfolio/", "repo": "https://github.com/Ankit-dev-7/Aakriti_Portfolio", "demo": "https://ankit-dev-7.github.io/Aakriti_Portfolio/"}]...
|
[{"post_id": 79727, "ts": "202 [{"post_id": 79727, "ts": "2026-10-15T07:18:14Z", "hours": 6.3222, "text": "A Portfolio for a content creator of Nepal"}]...
|
Title: Aakriti Portfolio by @Ankit_7 | Stardance
Title: Aakriti Portfolio by @Ankit_7 | Stardance
Devlogs:
A Portfolio for a content creator of Nepal
Ships:
I have make a Portfolio webpage for a content creator of Nepal. I face a bug and in order to fix that it look me some time. I am proud that , I have been able to make this website , debug the errors. To test this I have provided you a link of webpage/demo url . Just click on the url and you will be able to see the webpage. Or simply paste this url : https://ankit-dev-7.github.io/Aakriti_Portfolio/...
|
1792857189.9560258
|
1792943589.9560258
|
|
21092
|
The HackClub cloud by @Toma_Kuchta | Stardance
|
Toma_Kuchta
|
1
|
54.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T07:09:26Z", "hours": 54.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "So this was my first project I have ever done in a real hackathon. I was in a team with Olivia and she had a beautiful traditional Chinese string instrument and we wanted to merge them both into one beautiful and colorful art piece. And we weren’t able to do that in the end sadly. :( lie it would have look great! ciya", "repo": "https://github.com/Tomas-Kuchta-FPV/The_Hack-Club_cloud", "demo": ""}]...
|
[{"post_id": 79722, "ts": "202 [{"post_id": 79722, "ts": "2026-10-15T06:57:50Z", "hours": 2.1853, "text": "Oh neat extra forgotten hours. It’s probably from when I was doing something and didn’t devlog it. sorry for this one. BC IDK what I was doing and don’t recal anything."}, {"post_id": 56134, "ts": "2026-07-17T00:00:00Z", "hours": 6.7, "text": "So we’ve unpaked everything from the ClayHaul and asseced the damage on the led wall. And oh boy all the pillow fill fell from it. So after more figuring out from where to get spray adhereve it turned out that it was in a repair booth, how convinient. Also like a lot of solder connections were tore up from the transport so I’ve repaired those, glued on the pillow fill and it worked great!! Oh yeah and then Gwendal figured out how to play games on the matrix with wled!!!!"}, {"post_id": 56133, "ts": "2026-07-16T00:00:00Z", "hours": 9.0, "text": "Allright so after that mess we’ve locked in hard. While my temate was repairing her project (She did that for almost the whole hackathon, which is crazy). I began soldering and gluing on the LED strips. Then remembered that it would be great to screw in the screws (With the DIY shitty screwdriver), resumed work on the LED strips. Allright and now we have around two hours left. After everything was soldered I’ve turned it on and it didn’t work. First there were problems with WLED configuration and then with one segment that was dead. Soooo after a “quick hour fix” The LED matrix was working. But we still have just a hour left to ship it. So I’ve quickly done some plywood gymnastic with spare people and put the whole contraption on chairs screwed in the legs and stood it up. Oh yeah it was working!!!!! OH no my teamate was still working on her project, so we needed to pivot. I had prepaired the repo for shipping while she sprayed adhesive on the board and glued the pillow fluff on. It was a messs. But we managed to do it in time lol. After that we had a short visit from our favorite creators, packed everything and went partying! They even had a B-day cake for me how lovely! Thank y’all! Here is a little video we’ve filmed. PS: I didn’t take a photo of the final build as I was so bussy!!!!"}, {"post_id": 56132, "ts": "2026-07-15T00:00:00Z", "hours": 10.0, "text": "So this day was spent by asking people around if we can PAINT! I thought we can atlest do some things that are not really needed but there wasn’t much though. So the whole morning was spent asking if we can paint as it was promised to happen now, but everytime I was told off. So I’ve procrastinated instead with talking to people lol. After it we all went on a picnic and we got back by around 4 pm. Allright no more staling we have layed down the OBS boards and began gluing on the led strips which we have precut yeasterday. And while gluing on the strips I went to another round of asking around for a saw, but this time dhamari helped me soooo much!!! <3 So after yesterdays pain with a small metal saw I’ve managed to borrowed a great stanley saw from a framing shop nextdoor. Nice!! Aaaaaaaaaaahhhhhh so I’ve finally managed to cut down the wood. Oh also we don’t have a scredriver so we’ve made our own scrappy one."}, {"post_id": 56131, "ts": "2026-07-14T00:00:00Z", "hours": 6.7, "text": "Mys first task was finding a teamate in which I failed horibly as I wasn’t able fo find anyone. I’m normaly social but it was different here as I was speaking a different language, and just a lot of first times (USA, Solo flight, long haul flight, hackathon, new people, different culture) … yeah it was overwhelming. And did I mention that I was on a family and frinds gathering in the middle of novehwre! So my plan was to when I land go to lowes and bring back all the stuff needed with yaha, but by the time I’ve came from the airport I wouldn’t have enough time to make it in time for the opening ceremony. So yaha came there by himself, picked up and rode it in an uber - just in time nice!!!! Also my plan was to spray paint the OSB light blue at lowes but that didn’t happen so I’ve bugged staff for the whole evening if there is a place that we can paint it, I weren’t to a more disorganized even in my whole life! It was chaos on all fronts."}, {"post_id": 56130, "ts": "2026-07-14T00:00:00Z", "hours": 1.5, "text": "So after a bit of setup I had like 18hr traveling to the venue. The leg to Frankfurt was great but the flight to San Francisco was super long and I didn’t know what to do. But in the last two hours of flight I’ve remembered that I need to finish the animations for the LED matrix. ’*sad"}, {"post_id": 14521, "ts": "2026-06-23T17:40:25Z", "hours": 2.9719, "text": "After shipping yesterday I had today started working on riping TwinkleTron out of my table, and overwriting it with the latest FW. Then I began configuring it. I have set up the LED strip channels as one can only do 800 LED’s reliably. It was split in the middle by 576 pixels. After I peeked into the matrix config set up the defined matrix size and it didn’t look right. Went to readme to spot the mistake ant it was because I’ve wrongly converted from mm to cm. OR so I thought. It was the whole calculation that was wrong. 🤦♂️ MATHS Boink I got an notification that my ship was rejected and needs changes. (No images in readme and no BOM) Back to the project, and after a few blank stares into the readme and also the CAD file I’ve managed to at least hopefully correctly calculate the needed LEDs. SO I had to redesign the power delivery section. Updated the repo for requested changes and shipped it back out. PS: I also managed to get the price down :yay"}, {"post_id": 13753, "ts": "2026-06-22T15:19:42Z", "hours": 4.2097, "text": "Allright I’m almost finished!! So first thing I did today was cleaning up the repo and pushing the yesterdays changes. Then I went on to do the drawing of the stand that will hold the LED matrix, I’ve tried to even show the LED strips in there but FreeCAD couldn’t handle it, so I sketched it up in draw.IO. with a kinda like a block diagram. Wrote about the intended SW in the readme. And then I’ve created the vision board so anybody can get the idea about the project, which is going to get shipped as a demo The whole time I was thinking about how I’ll create a render in blender for it with cloud simulation, but it didn’t work yesterday. But I got inspiration from some YT video that mocked it up with photoshop. So I hopped into affinity and started designing after a tutorial which I couldn’t follow, so I’ve found an online texture export and inported it into affinity tweaked it and it worked. But then I need some kind of backgroud for it, so I took akemi from the WLED effects website and blurred it out behind the cloud layer. Yeah it didn’t look right. And ChatGPT halucinated completly different thing. But after a bit of tweaking I managed to make it work. And after all of that I have threw everything into the shipping baskets, wrote down the price. And going to ship soon …. Good luck"}, {"post_id": 13086, "ts": "2026-06-21T12:46:37Z", "hours": 2.2622, "text": "Today I had done the schematic. It’s going to be a pretty interesting concept as the wiring is wild different to other matricies. We need almost 120m of LED strips. And they are going to draw almost 2 000W. It’s going to be an electric kettle lol. Because of that I have added two power cables to power the thing, as 220V is better for this. *laughs in geman. I have started creating the schematic in DrawIO. First was the PSU along with the two heavy duty cables I’ve mentioned earlier. Then it’s going to WAGO connectors which will be our power distribution and then it’s going to be distributed to the LED power injection points. Next I did a block diagram in it for the LED matrix, but it wasn’t really clear how to connect it up so I’ve hopped into tinkercad and did a small scale schematic with all of the right features. Next up is: Doing drawings of the the LED strip placement and / adding the 2x4 supports as well as the PSUs Ask my brother if he can try to visualize it in blender Create instructions for building at outpost or at home lol"}, {"post_id": 12752, "ts": "2026-06-20T21:01:24Z", "hours": 3.6581, "text": "So after that last pivot I’m super happy how this project is turning out. I hope that other people loves it as much as I do. But firstly I wanted to move the repo as the original is getting cluttered and it’s a mess. so new repo it it. And it’s also getting a rebrand from generic MatrixShow it’s going to be called The Hack Club cloud, symbolizing the many great ideas of Hack Clubbers. Well this one isn’t going to be about me it’s about ya’lls creativity passion and perseverance. And this sounds so epic in my head! So after a bit of philosophy. I went to look for suitable LED strips they were either super expensive or didn’t meet my criteria. And after a while I was able to find them, neat! So everything else was based around them, like the rows spacing, read more about that in my repo. https://github.com/Tomas-Kuchta-FPV/The_Hack-Club_cloud/blob/main/readme.md#constraints Alright and then I done the 3D model for the matrix. Which turned out OK, but it’s looking too much technical, but I can make drawing for it that we’ll use when building. Peace out Thomas"}, {"post_id": 11833, "ts": "2026-06-19T08:30:07Z", "hours": 1.915, "text": "So I need to pivot as it’s going to be super expensive! It’s going to be like 300 bulbs, which is feasible but it needs to be a huge budget. It would be fun thought, as I was on planning to use American electrical material. BTW I love the flat cables! So at first I’ve pivoted to making a addressable LED Christmass string light matrix. So basically drill out thousand of holes and plop them in an interval of about 15cm, but that wouldn’t have the right WOW effect. So there was another pivot to cheaper LED strips, which is doable!!! So I’ve decided to make a 4x8ft cloud wall!! It’s going to be addresable and it will be driven by my custom WLED LED controller called TwinkleTron. I still need to CAD it and spec the PSU, but it’s going to be awesome!!!!!!!"}, {"post_id": 11183, "ts": "2026-06-18T09:12:38Z", "hours": 2.9239, "text": "So I’ve defined BOM, and made a sketch of the matrix. A halve a year ago I had a light exposition in my hometown which turned out very good. So I want to use the current tested setup, which are Smart sonoff lightbulbs. So I’ve made a BOM around it. And CADed it. But when in CAD I’ve noticed that it’s like 300 smart bulbs and it’s going to be super expensive. So after finding out that this route isn’t good I’m going for a WS2811 addressable lights."}]...
|
Title: The HackClub cloud by @Toma_Kuchta | Starda Title: The HackClub cloud by @Toma_Kuchta | Stardance
Devlogs:
So I’ve defined BOM, and made a sketch of the matrix. A halve a year ago I had a light exposition in my hometown which turned out very good. So I want to use the current tested setup, which are Smart sonoff lightbulbs. So I’ve made a BOM around it. And CADed it. But when in CAD I’ve noticed that it’s like 300 smart bulbs and it’s going to be super expensive. So after finding out that this route isn’t good I’m going for a WS2811 addressable lights.
So I need to pivot as it’s going to be super expensive! It’s going to be like 300 bulbs, which is feasible but it needs to be a huge budget. It would be fun thought, as I was on planning to use American electrical material. BTW I love the flat cables! So at first I’ve pivoted to making a addressable LED Christmass string light matrix. So basically drill out thousand of holes and plop them in an interval of about 15cm, but that wouldn’t have the right WOW effect. So there was another pivot to cheaper LED strips, which is doable!!! So I’ve decided to make a 4x8ft cloud wall!! It’s going to be addresable and it will be driven by my custom WLED LED controller called TwinkleTron. I still need to CAD it and spec the PSU, but it’s going to be awesome!!!!!!!
So after that last pivot I’m super happy how this project is turning out. I hope that other people loves it as much as I do. But firstly I wanted to move the repo as the original is getting cluttered and it’s a mess. so new repo it it. And it’s also getting a rebrand from generic MatrixShow it’s going to be called The Hack Club cloud, symbolizing the many great ideas of Hack Clubbers. Well this one isn’t going to be about me it’s about ya’lls creativity passion and perseverance. And this sounds so epic in my head! So after a bit of philosophy. I went to look for suitable LED strips they were either super expensive or didn’t meet my criteria. And after a while I was able to find them, neat! So everything else was based around them, like the rows spacing, read more about that in my repo. https://github.com/Tomas-Kuchta-FPV/The_Hack-Club_cloud/blob/main/readme.md#constraints Alright and then I done the 3D model for the matrix. Which turned out OK, but it’s looking too much technical, but I can make drawing for it that we’ll use when building. Peace out Thomas
Today I had done the schematic. It’s going to be a pretty interesting concept as the wiring is wild different to other matricies. We need almost 120m of LED strips. And they are going to draw almost 2 000W. It’s going to be an electric kettle lol. Because of that I have added two power cables to power the thing, as 220V is better for this. *laughs in geman. I have started creating the schematic in DrawIO. First was the PSU along with the two heavy duty cables I’ve mentioned earlier. Then it’s going to WAGO connectors which will be our power distribution and then it’s going to be distributed to the LED power injection points. Next I did a block diagram in it for the LED matrix, but it wasn’t really clear how to connect it up so I’ve hopped into tinkercad and did a small scale schematic with all of the right features. Next up is: Doing drawings of the the LED strip placement and / adding the 2x4 supports as well as the PSUs Ask my brother if he can try to visualize it in blender Create instructions for building at outpost or at home lol
Allright I’m almost finished!! So first thing I did today was cleaning up the repo and pushing the yesterdays changes. Then I went on to do the drawing of the stand that will hold the LED matrix, I’ve tried to even show the LED strips in there but FreeCAD couldn’t handle it, so I sketched it up in draw.IO. with a kinda like a block diagram. Wrote about the intended SW in the readme. And then I’ve created the vision board so anybody can get the idea about the project, which is going to get shipped as a demo The whole time I was thinking about how I’ll create a render in blender for it with cloud simulation, but it didn’t work yesterday. But I got inspiration from some YT video that mocked it up with photoshop. So I hopped into affinity and started designing after a tutorial which I couldn’t follow, so I’ve found an online texture export and inported it into affinity tweaked it and it worked. But then I need some kind of backgroud for it, so I took akemi from the WLED effects website and blurred it out behind the cloud layer. Yeah it didn’t look right. And ChatGPT halucinated completly different thing. But after a bit of tweaking I managed to make it work. And after all of that I have threw everything into the shipping baskets, wrote down the price. And going to ship soon …. Good luck
After shipping yesterday I had today started working on riping TwinkleTron out of my table, and overwriting it with the latest FW. Then I began configuring it. I have set up the LED strip channels as one can only do 800 LED’s reliably. It was split in the middle by 576 pixels. After I peeked into the matrix config set up the defined matrix size and it didn’t look right. Went to readme to spot the mistake ant it was because I’ve wrongly converted from mm to cm. OR so I thought. It was the whole calculation that was wrong. 🤦♂️ MATHS Boink I got an notification that my ship was rejected and needs changes. (No images in readme and no BOM) Back to the project, and after a few blank stares into the readme and also the CAD file I’ve managed to at least hopefully correctly calculate the needed LEDs. SO I had to redesign the power delivery section. Updated the repo for requested changes and shipped it back out. PS: I also managed to get the price down :yay
So after a bit of setup I had like 18hr traveling to the venue. The leg to Frankfurt was great but the flight to San Francisco was super long and I didn’t know what to do. But in the last two hours of flight I’ve remembered that I need to finish the animations for the LED matrix. ’*sad
Mys first task was finding a teamate in which I failed horibly as I wasn’t able fo find anyone. I’m normaly social but it was different here as I was speaking a different language, and just a lot of first times (USA, Solo flight, long haul flight, hackathon, new people, different culture) … yeah it was overwhelming. And did I mention that I was on a family and frinds gathering in the middle of novehwre! So my plan was to when I land go to lowes and bring back all the stuff needed with yaha, but by the time I’ve came from the airport I wouldn’t have enough time to make it in time for the opening ceremony. So yaha came there by himself, picked up and rode it in an uber - just in time nice!!!! Also my plan was to spray paint the OSB light blue at lowes but that didn’t happen so I’ve bugged staff for the whole evening if there is a place that we can paint it, I weren’t to a more disorganized even in my whole life! It was chaos on all fronts.
So this day was spent by asking people around if we can PAINT! I thought we can atlest do some things that are not really needed but there wasn’t much though. So the whole morning was spent asking if we can paint as it was promised to happen now, but everytime I was told off. So I’ve procrastinated instead with talking to people lol. After it we all went on a picnic and we got back by around 4 pm. Allright no more staling we have layed down the OBS boards and began gluing on the led strips which we have precut yeasterday. And while gluing on the strips I went to another round of asking around for a saw, but this time dhamari helped me soooo much!!! <3 So after yesterdays pain with a small metal saw I’ve managed to borrowed a great stanley saw from a framing shop nextdoor. Nice!! Aaaaaaaaaaahhhhhh so I’ve finally managed to cut down the wood. Oh also we don’t have a scredriver so we’ve made our own scrappy one.
Allright so after that mess we’ve locked in hard. While my temate was repairing her project (She did that for almost the whole hackathon, which is crazy). I began soldering and gluing on the LED strips. Then remembered that it would be great to screw in the screws (With the DIY shitty screwdriver), resumed work on the LED strips. Allright and now we have around two hours left. After everything was soldered I’ve turned it on and it didn’t work. First there were problems with WLED configuration and then with one segment that was dead. Soooo after a “quick hour fix” The LED matrix was working. But we still have just a hour left to ship it. So I’ve quickly done some plywood gymnastic with spare people and put the whole contraption on chairs screwed in the legs and stood it up. Oh yeah it was working!!!!! OH no my teamate was still working on her project, so we needed to pivot. I had prepaired the repo for shipping while she sprayed adhesive on the board and glued the pillow fluff on. It was a messs. But we managed to do it in time lol. After that we had a short visit from our favorite creators, packed everything and went partying! They even had a B-day cake for me how lovely! Thank y’all! Here is a little video we’ve filmed. PS: I didn’t take a photo of the final build as I was so bussy!!!!
So we’ve unpaked everything from the ClayHaul and asseced the damage on the led wall. And oh boy all the pillow fill fell from it. So after more figuring out from where to get spray adhereve it turned out that it was in a repair booth, how convinient. Also like a lot of solder connections were tore up from the transport so I’ve repaired those, glued on the pillow fill and it worked great!! Oh yeah and then Gwendal figured out how to play games on the matrix with wled!!!!
Oh neat extra forgotten hours. It’s probably from when I was doing something and didn’t devlog it. sorry for this one. BC IDK what I was doing and don’t recal anything.
Ships:
So this was my first project I have ever done in a real hackathon. I was in a team with Olivia and she had a beautiful traditional Chinese string instrument and we wanted to merge them both into one beautiful and colorful art piece. And we weren’t able to do that in the end sadly. :( lie it would have look great! ciya...
|
1792777916.541801
|
1792864316.541801
|
|
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😄...
|
1792615697.091723
|
1792702097.091723
|
|
69776
|
Wet or Warm by @Jazil | Stardance
|
Jazil
|
1
|
2.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T02:46:39Z", "hours": 2.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made a weather app using api i know this is basic but this help me to study using api with getting by class", "repo": "https://github.com/JazilJafar/Weather-Finder", "demo": "https://jaziljafar.github.io/Weather-Finder/"}]...
|
[{"post_id": 79693, "ts": "202 [{"post_id": 79693, "ts": "2026-10-15T02:44:51Z", "hours": 2.3792, "text": "I made a weather getting app using api v1.0 is live https://jaziljafar.github.io/Weather-Finder/"}]...
|
Title: Wet or Warm by @Jazil | Stardance
Devlogs: Title: Wet or Warm by @Jazil | Stardance
Devlogs:
I made a weather getting app using api v1.0 is live https://jaziljafar.github.io/Weather-Finder/
Ships:
I made a weather app using api i know this is basic but this help me to study using api with getting by class...
|
1792846503.487814
|
1792932903.487814
|
|
69770
|
Python by @syedakhter | Stardance
|
syedakhter
|
1
|
2.0
|
1
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T02:13:57Z", "hours": 2.0, "multiplier": 1.0, "payout": 1, "blessing": "neutral", "text": "I made a website about python it tells you about python why its important python features and diffrent versions of python", "repo": "https://github.com/8051987-eng/Python", "demo": "https://8051987-eng.github.io/Python/"}]...
|
[{"post_id": 79688, "ts": "202 [{"post_id": 79688, "ts": "2026-10-15T02:12:43Z", "hours": 2.0147, "text": "I made a website about python"}]...
|
Title: Python by @syedakhter | Stardance
Devlogs: Title: Python by @syedakhter | Stardance
Devlogs:
I made a website about python
Ships:
I made a website about python it tells you about python why its important python features and diffrent versions of python...
|
1792842915.8222334
|
1792929315.8222334
|
|
32906
|
Pegboard by @OrangeJuice | Stardance
|
OrangeJuice
|
1
|
5.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T01:00:43Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "Pegboard My personal site in the style of a pegboard! Includes: Shelf with links to my socials About me sections Project sections, Each keychain is linked to a project of mine Vinyl shelf that includes some of my fav albums!", "repo": "https://github.com/Orangejuiceonntop/Pegboard", "demo": "https://orangejuiceonntop.github.io/Pegboard/"}]...
|
[{"post_id": 79667, "ts": "202 [{"post_id": 79667, "ts": "2026-10-15T00:50:11Z", "hours": 1.0811, "text": "Pegboard My personal site! Background info Hi guys it’s been a whileeee😓. I noticed that I never finished this website, so I decided to finally come back and finish it! What’s new Added keychain images Linked each keychain to a project of mine! Changed the hover animations from border-sizing change to scale Finished writing the Readme This project will be shipped soon. Thanks for reading! Until next time!"}, {"post_id": 36260, "ts": "2026-07-28T07:47:49Z", "hours": 1.4339, "text": "Pegboard My personal site! What’s new Not much has been added. I mostly work on this website in between my other projects as a “break”, so I like to keep this website pretty simple to give my brain a break 😓 Added image links to my socials on the top shelf Clicking on the vinyls/albums brings you to spotify Originally, clicking on the album would play a song and a panel would show up saying what song it is, but I decided to just link it to spotify instead because it’s more convenient and would make the website less cluttered Added hover animations Just to make the website a little more fun To-do Add keychain drawing for the project’s section Decorate the website a little bit more That’s it for now. Until next time!"}, {"post_id": 28575, "ts": "2026-07-14T22:14:06Z", "hours": 1.1561, "text": "Pegboard My personal site! What’s new I’ve been working on this website while I work on other projects so not much has been added so far Projects area There will be keychains of my projects where you can hover over them to see more information Vinyl shelf Added some of my fav albums Eventually I’ll make so when you click them, music plays Hanging plant For some greenery What’s next Add keychains for projects Add links to my github and itch.io Until next time!"}, {"post_id": 25166, "ts": "2026-07-09T06:46:41Z", "hours": 1.0753, "text": "Pegboard My personal site! First Devlog! I wanted to take a little break from my other project, so I decided to make this website. I wanted to make it look like those aesthetic pinterest pegboards. Right now it’s super bare bones and doesn’t have much going on. What I have so far A shelf (the gray bar) I couldn’t find any shelf pngs so I made one. It’ll get a makeover soon tho Links to my github and itch.io will be placed on it My profile pic About me section + programs I use section To do Add links on top of shelf Add a projects section Work on the overall visuals of the website I’ll try to make a lot of progress next time I make a devlog. Until then!"}]...
|
Title: Pegboard by @OrangeJuice | Stardance
Devlo Title: Pegboard by @OrangeJuice | Stardance
Devlogs:
Pegboard My personal site! First Devlog! I wanted to take a little break from my other project, so I decided to make this website. I wanted to make it look like those aesthetic pinterest pegboards. Right now it’s super bare bones and doesn’t have much going on. What I have so far A shelf (the gray bar) I couldn’t find any shelf pngs so I made one. It’ll get a makeover soon tho Links to my github and itch.io will be placed on it My profile pic About me section + programs I use section To do Add links on top of shelf Add a projects section Work on the overall visuals of the website I’ll try to make a lot of progress next time I make a devlog. Until then!
Pegboard My personal site! What’s new I’ve been working on this website while I work on other projects so not much has been added so far Projects area There will be keychains of my projects where you can hover over them to see more information Vinyl shelf Added some of my fav albums Eventually I’ll make so when you click them, music plays Hanging plant For some greenery What’s next Add keychains for projects Add links to my github and itch.io Until next time!
Pegboard My personal site! What’s new Not much has been added. I mostly work on this website in between my other projects as a “break”, so I like to keep this website pretty simple to give my brain a break 😓 Added image links to my socials on the top shelf Clicking on the vinyls/albums brings you to spotify Originally, clicking on the album would play a song and a panel would show up saying what song it is, but I decided to just link it to spotify instead because it’s more convenient and would make the website less cluttered Added hover animations Just to make the website a little more fun To-do Add keychain drawing for the project’s section Decorate the website a little bit more That’s it for now. Until next time!
Pegboard My personal site! Background info Hi guys it’s been a whileeee😓. I noticed that I never finished this website, so I decided to finally come back and finish it! What’s new Added keychain images Linked each keychain to a project of mine! Changed the hover animations from border-sizing change to scale Finished writing the Readme This project will be shipped soon. Thanks for reading! Until next time!
Ships:
Pegboard My personal site in the style of a pegboard! Includes: Shelf with links to my socials About me sections Project sections, Each keychain is linked to a project of mine Vinyl shelf that includes some of my fav albums!...
|
1792903666.3160381
|
1792990066.3160381
|
|
64625
|
AuroraOS by @waffles888 | Stardance
|
waffles888
|
2
|
21.0
|
19
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-15T00:04:23Z", "hours": 8.0, "multiplier": 2.32, "payout": 19, "blessing": "neutral", "text": "This is my ship for the WebOS 2 mission. It’s built off of the original WebOS mission site but even flashier. The notes app I have created is what I am the most proud of because notes can be saved and loaded even if the page is refreshed. It was complicated getting all of it to work but I’m really happy and enjoyed getting it to a finished state.", "repo": "https://github.com/waffles-888/AuroraOS", "demo": "https://waffles-888.github.io/AuroraOS/"}, {"ship_num": 2, "ts": "2026-09-30T22:04:52Z", "hours": 13.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "This WebOS is themed around subnautica, I found alot of the javascript challenging, understanding how to make the code and ensuring it all works too without any issues took me a while, this was why one of the devlogs had 6 hours logged. I am really proud of the project overall and I really liked how I started to understand JavaScript to make some of the features I wanted such as the sonar effect when the desktop thing.", "repo": "https://github.com/waffles-888/AuroraOS", "demo": "https://waffles-888.github.io/AuroraOS/"}]...
|
[{"post_id": 79657, "ts": "202 [{"post_id": 79657, "ts": "2026-10-14T22:56:35Z", "hours": 1.4453, "text": "Devlog 8 - Saving Notes I added the ability for notes to be saved to the browser so that even on a refresh of the page you could still use the notes already made. I spent a lot of time debugging this as it was super complex to get working but it finally works."}, {"post_id": 79307, "ts": "2026-10-13T13:37:47Z", "hours": 3.685, "text": "Devlog 7 - Second app This app is a pretty basic app yet its still a little complicated to make. I had to clean up little bits of code from other things and adjust it to make it easier to make new apps and add onto the code that was already made. Styling was easy as it all uses one mostly universal theme. Notes can be saved and deleted however I want to add the ability to load them off of the desktop which I may work on."}, {"post_id": 78382, "ts": "2026-10-10T16:38:41Z", "hours": 2.9364, "text": "Devlog 6 - Intro Animation I cleaned up code to make it overall more optimised. The main thing I got to do was adding an intro animation to the site. It made it look a little fancier and reminiscent to the intro of subnautica itself. I got stuck getting text to show up on the page but after a bit of debugging I made the overlay work and now it works great"}, {"post_id": 75707, "ts": "2026-09-30T20:00:51Z", "hours": 0.7897, "text": "Devlog 5 - Click animation This was way easier to make compared to the things I had to make before this, all it is, is a simple effect that plays when the desktop is clicked, its simple but I think looks nice and fits the theme overall of the site."}, {"post_id": 75548, "ts": "2026-09-30T12:23:42Z", "hours": 6.4742, "text": "Devlog 4 - My first app I created my first basic app for the webOS, it holds a little information about some of the creatures that can be found in subnautica. This has taken me a large amount of time of debugging and testing to get things to work such as window selection and styling. This was mainly due to javascript as I dont really have a big understanding on it."}, {"post_id": 73710, "ts": "2026-09-25T19:10:18Z", "hours": 2.0164, "text": "Devlog 3 - Windows After a bit of debugging I finally added the function to open and close the window, being able to actually get the windows to be moveable was less of a hassle. The javascript is set up to make making new windows easier for apps I created on the OS. Next is actually making my first app for this."}, {"post_id": 73349, "ts": "2026-09-24T23:24:51Z", "hours": 1.5544, "text": "Devlog 2 - OS bar I learnt a little more about javascript making this part of the WebOS as I had to use javascript in order to get the date and time to line up with the current time inside of the bar. I also decided to move where the was when I first created it to the bottom similar to how windows is. Finally I also made the welcome message which I thought was nicely made and im ready to make the moveable windows for the OS"}, {"post_id": 73156, "ts": "2026-09-24T14:32:48Z", "hours": 2.4892, "text": "Devlog 1 - The Start I started creating my WebOS which is themed around subnautica, I added my profile picture and made it so that it can be clicked to get to my GitHub account, I also added a little photo of a pet I have."}]...
|
Title: AuroraOS by @waffles888 | Stardance
Devlog Title: AuroraOS by @waffles888 | Stardance
Devlogs:
Devlog 1 - The Start I started creating my WebOS which is themed around subnautica, I added my profile picture and made it so that it can be clicked to get to my GitHub account, I also added a little photo of a pet I have.
Devlog 2 - OS bar I learnt a little more about javascript making this part of the WebOS as I had to use javascript in order to get the date and time to line up with the current time inside of the bar. I also decided to move where the was when I first created it to the bottom similar to how windows is. Finally I also made the welcome message which I thought was nicely made and im ready to make the moveable windows for the OS
Devlog 3 - Windows After a bit of debugging I finally added the function to open and close the window, being able to actually get the windows to be moveable was less of a hassle. The javascript is set up to make making new windows easier for apps I created on the OS. Next is actually making my first app for this.
Devlog 4 - My first app I created my first basic app for the webOS, it holds a little information about some of the creatures that can be found in subnautica. This has taken me a large amount of time of debugging and testing to get things to work such as window selection and styling. This was mainly due to javascript as I dont really have a big understanding on it.
Devlog 5 - Click animation This was way easier to make compared to the things I had to make before this, all it is, is a simple effect that plays when the desktop is clicked, its simple but I think looks nice and fits the theme overall of the site.
Devlog 6 - Intro Animation I cleaned up code to make it overall more optimised. The main thing I got to do was adding an intro animation to the site. It made it look a little fancier and reminiscent to the intro of subnautica itself. I got stuck getting text to show up on the page but after a bit of debugging I made the overlay work and now it works great
Devlog 7 - Second app This app is a pretty basic app yet its still a little complicated to make. I had to clean up little bits of code from other things and adjust it to make it easier to make new apps and add onto the code that was already made. Styling was easy as it all uses one mostly universal theme. Notes can be saved and deleted however I want to add the ability to load them off of the desktop which I may work on.
Devlog 8 - Saving Notes I added the ability for notes to be saved to the browser so that even on a refresh of the page you could still use the notes already made. I spent a lot of time debugging this as it was super complex to get working but it finally works.
Ships:
This WebOS is themed around subnautica, I found alot of the javascript challenging, understanding how to make the code and ensuring it all works too without any issues took me a while, this was why one of the devlogs had 6 hours logged. I am really proud of the project overall and I really liked how I started to understand JavaScript to make some of the features I wanted such as the sonar effect when the desktop thing.
This is my ship for the WebOS 2 mission. It’s built off of the original WebOS mission site but even flashier. The notes app I have created is what I am the most proud of because notes can be saved and loaded even if the page is refreshed. It was complicated getting all of it to work but I’m really happy and enjoyed getting it to a finished state....
|
1792814161.3419614
|
1792900561.3419614
|
|
69737
|
Night Desk by @_Thomas_ | Stardance
|
_Thomas_
|
1
|
0.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-14T19:32:01Z", "hours": 0.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I built NightDesk , a customizable productivity dashboard using HTML, CSS, and JavaScript. It includes a Google search bar, live clock and date, dark and light themes, English and Czech language settings, and four widgets: Quick Links, To-Do, Notes, and a Focus Timer. The widgets can be moved and resized, and users can customize which ones are visible. Settings and user data are saved, so the workspace stays personalized between visits. One of the biggest challenges was getting the widget positioning system to work properly. I spent time debugging the layout and fixing issues that prevented widgets from being moved freely. This project helped me learn more about frontend development, CSS, JavaScript interactions, saving data in the browser, and how seemingly small changes can affect other parts of an application. I’m most proud that I managed to turn the idea into a working website that people can actually use. I used VS Code as my editor, with ChatGPT and Claude for technical help, debugging, and a few code improvements. I tested and refined the project along the way. How to test it: Open the live demo and try moving and resizing the widgets, switching themes and languages, adding tasks or notes, and using the focus timer. You can also change the settings to customize the dashboard to your liking. (Sorry if the project timeline looks a little confusing! I had some trouble linking Hackatime correctly, so the tracked time doesn’t seem to match the time spent working on the project. I finally got it sorted out and wanted to publish the finished project instead of getting stuck on the setup any longer. :D)", "repo": "https://github.com/Thomio2/Night-Desk", "demo": "https://thomio2.github.io/Night-Desk/"}]...
|
[{"post_id": 79629, "ts": "202 [{"post_id": 79629, "ts": "2026-10-14T19:09:40Z", "hours": 0.2919, "text": "Night Desk"}]...
|
Title: Night Desk by @_Thomas_ | Stardance
Devlog Title: Night Desk by @_Thomas_ | Stardance
Devlogs:
Night Desk
Ships:
I built NightDesk , a customizable productivity dashboard using HTML, CSS, and JavaScript. It includes a Google search bar, live clock and date, dark and light themes, English and Czech language settings, and four widgets: Quick Links, To-Do, Notes, and a Focus Timer. The widgets can be moved and resized, and users can customize which ones are visible. Settings and user data are saved, so the workspace stays personalized between visits. One of the biggest challenges was getting the widget positioning system to work properly. I spent time debugging the layout and fixing issues that prevented widgets from being moved freely. This project helped me learn more about frontend development, CSS, JavaScript interactions, saving data in the browser, and how seemingly small changes can affect other parts of an application. I’m most proud that I managed to turn the idea into a working website that people can actually use. I used VS Code as my editor, with ChatGPT and Claude for technical help, debugging, and a few code improvements. I tested and refined the project along the way. How to test it: Open the live demo and try moving and resizing the widgets, switching themes and languages, adding tasks or notes, and using the focus timer. You can also change the settings to customize the dashboard to your liking. (Sorry if the project timeline looks a little confusing! I had some trouble linking Hackatime correctly, so the tracked time doesn’t seem to match the time spent working on the project. I finally got it sorted out and wanted to publish the finished project instead of getting stuck on the setup any longer. :D)...
|
1792857339.167532
|
1792943739.167532
|