Waltube

WalTube: Decentralized video streaming platform with Web3 wallet integration and Tusky storage

Waltube

Created At

ETHGlobal Cannes

Winner of

Walrus - Best app using Walrus for storage

Project Description

WalTube is a decentralized video streaming platform that combines Web3 wallet authentication with distributed storage technology. The platform enables users to securely upload, store, and stream videos through a modern web interface while maintaining full control over their content through blockchain-based authentication.

The platform features seamless Web3 authentication using Privy for secure user authentication, along with decentralized storage integration through the Tusky SDK for distributed video storage and retrieval. WalTube supports multi-quality streaming with multiple video qualities including 360p, 480p, 720p, and 1080p with automatic quality selection. The advanced video player is custom-built with fullscreen support, seeking controls, volume management, and keyboard shortcuts. The platform offers real-time streaming capabilities supporting MP4 direct streaming. The responsive design is built with Tailwind CSS for optimal viewing across all devices.

How it's Made

WalTube is built using Next.js 14 with App Router for server-side rendering and optimal performance. The authentication system utilizes the Privy SDK for Web3 wallet integration supporting MetaMask, WalletConnect, and other popular wallets. The storage backend leverages the Tusky SDK for decentralized file storage and streaming capabilities. The styling is implemented with Tailwind CSS for responsive and modern UI design, and the entire application is written in TypeScript for type safety and better developer experience.

The frontend architecture is built with Next.js App Router for modern React patterns and includes a custom video player component with advanced controls for seeking, fullscreen mode, and quality selection. Suspense boundaries are implemented for optimal loading states and error handling, while dynamic routing enables video streaming with URL parameters.

The storage integration features Tusky SDK integration for decentralized file storage with custom API routes at /api/tusky for backend communication. The system supports multiple video formats and quality levels with efficient streaming and buffer management.

The authentication flow incorporates Privy integration for seamless Web3 wallet connection with secure session management using environment variable configuration. The system provides user-friendly onboarding for both crypto-native and traditional users.

The custom video player was built from scratch using native HTML5 video APIs and includes advanced seeking functionality with visual progress indicators. Fullscreen API integration supports keyboard shortcuts with F for fullscreen and Escape to exit. The player features custom volume controls and mute functionality along with buffer progress visualization.

Streaming optimization includes dynamic quality selection based on available formats and efficient video seeking with position restoration. The system supports both direct MP4 streaming and HLS protocols with real-time streaming statistics and performance monitoring.

The deployment strategy utilizes Vercel deployment with standalone output configuration and environment variable management for secure API key handling. ESLint configuration is optimized for production builds with dynamic rendering for pages requiring client-side data fetching.

The Tusky SDK provides significant benefits including decentralized storage that eliminates single points of failure and offers cost-effective storage solutions compared to traditional cloud providers. The system includes built-in redundancy and data integrity with seamless integration into the Web3 ecosystem.

Privy integration offers simplified Web3 onboarding for users with support for multiple wallet types and secure authentication without complex wallet integration code. The system enhances user experience with familiar Web2 patterns while maintaining Web3 security.

WalTube has been successfully deployed to Vercel with production-ready configuration and environment variables securely configured for all deployment environments. The optimized build process uses standalone output for better performance and includes comprehensive error handling and loading states for production reliability. WalTube represents a significant step forward in decentralized media platforms, combining the best of Web3 technology with intuitive user experience design.

background image mobile

Join the mailing list

Get the latest news and updates