The latest articles on DEV Community by Debapriya Dutta (@debapriya_dutta_4838c3d8a). https://dev.to/debapriya_dutta_4838c3d8a https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3288154%2Fdd67d60d-88b5-45b1-ab09-67640b41908c.jpg https://dev.to/debapriya_dutta_4838c3d8a en Debapriya Dutta Mon, 23 Jun 2025 17:35:08 +0000 https://dev.to/debapriya_dutta_4838c3d8a/i-built-my-own-revision-tracker-meet-revizio-my-personal-study-tool-29oc https://dev.to/debapriya_dutta_4838c3d8a/i-built-my-own-revision-tracker-meet-revizio-my-personal-study-tool-29oc <p>Like every student, I’ve had this problem:<br> 📚 I revise something once, and then… I forget when I last studied it.<br> And boom — exam time hits, and I panic. 😵‍💫</p> <p>So I built <strong>Revizio</strong> — a minimalist, personal revision tracker that helps me:</p> <ul> <li>Track what subjects I’ve studied</li> <li>Know when I last revised them</li> <li>Keep my study routine honest!</li> </ul> <p>This is my first real frontend project, and I wanted to make it as clean, minimal, and useful as possible.</p> <p>🔧 Tech Stack</p> <ul> <li>HTML: The basic structure</li> <li>CSS: My favorite part! Fully custom UI with animations, colors, layout tricks.</li> <li>JavaScript: For functionality — add/delete/edit, time calculations, and storage.</li> <li>Data Storage: localStorage</li> <li>No frameworks (yet) — I wanted to challenge myself with pure code.</li> </ul> <p>🚀 Features of Revizio :</p> <ul> <li>User Registration &amp; Login: Secure user authentication using localStorage.</li> <li>Guest Mode: Try the app instantly without signing up via a "Use Demo" option.</li> <li>Add Topics: Users can log topics they studied and track them.</li> <li>Spaced Repetition Logic: Automatically sets revision dates for Day 1, Day 7, and Day 21.</li> <li>Track Revision Progress: Mark each revision as done; badges visually reflect progress.</li> <li>Edit &amp; Delete Topics: Rename or remove topics with ease.</li> <li>Today's Revisions Panel: See only the topics you need to revise today.</li> <li>Streak Counter: Tracks daily revision streaks to encourage consistency.</li> <li>Progress Chart: A Chart.js bar graph displays your revision history visually.</li> <li>Responsive UI (In Progress): Currently desktop-first; mobile responsiveness coming soon.</li> <li>Modern Glassmorphism Design: Sleek, clean UI built with HTML, CSS, and JavaScript (no frameworks).</li> <li>Quick Actions &amp; Motivation: Sidebar includes handy shortcuts and random motivational quotes.</li> </ul> <p>🚀 What’s Next?</p> <ul> <li>Make the app mobile-first and responsive</li> <li>Add toggle button</li> </ul> <p>🔗 Check it Out!<br> Live Demo: [<a href="https://duttadebapriya.github.io/revizio/" rel="noopener noreferrer">https://duttadebapriya.github.io/revizio/</a>]<br> GitHub Repo: [<a href="https://github.com/duttadebapriya/revizio" rel="noopener noreferrer">https://github.com/duttadebapriya/revizio</a>]<br> 💬 I’d love feedback! Comment below or reach out. I’m still learning.</p> <h1> showdev #beginners #css #javascript #productivity #html </h1> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8ew48s6hla5gfu7vhlrd.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8ew48s6hla5gfu7vhlrd.png" alt="Login page" width="800" height="449"></a><br> <a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fijhl1rbmkzdt72rqaprd.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fijhl1rbmkzdt72rqaprd.png" alt="Register page" width="800" height="449"></a><br> <a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fe5scgsayw4unyw6bdvit.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fe5scgsayw4unyw6bdvit.png" alt="Dashboard" width="800" height="449"></a></p>