Skip to content

Istiak-A-Tashrif/ClayNest-Client

Repository files navigation

Art & Craft Store Website - Ceramics and Pottery


Features:

  1. Unique Craft Category: Exclusive collection of Ceramics and Pottery.
  2. Responsive Design: Seamlessly adapts to various devices - mobile, tablet, and desktop.
  3. User Authentication: Secure login and registration with email, password, and social media options.
  4. Craft Item Management:
    • Add, update, and delete craft items with ease.
    • Private/protected routes ensure data security.
  5. Explore Craft Categories:
    • Discover a wide range of Ceramics and Pottery subcategories.
    • View detailed information and images for each craft item.
  6. Customization Options:
    • Customize craft items based on user preferences.
  7. Light/Dark Theme Toggle: Enhance user experience with theme customization options.
  8. Interactive Elements:
    • Engage users with animations using Lottie React and React Awesome reveal.
    • Provide tooltips for enhanced usability with React-tooltip.
  9. Informative Footer: Includes website details, copyright, contact information, and social media links.
  10. Error Handling: Display meaningful error messages using toasts/sweet alerts.
  11. Loading Spinner: Inform users about data loading status with a loading spinner.

Technologies Used:

  • Frontend:
    • React
    • React Router DOM
    • React Helmet Async
    • React Hook Form
    • React Icons
    • React Toastify
    • Challenging Packages:
    • Swiper (for sliders/carousels)
  • Styling:
    • Tailwind CSS
    • DaisyUI (for additional Tailwind components)
  • Backend:
    • Express.js
    • MongoDB
    • Firebase (for authentication and database)
    • CORS
    • dotenv (for environment variables)
  • Other:
    • LocalForage (for local storage)
    • SweetAlert2 (for alerts)
    • Match Sorter (for sorting)
    • Sort By (for sorting)
  • Build Tools:
    • Vite (for development and build)

Selected Subcategories:

a. Clay-made pottery b. Stoneware c. Porcelain d. Terra Cotta e. Ceramics & Architectural f. Home decor pottery


Repository Structure:

  1. Client-Side Code: GitHub Repository
  2. Server-Side Code: GitHub Repository
  3. README.md:
    • Detailed information about the website.
    • Setup instructions for local development.
    • Deployment instructions.
    • Description of features and technologies used.

Getting Started

Prerequisites

  • Node.js
  • MongoDB
  • Firebase account

Installation

  1. Clone the repository:
git clone https://github.com/Istiak-A-Tashrif/ClayNest-Client.git
cd claynest
  1. Install the dependencies:
npm install
  1. Set up environment variables:
  • Create a .env file in the root directory
  • Add your Firebase config keys and MongoDB credentials
  1. Run the application:
npm start

Note:

  • For any queries or assistance, feel free to contact Istiak Ahmed Tashrif at [istiaktashrif@gmail.com].
  • Thank you for considering this submission. We look forward to your feedback!