BLO - Image Hosting Platform

A secure image hosting platform with user authentication and file management capabilities.

Features

• User authentication with JWT tokens
• Image upload and storage
• Image gallery and management
• RESTful API backend
• React dashboard and vanilla JS client

Tech Stack

Backend:

• Node.js with Express.js
• MySQL database
• JWT authentication
• Multer for file uploads
• Bcrypt password hashing

Frontend:

• React dashboard (/dash)
• Vanilla JS client (/client)
• Tailwind CSS styling

Setup

Prerequisites

• Node.js and npm
• MySQL server

Backend

cd server
npm install

Configure .env file:

DB_HOST=localhost
DB_USER=your_username
DB_PASS=your_password
DB_NAME=blo
JWT_SECRET=your_jwt_secret
PORT=3000

Start server:

npm start

Frontend

React Dashboard:

cd dash
npm install
npm start

Vanilla JS Client:

cd client
python -m http.server 8080

API Endpoints

The API provides the following endpoints for image management:

• POST /api/login - Authenticate user and receive JWT token
• POST /api/images - Upload a new image (requires authentication)
• GET /api/images/:userId - Get all images for a specific user (requires authentication)
• PUT /api/images/:id - Update image metadata (requires authentication)
• DELETE /api/images/:id - Delete an image (requires authentication)

Authentication is handled via JWT tokens sent in the Authorization header:

Authorization: Bearer <token>

Project Structure

├── server/            # Express.js backend
├── dash/              # React dashboard
├── client/            # Vanilla JS client
└── blo.sql           # Database schema

notlightbloo