Daniil Gurski

While learning React, I wanted to move beyond basic tutorials and tackle a complex, highly interactive interface with real-world requirements. I chose a comprehensive design from Frontend Mentor to build a full-stack notes application, focusing on handling a high volume of interactive components and responsive layouts.

With this in mind, my objective was to build a complete CRUD notes application featuring secure user authentication, archiving capabilities, tag filtering, full-text search, and customizable UI features like theme and font selection. The primary challenge was ensuring a pixel-perfect, responsive layout across all device sizes while managing a highly interactive UI.

To execute this, I built the frontend using React, focusing heavily on CSS architecture and responsive design to fit multiple moving parts—such as sidebars, search inputs, and note editors—onto a single screen without layout shifts. I integrated Supabase for user authentication and simple data persistence, implementing the search and tag-filtering logic on the client side to ensure instantaneous UI updates and a highly fluid user experience.

Ultimately, I successfully delivered a highly polished, responsive application that achieved excellent visual parity with the professional design specifications. Although the backend architecture was kept simple, the project was a massive success for my frontend growth, solidifying my understanding of complex state management, responsive layouts, and component lifecycle in React.