KartScanner is a dynamic and responsive e-commerce platform that allows users to search and view a variety of products. With a user-friendly interface and efficient product listing, KartScanner provides a seamles experience. The website fetches product data from an external API and displays it in a visually appealing and organized manner.
The primary purpose of building KartScanner is to create an intuitive and efficient shopping platform homepage that offers users a smooth and enjoyable browsing experience. By leveraging modern web technologies, KartScanner ensures fast load times, responsive design, and easy navigation.
- Product Search: Users can search for products using the search bar, which filters products in real-time.
- Responsive Design: The website is designed to be fully responsive, ensuring a seamless experience on both desktop and mobile devices.
- Product Listing: Products are displayed in a grid layout with images, titles, and prices.
- Loading Indicator: A loading indicator is displayed while fetching data from the API to improve user feedback.
To get started with KartScanner, follow the instructions below to set up the project on your local machine.
Ensure you have the following software installed on your system:
- Node.js (v12.x or later)
- npm (v6.x or later) or yarn (v1.x or later)
- Git
-
Clone the Repository:
git clone https://github.com/GarvitV957/kartscanner.git
-
Navigate to the Project Directory:
cd kartscanner -
Install Dependencies:
npm install
-
Run the Development Server:
npm run dev
-
Open the Application:
Open your browser and navigate to http://localhost:3000 to see the KartScanner website in action.
Once the project is set up and running locally, you can:
- Search for Products: Use the search bar at the top to filter products by their title.
- Browse Products: View the list of products displayed in a responsive grid layout.
- View Product Details: Click on any product to view more details (this will be implemented in the individual product pages).
