https://github.com/mshradtya/peer-share
share files directly, no middleman.
https://github.com/mshradtya/peer-share
browser-to-browser data-transfer direct-transfer file-sharing file-transfer p2p peer-to-peer react shadcn-ui typescript typescript-project web-application webrtc
Last synced: 2 months ago
JSON representation
share files directly, no middleman.
- Host: GitHub
- URL: https://github.com/mshradtya/peer-share
- Owner: mshradtya
- Created: 2025-03-14T06:00:05.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-25T05:14:45.000Z (about 1 year ago)
- Last Synced: 2025-03-25T06:23:14.780Z (about 1 year ago)
- Topics: browser-to-browser, data-transfer, direct-transfer, file-sharing, file-transfer, p2p, peer-to-peer, react, shadcn-ui, typescript, typescript-project, web-application, webrtc
- Language: TypeScript
- Homepage: https://peer-share-mshradtya.vercel.app
- Size: 188 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# PeerShare - A WebRTC based file sharing platform
A React application that enables direct peer-to-peer file transfers using WebRTC technology, with no server required for the actual file transfer.
## 🚀 Features Implemented
### Core Functionality
- ✅ Direct browser-to-browser file transfers using WebRTC data channels
- ✅ No server required for file transfers (only initial SDP exchange needed)
- ✅ Copy/paste connection method for establishing peer connections
- ✅ Large file support with chunked file transfer
- ✅ Real-time progress tracking for both sender and receiver
- ✅ Clean, modern UI using shadcn/ui components
### Architecture
- ✅ Context-based state management with React Context API
- ✅ Componentized structure with separation of concerns
- ✅ TypeScript implementation for type safety
- ✅ Optimized file chunking with flow control
## 🔧 Technical Details
- **WebRTC**: Used for establishing direct peer-to-peer connections
- **Data Channels**: Transfers binary data directly between browsers
- **File Chunking**: Files are broken into 32KB chunks for efficient transfer
- **Flow Control**: Implements send queue with configurable delay between chunks
- **STUN/TURN**: Basic STUN server support for NAT traversal
## 🛣️ Future Roadmap
### Short Term (Easier)
- [x] Drag and drop file interface
- [ ] File preview functionality for common formats
- [ ] Multiple file selection
- [x] UI improvements (responsive design, animations)
- [ ] Enhanced connection status indicators
- [ ] Basic text/clipboard sharing alongside files
### Medium Term (Moderate Complexity)
- [ ] Transfer queue for multiple files
- [ ] Transfer cancellation support
- [ ] File compression for compatible types
- [ ] Simple signaling server for easier connections (optional)
- [ ] QR code generation for connection strings
- [x] Dark/light theme support
### Long Term (Advanced)
- [ ] Connection resilience with transfer resumption
- [ ] File integrity verification (checksums)
- [ ] End-to-end encryption for transfers
- [ ] Multi-peer connections (3+ users)
- [ ] Folder transfer support with directory structure preservation
- [ ] Adaptive chunk sizing based on network conditions
## 🛠️ Getting Started
### Prerequisites
- Node.js 14+
- npm or yarn
### Installation
```bash
# Clone the repository
git clone https://github.com/yourusername/webrtc-file-transfer.git
cd webrtc-file-transfer
# Install dependencies
npm install
# or
yarn install
# Start the development server
npm run dev
# or
yarn dev
```
## 📖 How It Works
1. **Connection Establishment**
- One peer creates a connection, generating an SDP offer
- The SDP offer is shared with the second peer (via copy/paste)
- Second peer adds the SDP offer and generates an SDP answer
- First peer adds the SDP answer to complete the connection
2. **File Transfer**
- Sender selects a file to share
- File is broken into chunks and queued for transfer
- WebRTC data channel transfers chunks directly to the receiver
- Receiver assembles chunks into the complete file
- Progress is tracked and displayed in real-time
## 🤝 Contributing
Contributions are welcome! Check the roadmap for planned features, or submit your own ideas.
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request
## 📝 License
This project is licensed under the MIT License - see the LICENSE file for details.