BlinkIt Clone - Backend Server

A Node.js Express server that serves category icons and provides API endpoints for the BlinkIt Clone frontend.

Features

• In-memory category storage: All category icons are stored in a Map for fast access
• RESTful API endpoints: Get all categories, specific categories, and serve images
• Static file serving: Serves HTML, CSS, and images
• Error handling: Proper error responses for missing resources

Installation

1. Install Node.js dependencies:

npm install

Running the Server

Development mode (with auto-restart):

npm run dev

Production mode:

npm start

The server will start on http://localhost:3000

API Endpoints

1. Get All Categories

GET /api/categories

Response:

{
  "success": true,
  "data": [
    {
      "id": "paan",
      "name": "Paan Corner",
      "imageName": "category-paan.avif",
      "alt": "Paan Corner"
    },
    // ... more categories
  ],
  "count": 10
}

2. Get Specific Category

GET /api/categories/:id

Example: GET /api/categories/paan

Response:

{
  "success": true,
  "data": {
    "id": "paan",
    "name": "Paan Corner",
    "imageName": "category-paan.avif",
    "alt": "Paan Corner"
  }
}

3. Serve Category Image

GET /api/categories/:id/image

Example: GET /api/categories/paan/image

Returns the actual image file for the category.

4. Add New Category (POST)

POST /api/categories

Request Body:

{
  "id": "new-category",
  "name": "New Category Name",
  "imageName": "category-new.avif",
  "alt": "New Category Alt Text"
}

Available Categories

The server includes the following categories:

• paan: Paan Corner
• dairy: Dairy, Bread & Eggs
• fruits: Fruits & Vegetables
• drinks: Cold Drinks & Juices
• snacks: Snacks & Munchies
• breakfast: Breakfast & Instant Food
• sweet: Sweet Tooth
• bakery: Bakery & Biscuits
• tea: Tea, Coffee & Health Drink
• grains: Atta, Rice & Dal

File Structure

BlinkIt Clone/
├── server.js          # Main server file
├── package.json       # Node.js dependencies
├── index.html         # Frontend HTML
├── styles.css         # Frontend styles
├── images/            # Category images
│   ├── category-paan.avif
│   ├── category-dairy.avif
│   └── ... (other images)
└── README.md          # This file

Usage Examples

Using curl to test the API:

# Get all categories
curl http://localhost:3000/api/categories

# Get specific category
curl http://localhost:3000/api/categories/paan

# Get category image
curl http://localhost:3000/api/categories/paan/image -o paan-image.avif

Using JavaScript fetch:

// Get all categories
fetch('/api/categories')
  .then(response => response.json())
  .then(data => console.log(data));

// Get specific category
fetch('/api/categories/paan')
  .then(response => response.json())
  .then(data => console.log(data));

Error Handling

The API returns proper HTTP status codes and error messages:

• 200: Success
• 400: Bad Request (missing required fields)
• 404: Not Found (category or image doesn't exist)
• 409: Conflict (category already exists)
• 500: Internal Server Error

Development

To modify the categories, edit the categoryIcons Map in server.js. The structure is:

const categoryIcons = new Map([
  ['category-id', {
    id: 'category-id',
    name: 'Category Display Name',
    imageName: 'category-image.avif',
    alt: 'Alt text for accessibility'
  }]
]);