Peer to Peer File Transfer

Real-Time File Transfer Application – Rust & WebSockets

A full-stack real-time file transfer application built with Rust and Next.js, designed to transfer files between users through persistent WebSocket connections without relying on traditional file hosting services.

The Problem

Sharing files between devices or users often requires uploading files to third-party platforms, waiting for cloud processing, and downloading them again on the receiving device.

These workflows introduce unnecessary storage dependencies, additional steps, and potential limitations on file sharing.

I wanted to explore a different approach by building a real-time file transfer system that handles communication and file delivery through persistent connections.

The Solution

I built a full-stack file transfer application using Rust (Axum) as the backend and Next.js as the frontend.

The application establishes WebSocket connections between clients and the backend, allowing users to send and receive files through a real-time communication workflow.

Instead of relying on traditional HTTP upload/download workflows, the application uses persistent WebSocket connections to handle file transfer events and communication between connected users.

Key Features

• Real-Time File Transfer: Transfer files through persistent WebSocket connections.
• Dedicated Sender & Receiver Interfaces: Separate workflows for sending and receiving files.
• Unique Connection Identification: Generate UUIDs to identify and manage individual client connections.
• Drag & Drop Upload: Select files using drag-and-drop or the native file browser.
• Connection Keep-Alive: Automatic ping messages help maintain active WebSocket connections.
• Real-Time Notifications: Display success and error notifications during the transfer process.
• No Registration Required: Start transferring files without creating an account.
• Lightweight Architecture: A dedicated Rust backend handles real-time communication independently of the Next.js frontend.

Technology Stack

• Backend: Rust, Axum.
• Async Runtime: Tokio.
• Real-Time Communication: WebSockets.
• Serialization: Serde.
• Connection Management: UUID.
• Async Stream Handling: Futures.
• Frontend: Next.js 15, React 19, TypeScript.
• Styling: Tailwind CSS.
• UI & Notifications: React Toastify, Lucide Icons.
• Theme Management: next-themes.
• Deployment: Vercel and a separately hosted Rust backend.

Engineering Highlights

This project provided an opportunity to work with a different backend ecosystem and explore real-time communication beyond conventional REST APIs.

Some of the main engineering aspects include:

• Building an asynchronous backend using Rust and Tokio.
• Implementing WebSocket communication using Axum.
• Managing persistent client connections and identifying users through UUIDs.
• Handling real-time communication events between the sender, receiver, and backend.
• Separating frontend presentation from backend communication responsibilities.
• Implementing connection keep-alive mechanisms to reduce unexpected disconnections.
• Exploring Rust's ownership model and asynchronous programming patterns in a practical full-stack application.

Demo Limitations

The current public demo has a 10MB file size limit due to free hosting constraints. The backend implementation is not inherently restricted to this demo limit.

Links

• Live Demo
• GitHub Repository

---

Built by Youssef Mohammed