A modern, responsive e-commerce web application built with React and Vite. FarmConnect serves as a digital marketplace connecting users directly with local farmers to purchase fresh produce and artisanal goods.
The project demonstrates a complete front-end workflow, including component-based architecture, client-side routing, and state management for a shopping cart.
- Fully Responsive: Mobile, tablet, and desktop-friendly design.
- Product Catalog: Browse a collection of farm-fresh products.
- Dynamic Product Pages: View detailed information for each product.
- Functional Search: Search for products directly from the homepage.
- Client-Side Routing: Seamless navigation without page reloads using React Router.
- Shopping Cart: A fully functional client-side cart to add, view, and remove items.
- Modern UI: Clean and user-friendly interface styled with Tailwind CSS.
- Framework: React
- Build Tool: Vite
- Language: TypeScript
- Styling: Tailwind CSS
- Routing: React Router DOM
- State Management: React Context API
- Icons: Heroicons
Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.
You need to have Node.js (version 16 or later) and npm installed on your machine.
-
Clone the repository:
git clone https://github.com/JewelArimattom/AgriConnect.git
-
Navigate to the project directory:
cd farmconnect -
Install NPM packages:
npm install
-
Run the development server:
npm run dev
The application will be available at
http://localhost:5173(or another port if 5173 is in use).
In the project directory, you can run:
npm run dev: Runs the app in development mode.npm run build: Builds the app for production to thedistfolder.npm run lint: Lints the code for errors and warnings.npm run preview: Serves the production build locally to preview it.
The project follows a standard Vite + React structure: