Corely is a social commerce platform that connects creators, brands, and shoppers in an Instagram-like feed experience. Users can browse products through social posts, discover creators, and make purchases directly within the app. The platform supports multiple user roles (shoppers, creators, brands) with location-based delivery zones, real-time shopping cart functionality, and order tracking. Built as a full-stack web application with a mobile-first design approach.
Preferred communication style: Simple, everyday language.
- React + TypeScript with Vite for fast development and optimized builds
- Mobile-first responsive design using Tailwind CSS with custom design system
- Component-based architecture with shadcn/ui components for consistent UI patterns
- Client-side routing using Wouter for lightweight navigation
- State management via TanStack Query for server state and React Context for auth
- Form handling with React Hook Form and Zod validation
- Express.js server with TypeScript for type-safe API development
- RESTful API design with centralized route handling and error management
- In-memory storage layer with interface-based design for future database integration
- Session-based authentication with simple password hashing (placeholder for production bcrypt)
- Modular service architecture separating storage, routes, and business logic
- PostgreSQL as the primary database with Drizzle ORM for type-safe database operations
- Schema-first approach with shared TypeScript types between client and server
- Multi-table design supporting users, products, posts, orders, addresses, and cart items
- Role-based user system (user, creator, brand) with delivery zone support
- JSONB fields for flexible data like bank details and product metadata
- Social commerce feed combining Instagram-like posts with embedded product discovery
- Location-based delivery with zone checking for product availability
- Multi-role user system with different capabilities for shoppers, creators, and brands
- Real-time cart management with quantity updates and checkout flow
- Order tracking system with status progression (placed → packed → shipped → delivered)
- Product categorization supporting physical, digital, and service offerings
- Session-based authentication with localStorage persistence
- Role-based access control restricting features based on user type
- Protected routes with automatic redirects for unauthorized access
- Simple password hashing (ready for bcrypt upgrade in production)
- Neon Database (@neondatabase/serverless) for PostgreSQL hosting
- Drizzle ORM for type-safe database operations and migrations
- Drizzle Kit for schema management and database migrations
- Tailwind CSS for utility-first styling with custom design tokens
- Radix UI components for accessible, unstyled UI primitives
- Lucide React for consistent icon system
- shadcn/ui component library for pre-built design system components
- TanStack React Query for server state management and caching
- React Hook Form with Zod resolvers for form validation
- Wouter for lightweight client-side routing
- Vite for fast development server and optimized production builds
- TypeScript for type safety across the entire stack
- ESBuild for server-side bundling in production
- PostCSS with Autoprefixer for CSS processing
- date-fns for date manipulation and formatting
- clsx & tailwind-merge for conditional CSS class handling
- class-variance-authority for component variant management
- nanoid for generating unique identifiers