📱 Mobile Store

A modern, full-stack e-commerce application for mobile phones with a beautiful blue & black theme, built with React, Express, and PostgreSQL.

✨ Features

• 🎨 Modern UI Design - Sleek blue & black theme with glassmorphism effects
• 🔐 Secure Authentication - JWT-based auth with bcrypt password hashing
• 🗄️ PostgreSQL Database - Robust data persistence
• 📱 Responsive Design - Works on all devices
• 🌓 Dark Mode - Built-in theme switching
• ⚡ Fast Performance - Optimized with Vite
• 🎯 Type Safety - Modern JavaScript with ES modules

🚀 Quick Start

Prerequisites

• Node.js (v16 or higher)
• PostgreSQL (v12 or higher)
• npm or yarn

Installation

1. Clone the repository

   git clone https://github.com/yourusername/mobile-store.git
   cd mobile-store

2. Setup Database

   CREATE DATABASE mobile_store;

3. Install Backend Dependencies

   cd server
   npm install
   cp .env.example .env
   # Edit .env with your database credentials

4. Install Frontend Dependencies

   cd ..
   npm install

5. Start Development Servers

   Terminal 1 (Backend):

   cd server
   npm run dev

   Terminal 2 (Frontend):

   npm run dev

6. Open your browser

   • Frontend: http://localhost:5173
   • Backend API: http://localhost:3001

📖 Documentation

• Setup Guide - Detailed installation and configuration
• Summary - Quick reference and feature overview

🛠️ Tech Stack

Frontend

• React 18 - UI library
• React Router - Navigation
• Vite - Build tool
• Lucide React - Icons

Backend

• Node.js - Runtime
• Express - Web framework
• PostgreSQL - Database
• bcrypt - Password hashing
• JWT - Authentication tokens
• CORS - Cross-origin support

📁 Project Structure

mobile-store/
├── server/              # Backend API
│   ├── config/         # Database configuration
│   ├── routes/         # API routes
│   └── server.js       # Express server
├── src/                # Frontend source
│   ├── components/     # React components
│   ├── pages/          # Page components
│   ├── services/       # API services
│   └── context/        # React context
└── public/             # Static assets

🔐 API Endpoints

Authentication

• POST /api/auth/signup - Create new account
• POST /api/auth/login - User login
• GET /api/auth/me - Get current user (protected)

Health

• GET /api/health - API health check

🎨 Color Palette

Light Mode

• Primary: #1e3a8a → #3b82f6 (Blue gradient)
• Accent: #2563eb (Blue)
• Text: #0f172a (Dark slate)

Dark Mode

• Primary: #000000 → #0f172a (Black to dark slate)
• Accent: #3b82f6 (Bright blue)
• Text: #f8fafc (Light)

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📄 License

This project is licensed under the MIT License.

👤 Author

Your Name

🙏 Acknowledgments

• Design inspiration from modern e-commerce platforms
• Icons by Lucide
• Fonts by Google Fonts (Inter)

---

Made with ❤️ and React