📁 File Share by QR Code (Full Stack)

A full-stack web application that allows users to upload files and instantly share them using a QR code.
The project features a React (Vite) frontend and a Node.js + Express backend, with enhanced UI, progress tracking, and secure file handling.

---

🚀 Project Overview

File Share by QR enables fast and convenient file transfer between devices.
After uploading a file, a unique QR code is generated which can be scanned to download the file instantly.

This project evolved from a basic HTML frontend to a modern React-based UI with additional backend features.

---

🛠 Tech Stack

Frontend

• React (Vite)
• JavaScript
• CSS
• Axios

Backend

• Node.js
• Express.js
• MongoDB
• Cloudinary

Tools & Libraries

• Multer (file uploads)
• QR Code generation
• Crypto utilities
• dotenv
• ESLint

---

✨ Features

• 📤 Upload files of any type
• 📱 QR code generation for downloads
• 📊 Upload progress bar
• 🌙 Dark mode toggle
• 📂 Category-based file selection
• 🔐 Secure file handling
• ☁️ Cloudinary integration
• 💻 Responsive UI (desktop & mobile)

---

📂 Project Structure

File_Share_byQR/ |- Backend -- Add all folders of backend from Code section |- Frontend -- Add all folders of frontend from Code section

---

⚙️ Installation & Setup

1️⃣ Clone the Repository

git clone https://github.com/Rohan-shiva/File_Share_byQR.git
cd File_Share_byQR

2️⃣ Backend Setup

cd backend npm install node app.js

Create a .env file:

PORT=5000 MONGO_URI=your_mongodb_uri CLOUDINARY_CLOUD_NAME=your_cloud_name CLOUDINARY_API_KEY=your_api_key CLOUDINARY_API_SECRET=your_api_secret

3️⃣ Frontend Setup

cd frontend npm install npm run dev

Open in browser:

http://localhost:5173