Case Study: Formula – Advanced E-commerce Beauty Platform

Project at a Glance

• Role: Fullstack Developer (Solo/Lead)
• Duration: 9 months
• Stack: Next.js, React, TailwindCSS, Shiprocket, Razorpay, Custom Magento, Deployment - CI/CD
• Lines of Code: 70,000+
• Team: 1 (Full ownership)

My Role & Impact

• Architected and built the entire platform from scratch (frontend, backend, database, deployment).
• Designed a scalable, maintainable codebase and led all technical decisions.
• Implemented advanced features: real-time order tracking, personalized recommendations, routine builder, and more.
• Collaborated with designers and stakeholders to ensure a seamless user experience.

Visual & Code Comparison

Figma DesignLive Site

Responsive DesignOn all screens

Code ShowcaseCommit Showcase

Key Features

• Routine Builder: Personalized skin/hair routines with smart filters and suggestions.
• Global Categorization: Products by Korean, Indian, African, Japanese philosophies.
• Wellness Profile: Custom dashboard for user preferences, driving recommendations.
• Brand Showcase: Dedicated brand pages with filterable product lists.
• Order Management: Real-time tracking, status updates, and returns.
• Responsive UI/UX: Mobile-first, luxury-brand design.

Tech Highlights

• Next.js for scalable routing and SSR.
• React for modern, component-based UI.
• TailwindCSS for rapid, consistent styling.
• Custom Magento as backend engine for e-commerce logic.
• Shiprocket for shipping and logistics integration.
• Razorpay for payment gateway integration.
• Deployment / CI/CD for automated, reliable releases.

Challenges & Solutions

• Complex filtering: Solved with server-side logic and efficient queries.
• Personalization at scale: Built dynamic, profile-driven recommendations.
• Real-time order tracking: Engineered backend logic for live updates.

Results & Impact

• Achieved feature parity with top beauty e-commerce platforms.
• Scalable to thousands of users and product variants.
• Streamlined user journeys from discovery to purchase.

What I Learned

• Deepened expertise in fullstack architecture and scalable design.
• Mastered advanced Next.js, TailwindCSS, and modern React patterns.
• Learned to balance business needs, UX, and technical complexity.

Links

• Live Demo: theformulashop.com

Note: The codebase for this project is confidential and not publicly available.