This project is a full-stack MERN-based note-taking application that enables users to create, manage, and organize notes through a responsive and intuitive interface, demonstrating strong end-to-end development capabilities. The frontend is built using React with JSX, following a component-driven architecture and leveraging React Hooks for efficient state management and optimized rendering. The UI is designed with Tailwind CSS and DaisyUI, ensuring a clean, responsive, and user-friendly experience, while navigation is handled via React Router for seamless transitions. Notes are dynamically fetched and managed using Axios, with proper handling of asynchronous operations, loading states, and error boundaries. On the backend, the application is powered by Node.js and Express.js for full CRUD operations, while data persistence is handled using MongoDB with Mongoose for schema validation and efficient querying. Additional enhancements such as Redis-based rate limiting improve API reliability and security under load. The application is deployed on Render, showcasing the ability to build and deploy a scalable, real-world note management system with a strong focus on performance, usability, and clean architecture.

This project is a full-stack GRC (Governance, Risk, and Compliance) data filtering application that demonstrates strong frontend engineering combined with a structured backend architecture. The frontend is built using React with JSX and powered by Vite, enabling fast builds and optimized rendering, while Tailwind CSS is used to create a responsive and scalable UI for handling structured risk and compliance datasets. The application implements dynamic, multi-criteria filtering logic on GRC data with efficient state management using hooks, minimizing re-renders and ensuring high performance during complex data interactions; asynchronous communication is handled via Axios, and routing is managed through React Router for a seamless SPA experience. On the backend, the system is powered by Node.js and Express, exposing RESTful APIs designed to process and serve filtered GRC datasets efficiently, with middleware ensuring secure request handling, while SQLite is used for lightweight yet structured data persistence. The application is deployed on Render, showcasing a solid understanding of building performant, scalable, and domain-specific full-stack applications with a strong emphasis on frontend-driven data visualization and interaction.

This project is a browser-based interactive memory game that demonstrates advanced control over DOM manipulation, event-driven architecture, and state synchronization. The UI is built using a responsive grid layout where card components are dynamically generated and shuffled using optimized algorithms, ensuring non-deterministic gameplay on every render. The application leverages CSS 3D transforms and transition timing functions to implement smooth flip animations, while maintaining strict control over reflows and repaints for performance efficiency. Complex game logic such as card matching, move tracking, and interaction locking is handled through structured state management, preventing race conditions during rapid user input. Additionally, the rendering pipeline is optimized to minimize unnecessary updates, ensuring a fluid user experience even under continuous interaction. The project reflects a deep understanding of how to combine UI rendering, animation systems, and real-time state updates into a cohesive and performant frontend architecture, aligning with best practices used in modern interactive web applications.

This Kanban board application reflects a deep understanding of state-driven UI architecture and complex user interactions. The core functionality revolves around drag-and-drop mechanics, implemented with precise control over DOM events and state updates to ensure smooth and predictable task movement across columns. The layout is built using CSS Grid, enabling flexible and responsive column structures that adapt efficiently to different screen sizes. Task management features such as creation, updating, and reordering are handled through structured state logic, ensuring consistency across UI and data layers. The application demonstrates advanced handling of event propagation, conditional rendering, and UI synchronization, particularly during drag operations. Additionally, the architecture is designed to support persistence (e.g., local storage or API integration), making it scalable for real-world workflow management systems. Overall, this project highlights the ability to build highly interactive, data-driven frontend applications with complex user interactions.

This project showcases advanced frontend capabilities by implementing real-time image manipulation directly within the browser environment. It leverages low-level browser APIs (such as canvas-based rendering) to apply transformations like filters, adjustments, and visual effects without relying on external processing. The UI is designed for high interactivity, with immediate visual feedback on user actions, requiring efficient synchronization between input controls and rendering logic. Performance considerations such as debouncing, throttling, and optimized redraw cycles are applied to prevent lag during continuous adjustments. The application demonstrates strong control over pixel-level operations, event handling, and rendering pipelines, making it a technically sophisticated frontend project. It reflects the ability to build complex, computation-heavy features entirely on the client side while maintaining a smooth and responsive user experience.

This project is a real-time browser game that highlights strong expertise in animation loops, state management, and performance optimization in JavaScript. The game logic is driven by a continuous render cycle (game loop), where user input, collision detection, and state updates are processed efficiently to maintain consistent frame rates. The frontend handles dynamic rendering of game elements while ensuring minimal computational overhead, preventing frame drops during rapid updates. Grid-based positioning and movement logic are carefully implemented to maintain deterministic behavior across different screen sizes. The project also demonstrates effective handling of keyboard events, timing functions, and incremental state transitions, which are critical for real-time interactive systems. The UI is intentionally minimal to prioritize performance, showcasing an understanding of how to balance visual design with computational efficiency. Overall, it reflects the ability to build highly interactive, performance-critical frontend applications without relying on heavy frameworks.

This simple dashboard UI demonstrates a strong grasp of component-based UI structuring and data-driven rendering patterns. The layout is architected using reusable UI blocks, enabling consistent styling and maintainability across multiple sections. The frontend efficiently handles structured data visualization, ensuring clarity through well-organized layouts and intuitive information hierarchy. Responsive design principles are applied using flexible containers and media queries, allowing seamless adaptation across devices. Performance is optimized through controlled DOM updates and efficient rendering strategies, especially when dealing with dynamic or frequently updating data. The project reflects an understanding of how to design scalable frontend systems that can integrate with APIs and support real-time updates, making it suitable for analytics or admin panel use cases.