I’m building Focus, my first solo coding project! It’s a study dashboard designed to help students organise their subjects and actually get focused when it’s time to study. I’m starting with subject-based study sessions and a custom focus timer, and I’m planning to keep adding features like practice questions, tasks and a calendar as I build it.
Focus is starting to feel like an actual app now 👀Today I spent most of my time turning the basic study dashboard from my first devlog into a more complete study flow. I worked on the focus timer quite a bit. It now supports preset session lengths as well as custom durations, and I added proper Start, Pause, Reset and Change Duration controls. The analogue clock also changes with the countdown, and when a session reaches zero it stops automatically and shows a completion message. I also expanded the Study page. Each subject now has separate options for reviewing notes, doing practice questions or starting a focus session. I built the navigation between these different areas and made sure you can move back through the app properly without losing the overall flow. A lot of this session was also visual polishing. I redesigned the subject cards, improved the Today section and navigation bar, and added responsive styling so the layout still works when the browser gets much narrower. There were a few annoying CSS problems along the way, especially getting the timer clock layers and study cards to behave properly, but debugging those was probably where I learned the most. I think Focus is at a good point to leave for now. There are definitely things I could expand later, especially the notes and practice-question sections, but the main study experience is working and I’d rather keep it focused than keep adding random features.
This is my first devlog and somehow it’s already around 4 hours 😭. I was still waiting to get verified for Stardance and didn’t really understand how the devlogs worked yet, so I kept coding before making one. This is also pretty much my first time properly building something with React, so a lot of this session was me learning as I went.I started building Focus, a study dashboard that I actually want to use for school. I set up the main dashboard and navigation, added my subjects, made a Today section, and then started building the Study page. The biggest thing I worked on was the study timer. I got preset options for 25, 45 and 60 minutes working, added a custom duration option, and made the timer switch into the actual study view once a duration is chosen. I also added Start, Pause, Reset and Change Duration controls.I then worked on an analogue clock to sit alongside the timer, including a digital time display and a moving clock hand. Getting everything to actually behave and look right took a fair bit of trial and error, especially since I’m still getting used to React and CSS. There’s still heaps I want to improve, especially the overall design because I want Focus to feel way more polished, but I’m genuinely pretty proud seeing it actually work. A few hours ago most of this stuff was completely new to me, and now I’ve got a real interactive study dashboard running in the browser. Pretty sick start for my first project/devlog :)
