This project is a demonstration of my expertise in building full-stack applications using modern technologies. The app consists of a separate frontend (React) and backend (Node.js with Express.js) to showcase API handling, data fetching, and efficient state management.
- π οΈ Backend API with Express.js: Provides product data with search functionality.
- π¨ Frontend with React: Fetches data from the backend and implements a search feature.
- π Axios for API Calls: Ensures efficient communication between frontend and backend.
- β³ Loading and Error Handling: Implements loading states and error messages for a better user experience.
- π¦ AbortController for Request Cancellation: Prevents unnecessary API calls and handles request race conditions.
- β‘ Backend: Node.js, Express.js
- π Frontend: React, Axios
- π State Management: React Hooks (useState, useEffect)
git clone https://github.com/iAmUsmanAwan/API_Handling.git
cd API_Handling
cd backend
npm install
npm start
- The server runs on
http://localhost:3000/api/products
cd frontend
npm install
npm run dev
- The app runs on
http://localhost:5173
- π Get All Products:
GET /api/products
- π Search Products:
GET /api/products?search={query}
If you find this project helpful, please consider starring the repository β and following me on GitHub! π