Full-Stack Developer focused on React, Next.js, JavaScript, and Node.js.
Building real-time applications, backend APIs, modern interfaces, and developer-focused tools.

• Full-Stack Development: Building end-to-end web applications using React, Next.js, JavaScript, Node.js, Express, and MongoDB.
• Real-Time Applications: Building event-driven features and live data synchronization using Socket.IO and WebSockets.
• Backend Development: Working with REST APIs, authentication, database-backed services, and Redis-supported application workflows.
• Frontend Development: Creating responsive interfaces with React, Tailwind CSS, Redux, and modern animation libraries.
• Developer Tooling & AI: Working with WebContainers, Monaco Editor, browser-based runtimes, and Google Gemini API integrations.
• Background: Based in New Delhi, India. Engineering graduate from Delhi Technological University (DTU).

• Building: Full-stack applications using React, Next.js, Node.js, and MongoDB.
• Working With: Real-time communication, REST APIs, authentication, Redis, state management, and modern frontend architecture.
• Exploring: Browser-based developer tools, AI-assisted development workflows, automated testing, performance optimization, and scalable application architecture.

• Frontend Architecture — Building React and Next.js applications with reusable components, state management, responsive layouts, and performance-conscious UI.
• Backend Development — Designing REST APIs, authentication flows, database integrations, validation, and modular backend services.
• Real-Time Communication — Implementing WebSocket and Socket.IO based communication for live tracking, collaboration, and event-driven workflows.
• Data & State Management — Working with MongoDB, Redux Toolkit, Redis, and synchronized application state.
• Developer Tooling — Building browser-based development experiences using WebContainers, Monaco Editor, and AI integrations.
• Application Quality — Focusing on responsive interfaces, validation, maintainable code, testing, and practical architecture.

• What it does: A browser-based collaborative development environment where developers can create, edit, and execute projects while collaborating with other users in real time.

• Tech Stack: React, Node.js, Express, Socket.IO, WebContainers, Monaco Editor, MongoDB, Redis, Google Gemini API, Tailwind CSS.

• Key Technical Implementations:

  • Implemented multi-user project synchronization and cursor tracking using modular Socket.IO event handlers.
  • Integrated StackBlitz WebContainers for browser-based project execution without server-side compilation.
  • Integrated Monaco Editor as the in-browser development environment.
  • Added a context-aware Google Gemini assistant for code explanation, refactoring, and development assistance.
  • Implemented JWT authentication with Redis-backed token blacklisting for logout invalidation.
  • Added an in-browser Babel transpilation fallback for environments where WebContainers are unavailable.

• Engineering Focus: Real-time synchronization, collaborative state management, browser-based runtimes, authentication, Redis, and AI integration.

• Links: GitHub Repository | Live Demo

• What it does: An end-to-end ride booking platform connecting riders and drivers through real-time dispatch, live vehicle tracking, route-based fare estimation, and trip verification.

• Tech Stack: React, Node.js, Express, MongoDB, Socket.IO, Google Maps API, Tailwind CSS, GSAP, JWT.

• Key Technical Implementations:

  • Implemented real-time vehicle location updates using Socket.IO/WebSockets.
  • Built dynamic fare estimation based on route distance, travel duration, and vehicle type.
  • Implemented synchronized trip states across the ride lifecycle.
  • Added 4-digit OTP verification for ride start and completion.
  • Integrated Google Maps API for location and route-based functionality.
  • Implemented JWT-based authentication for application users.

• Engineering Focus: Real-time communication, geolocation, trip state management, backend APIs, authentication, and event-driven workflows.

• Links: GitHub Repository | Live Demo

• What it does: A workflow-oriented application for vendor onboarding, attendance management, and venue check-in operations.

• Tech Stack: Next.js, JavaScript, Redux Toolkit, React-Redux, Tailwind CSS.

• Key Technical Implementations:

  • Built a multi-step vendor onboarding workflow with client-side validation.
  • Implemented centralized application state using Redux Toolkit.
  • Built event check-in tracking workflows for operational users.
  • Created responsive dashboard interfaces for desktop and mobile usage.
  • Structured the application using Next.js and reusable React components.

• Engineering Focus: State management, workflow design, validation, responsive UI, and Next.js application development.

• Links: GitHub Repository | Live Demo

• What it does: A creative frontend experience focused on scroll-driven frame rendering, smooth motion, interactive typography, and visual storytelling.

• Tech Stack: JavaScript, HTML5 Canvas, GSAP, ScrollTrigger, Locomotive Scroll, CSS3.

• Key Technical Implementations:

  • Implemented scroll-bound HTML5 Canvas frame sequencing with preloaded image buffers.
  • Built inertia-based smooth scrolling and kinetic typography using GSAP and ScrollTrigger.

• Links: GitHub Repository | Live Demo

• What it does: A travel and hospitality listing platform where users can discover destinations, create accommodation listings, upload images, and publish reviews.

• Tech Stack: Node.js, Express, MongoDB, EJS, Passport.js, Cloudinary, Joi.

• Key Technical Implementations:

  • Implemented complete CRUD workflows with server-side validation using Joi.
  • Implemented session-based authentication using Passport.js.
  • Integrated Cloudinary for image uploads and optimized image handling.
  • Built listing and review workflows backed by MongoDB.

• Links: GitHub Repository | Live Demo

• What it does: A personal portfolio featuring interactive 3D WebGL content, scroll-based animations, project presentation, and server-side contact handling.

• Tech Stack: Next.js, React, JavaScript, Tailwind CSS, Spline, GSAP, Framer Motion, Nodemailer.

• Key Technical Implementations:

  • Integrated Spline WebGL with loading/fallback states and custom interactions.
  • Implemented scroll-driven animations using GSAP ScrollTrigger and Framer Motion.
  • Added server-side contact handling using a Next.js API route and Nodemailer.

• Links: GitHub Repository | Live Demo

• Clear Separation of Concerns — Keep UI, application state, API logic, and backend responsibilities organized and maintainable.
• Practical Architecture — Choose tools and patterns based on the actual requirements of the application.
• Defensive Programming — Use validation and predictable error handling to make application behavior more reliable.
• Event-Driven Systems — Use WebSockets and Socket.IO when real-time communication is a core requirement.
• Reusable Components — Build modular UI and backend logic that can be maintained and extended.
• User-Centered Interfaces — Prioritize responsive layouts, clear workflows, useful feedback, and smooth interactions.
• Continuous Improvement — Improve code quality, testing, performance, documentation, and developer experience over time.

Delhi Technological University (DTU)
Engineering Graduate · New Delhi, India