AnonFiles v2

AnonFiles v2 is a secure and efficient file hosting service that allows users to upload and share files anonymously. Built with a Node.js backend using Express and a React frontend, this application ensures seamless file management, robust security measures, and a user-friendly interface.

📋 Table of Contents

• Features
• Technologies Used
• Demo
• Getting Started
  • Prerequisites
  • Installation
  • Environment Variables
• Running the Application
  • Backend
  • Frontend
• API Endpoints
• Project Structure
• Contributing
• License
• Contact

✨ Features

• 📂 Anonymous File Uploads: Upload files without the need for an account.
• 🔒 Secure File Storage: Files are stored securely on the server with unique identifiers.
• ✅ File Validation: Only allowed file types are accepted, ensuring security and integrity.
• 🚫 Rate Limiting: Prevents abuse by limiting the number of uploads per IP address.
• 🌐 CORS Configuration: Allows requests from specified frontend origins.
• 🐞 Error Handling: Comprehensive error handling for better reliability and user feedback.
• 📈 Scalable Architecture: Designed to handle large files (up to 1GB) efficiently.

🛠️ Technologies Used

Backend

• Node.js - JavaScript runtime.
• Express - Web framework for Node.js.
• Multer - Middleware for handling multipart/form-data (file uploads).
• nanoid - For generating unique IDs.
• CORS - Middleware for enabling Cross-Origin Resource Sharing.
• dotenv - Loads environment variables from a .env file.
• express-rate-limit - Rate-limiting middleware for Express.
• Other Libraries: path, fs, child_process, etc.

Frontend

• React - JavaScript library for building user interfaces.
• Other Libraries: (Assumed based on standard React setup)

Development Tools

• Git - Version control system.
• GitHub - Repository hosting service.
• VS Code - Code editor (optional).

🎥 Demo

🚀 Getting Started

📋 Prerequisites

Ensure you have the following installed on your system:

• Node.js (v14 or higher) - Download Here
• npm (comes with Node.js) or Yarn - Yarn Installation Guide
• Git - Download Here

🛠️ Installation

1. Clone the Repository

   git clone /~https://github.com/av1ast/anonfiles_v2.git

2. Navigate to the Project Directory

   cd anonfiles_v2

3. Install Backend Dependencies

   cd backend
   npm install

4. Install Frontend Dependencies

   cd ../frontend
   npm install

📁 Environment Variables

Create a .env file in both the backend and frontend directories with the necessary environment variables.

Backend .env

PORT=5000
FRONTEND_URL=http://localhost:3000
BACKEND_URL=http://localhost:5000

• PORT: Port on which the backend server will run.
• FRONTEND_URL: The URL where the frontend is hosted.
• BACKEND_URL: The URL where the backend is accessible.

Ensure that FRONTEND_URL matches the origin from which your frontend is making requests.

Frontend .env

REACT_APP_BACKEND_URL=http://localhost:5000

• REACT_APP_BACKEND_URL: The backend server URL used by the React application to make API requests.

Note: In React, environment variables must start with REACT_APP_ to be accessible in the application.

🏃‍♂️ Running the Application

Backend

1. Navigate to the Backend Directory

   cd backend

2. Start the Backend Server

   npm start

   The server will start on the port specified in the .env file (default is 5000).

Frontend

1. Navigate to the Frontend Directory

   cd frontend

2. Start the Frontend Application

   npm start

   The React application will start on http://localhost:3000.

Ensure that both the backend and frontend servers are running simultaneously for the application to function correctly.

🔌 API Endpoints

1. Upload File

• Endpoint: /upload
• Method: POST
• Description: Uploads a single file to the server.
• Headers:
  • Content-Type: multipart/form-data
• Body:
  • file (form-data) - The file to be uploaded.
• Response:
  • Success (200):

    {
      "link": "http://localhost:5000/file/<unique_id>"
    }
    

  • Error (400/500):

    {
      "error": "Error message"
    }
    

2. Download File

• Endpoint: /file/:id
• Method: GET
• Description: Downloads the file associated with the provided unique ID.
• Response:
  • Success: Initiates file download.
  • Error (404/500): Displays error message.

📂 Project Structure

anonfiles_v2/
├── backend/
│   ├── uploads/           # Directory where uploaded files are stored
│   ├── index.mjs         # Main backend application file
│   ├── package.json
│   └── .env
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   ├── App.jsx
│   │   └── ...           # Other React components and files
│   ├── package.json
│   └── .env
├── assets/
│   ├── logo.png
│   ├── upload_screenshot.png
│   └── download_screenshot.png
├── .gitignore
├── README.md
└── LICENSE

🤝 Contributing

Contributions are welcome! Follow these steps to contribute to the project:

1. Fork the Repository
2. Clone the Forked Repository

   git clone /~https://github.com/your-username/anonfiles_v2.git
   cd anonfiles_v2

3. Create a New Branch

   git checkout -b feature/YourFeature

4. Make Your Changes
5. Commit Your Changes

   git commit -m "Add Your Feature"

6. Push to the Branch

   git push origin feature/YourFeature

7. Open a Pull Request

   Describe your changes and submit the pull request for review.

Please ensure that your contributions adhere to the project guidelines and coding standards.

📄 License

This project is licensed under the MIT License. You are free to use, modify, and distribute this project as per the terms of the license.

Feel free to reach out for collaborations or any inquiries related to the project.