Duukan Direct

Inspiration

The inspiration for Dukaan Direct came from observing the struggles of local kirana stores, medical shops, and small businesses in competing with large e-commerce platforms. During the pandemic, we noticed how neighborhood shops were forced to close while customers craved the convenience of online ordering. We wanted to bridge this gap by creating a hyperlocal delivery platform that empowers small shopkeepers to digitize their businesses without expensive infrastructure, while giving customers the convenience of ordering from their trusted local stores within minutes.

What it does

Dukaan Direct is a comprehensive hyperlocal e-commerce platform that connects customers with nearby shops for instant delivery. The platform features:

Customer App: Browse nearby shops by category (kirana, medical, stationery, vegetables), add items to cart, choose between self-delivery or click & collect, and track orders in real-time Shopkeeper Dashboard: Manage inventory with automatic stock tracking, accept/reject orders, update order status (preparing → out-for-delivery → delivered), view sales analytics, and get AI-powered business insights Smart Inventory Management: Automatic stock reduction when orders are accepted, low-stock alerts, and manual stock updates AI Assistant: Powered by Claude API, providing shopkeepers with business insights, sales analysis, and order management recommendations Real-time Order Tracking: Customers can track their order status with visual progress indicators Multiple Delivery Options: Self-delivery, click & collect (pickup), and local helper integration

How we built it

We built Dukaan Direct using modern web technologies:

Frontend: React with TypeScript for type safety, Tailwind CSS for responsive design, and Shadcn UI components for a polished interface State Management: React Context API for managing cart, orders, and products globally Backend: Supabase for real-time database, authentication, and storage (integrated with Lovable Cloud) AI Integration: Anthropic's Claude API for the intelligent business assistant Data Visualization: Recharts for sales analytics and performance tracking Architecture: Component-based design with separation of concerns - contexts for business logic, components for UI, and mock data structure ready for production database migration

Challenges we ran into

Inventory Synchronization: Ensuring stock levels update correctly when orders are accepted while preventing race conditions was complex. We solved this by implementing validation checks before accepting orders and using React Context to maintain a single source of truth. Real-time Updates: Coordinating state between ProductContext and OrderContext required careful design to ensure inventory changes propagate correctly when orders change status. TypeScript Strictness: Managing complex type definitions for products, orders, and cart items while maintaining type safety throughout the application required careful planning. Context Dependencies: Ensuring ProductProvider wraps OrderProvider since OrderContext depends on ProductContext methods was crucial for the system to work correctly.

Accomplishments that we're proud of

Automatic Inventory Management: Successfully implemented a robust system that automatically reduces stock when orders are accepted, with validation to prevent overselling AI Integration: Integrated Claude API to provide shopkeepers with intelligent business insights, making the platform truly smart User Experience: Created intuitive interfaces for both customers and shopkeepers with real-time updates and visual feedback Scalable Architecture: Built a modular, context-based architecture that's easy to maintain and extend Complete Feature Set: Delivered a full-stack solution with order management, inventory tracking, analytics, and AI assistance - a complete business tool for local shops

What we learned

Context API Mastery: Gained deep understanding of React Context patterns and how to structure complex state management with interdependent contexts TypeScript Best Practices: Learned advanced TypeScript patterns for managing complex data structures and ensuring type safety across the application Inventory Management Logic: Understanding the complexities of e-commerce inventory systems, stock validation, and preventing overselling API Integration: Successfully integrated external APIs (Claude) for AI features and learned to handle API responses effectively User-Centric Design: Balancing feature richness with simplicity - creating powerful tools that remain easy to use for non-technical shopkeepers Real-world Problem Solving: Translating real business needs (stock management, order tracking, delivery options) into working software features

What's next for Duukan Direct

Supabase Integration: Migrate from mock data to full Supabase backend with real-time database subscriptions for live inventory and order updates WhatsApp Integration: Implement automated WhatsApp notifications for order confirmations, status updates, and delivery alerts using WhatsApp Business API Payment Gateway: Integrate UPI, card payments, and cash-on-delivery options for seamless transactions Delivery Partner Network: Build a system to connect with local delivery partners and bike riders for efficient order fulfillment Advanced Analytics: Add predictive analytics, demand forecasting, and inventory optimization suggestions Multi-shop Onboarding: Create a self-service onboarding flow for shopkeepers to register their stores, add products, and go live independently Customer Loyalty Program: Implement rewards, discounts, and referral systems to increase customer retention Voice Ordering: Add voice-based ordering for elderly customers and those less comfortable with apps Batch Order Processing: Allow shopkeepers to accept multiple orders at once during peak hours Smart Routing: Implement intelligent delivery route optimization for faster deliveries Mobile Apps: Develop native iOS and Android apps for better performance and offline capabilities Expansion: Scale to multiple cities and support regional languages for wider adoption

Built With

• api
• css
• gemini
• html
• lucidereact
• react
• supabase
• ts
• typescript
• vite