DOMPE.LK

A full-stack web application for managing and browsing shops in Dompe, Sri Lanka. This platform allows users to discover local shops, view shop details, and shop owners to manage their listings.

🚀 Features

• User Authentication: Secure signup and login system with JWT authentication
• Shop Browsing: Browse and search for shops in the Dompe area
• Shop Management: Shop owners can add and manage their shop listings
• Shop Details: View detailed information about each shop including images and contact details
• Responsive Design: Mobile-friendly interface for seamless browsing on any device

🛠️ Tech Stack

Frontend

• React 19.2.0 - UI library
• Vite - Build tool and development server
• React Router DOM - Client-side routing
• Axios - HTTP client for API requests
• Chart.js & Recharts - Data visualization
• React Slick - Carousel component
• jsPDF - PDF generation
• Zod - Schema validation
• JWT Decode - Token decoding

Backend

• Node.js - Runtime environment
• Express 5.1.0 - Web framework
• MongoDB - Database
• Mongoose - ODM for MongoDB
• JWT - Authentication tokens
• bcryptjs - Password hashing
• Multer - File upload handling
• CORS - Cross-origin resource sharing
• dotenv - Environment variable management

📁 Project Structure

DOMPELK/
├── dompeweb/           # Frontend React application
│   ├── src/
│   │   ├── components/ # React components
│   │   │   ├── Auth/   # Login & Signup
│   │   │   ├── home/   # Home page
│   │   │   ├── Nav/    # Navigation
│   │   │   ├── shops/  # Shop listing & details
│   │   │   └── adshops/ # Add shop form
│   │   ├── utils/      # Utility functions
│   │   └── assets/     # Static assets
│   └── public/         # Public assets
│
└── server/             # Backend Node.js application
    ├── controllers/    # Request handlers
    ├── models/         # Database models
    ├── routes/         # API routes
    ├── Uploads/        # Uploaded files
    └── Item_images/    # Shop images

🚦 Getting Started

Prerequisites

• Node.js (v14 or higher)
• MongoDB (local or MongoDB Atlas)
• npm or yarn

Installation

1. Clone the repository

   git clone https://github.com/Lahindu2001/DOMPE.LK.git
   cd DOMPELK

2. Setup Backend

   cd server
   npm install

3. Create environment file

   Create a .env file in the server directory:

   PORT=5000
   MONGODB_URI=your_mongodb_connection_string
   JWT_SECRET=your_jwt_secret_key

4. Setup Frontend

   cd ../dompeweb
   npm install

Running the Application

1. Start Backend Server

   cd server
   npm run dev

   Server will run on http://localhost:5000

2. Start Frontend Development Server

   cd dompeweb
   npm run dev

   Application will run on http://localhost:5173

🔑 API Endpoints

Authentication

• POST /api/auth/signup - Register new user
• POST /api/auth/login - User login

Shops

• GET /api/shops - Get all shops
• GET /api/shops/:id - Get shop by ID
• POST /api/shops - Create new shop (requires authentication)
• PUT /api/shops/:id - Update shop (requires authentication)
• DELETE /api/shops/:id - Delete shop (requires authentication)

Users

• GET /api/users/profile - Get user profile (requires authentication)
• PUT /api/users/profile - Update user profile (requires authentication)

📦 Build for Production

Frontend

cd dompeweb
npm run build

This creates an optimized production build in the dist folder.

Backend

The backend is production-ready. Ensure environment variables are properly set in your hosting environment.

🤝 Contributing

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 License

This project is open source and available under the MIT License.

👥 Authors

• Lahindu2001 - GitHub Profile

📧 Contact

For any queries or suggestions, please open an issue in the GitHub repository.

---

Made with ❤️ for the Dompe community