DCommerce is an e-commerce platform built with React, Tailwind CSS, FontAwesome, and other technologies. It provides users with a seamless shopping experience, allowing them to browse through a variety of products and easily add items to their cart.
-
Product Listing: Display a list of products available for purchase.
-
Product Details: View detailed information about each product, including images,prices.
-
Add to Cart: Add products to the shopping cart with a single click.
-
Cart Management: View and manage items in the shopping cart, including removing items
-
Navigation: Navigate between different sections of the application using React Router DOM.
-
Animations: Implement smooth animations using the AOS (Animate On Scroll) library.
-
Product Search: Implemented a search feature that allows users to search for products by name / title
-
Category Selection: Implemented a category selection feature that allows users to filter products by specific categories, such as electronics, clothing, and more.
-
Price Selection: a price selection feature that allows users to filter products by specific price ranges, making it easier to find items within their budget
- React: A JavaScript library for building user interfaces, utilizing hooks such as
useState
,useEffect
,useReducer
, anduseContext
for state management and side effects. - Tailwind CSS: A utility-first CSS framework for rapidly building custom designs.
- FontAwesome: A popular icon set and toolkit for web development, utilized for adding icons to the user interface.
- React Router DOM: Declarative routing for React applications, used for handling navigation between different components.
- AOS: Animate On Scroll library for adding animations to elements when they come into view.
Before running the project, ensure that you have the following installed:
- Node.js: Make sure you have Node.js installed on your system. You can download and install it from https://nodejs.org/.
- npm or Yarn: npm comes bundled with Node.js, but you can also use Yarn as an alternative package manager. Install Yarn from https://yarnpkg.com/ if you prefer.
To run the project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/LinkBroken/D-commerce.git
-
Navigate to the project directory:
cd dcommerce
-
Install dependencies:
npm install react react-dom react-router-dom @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons @fortawesome/react-fontawesome tailwindcss postcss-cli autoprefixer
or
yarn add react react-dom react-router-dom @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons @fortawesome/react-fontawesome tailwindcss postcss-cli autoprefixer
-
Start the development server:
npm run dev
-
Open your browser and navigate to http://localhost:5173 to view the application.
Contributions are welcome! If you'd like to contribute to the project, please follow these guidelines:
- Fork the repository and create your branch (
git checkout -b feature/my-feature
). - Commit your changes (
git commit -am 'Add my feature'
). - Push to the branch (
git push origin feature/my-feature
). - Create a new Pull Request.
This project is licensed under the MIT License.