Tail-Treasure Online Pet Food Shop

Tail-Treasure is an online pet food shop designed to provide a wide variety of pet foods and supplies with an easy-to-use interface. This project was developed in collaboration with a team.

Team Members

Technologies Used

  • React
  • Node.js
  • Express
  • MongoDB
  • CSS/SCSS
  • Tailwind CSS
  • Bootstrap
  • Cookies
  • JWT (JSON Web Tokens)

Features

  • Responsive Design: Optimized for all device sizes.
  • User Authentication: Register, login, logout, and profile management.
  • Forgot and Reset Password: Secure password recovery and reset functionality.
  • Product Management: Dynamic gallery for browsing products.
  • Shopping Cart: Add to cart, view cart, and checkout process.
  • Admin Dashboard: Manage products, orders, and users.
  • Contact Form: Integrated with EmailJS for direct customer inquiries.

Installation

To run this project locally, follow these steps:

  1. Clone the repository:

    git clone git@github.com:BalasimJasim/Tail-Treasure.git
    cd tail-treasure
  2. Install the dependencies:

    npm install
  3. Set up the environment variables by creating a .env file in the root directory. Add the following variables:

    PORT=5000
    SECRET_KEY=your_secret_key
    CONNECTION_STRING=your_mongodb_connection_string
    EMAIL_APP=your_email_app
    APP_PASS=your_app_password
    CLIENT_DOMAIN=http://localhost:5173
    SERVER_DOMAIN=http://localhost:5000
    
  4. Run the backend server:

    npm start
  5. Run the frontend server:

    npm run dev

Usage

Visit http://localhost:5000 to view the application.

Home Page

Home Page

Product Page

Product Page

Home Page (Mobile)

Home Page Mobile1 Home Page Mobile2

Shopping Cart

Cart

Featured Products Slider

Featured Products Slider

Admin Dashboard

Admin Dashboard