WalrENS

WalrENS is a web application that bridges traditional web hosting and blockchain infrastructure by combining Walrus storage, Vercel deployment, and Ethereum Name Service (ENS) resolution.

Traditional web hosting relies on centralized servers that can be censored, taken down, or become inaccessible. While blockchain storage exists, it's often complex to use and doesn't provide the performance users expect. WalrENS solves this by creating a hybrid approach: Decentralized Storage: Content stored on Walrus for censorship resistance and permanent access

Performance: Websites deployed on Vercel's CDN for fast loading Access: Use ENS names (like yourname.eth) to access sites Workflow: Upload and deploy without blockchain expertise required

Technical Architecture

Frontend (Next.js + React) UI: Interface built with Tailwind CSS File Upload: Drag & drop with preview and validation Progress: Live updates during upload and deployment Workflow: Multi-step wizard from upload to live site Wallet Integration: Connect with MetaMask and other Web3 wallets

Backend APIs (Next.js API Routes) Upload API (/api/upload): Handles file processing and Walrus integration Deploy API (/api/deploy): Manages Vercel deployment automation Resolve API (/api/resolve): ENS name resolution and validation Proxy API (/api/proxy): Routes ENS-based requests to live sites

WalrENS represents a shift in web hosting, combining centralized performance with decentralized resilience. By making decentralized website deployment as simple as traditional hosting while maintaining blockchain technology benefits, WalrENS enables users to create uncensorable, permanently accessible websites without requiring deep technical knowledge of blockchain infrastructure.

The project demonstrates how Web3 technologies can be integrated with existing web infrastructure to create solutions that are both user-friendly and technically robust, paving the way for a more decentralized and resilient internet.

WalrENS is built on a modern full-stack architecture using Next.js 14 with TypeScript as the core framework, providing both the frontend interface and serverless API backend. The frontend leverages React 18 with Tailwind CSS for styling and integrates heavily with Web3 technologies including Wagmi
v2 and Viem for Ethereum interactions, RainbowKit for wallet connectivity, and custom ENS contract integrations for domain management. The application implements a sophisticated dual-deployment strategy where websites are
simultaneously stored on Walrus decentralized storage and optionally deployed to Vercel's traditional hosting infrastructure, creating a hybrid
approach that bridges Web2 and Web3 accessibility.

The most technically challenging aspect was creating seamless integration
between multiple complex systems that weren't designed to work together. We
had to solve several particularly hacky problems: first, implementing custom ENS contenthash encoding for Walrus blob references since no official codec exists yet, requiring us to create a custom "walrus://" format. Second, building a robust file processing pipeline that handles everything from ZIP archives to individual HTML files, automatically detecting content types and optimizing for both Walrus storage and web serving. The Vercel API integration required extensive format conversion
since their API expects files as arrays with specific naming conventions
that differed from our internal object-based structure. Perhaps the most
innovative solution was creating a content proxy system that makes Walrus-stored websites accessible through standard web browsers while maintaining the benefits of decentralized storage. We also implemented intelligent caching layers, optimistic UI updates for deployment feedback,
and a comprehensive error handling system that gracefully manages failures
across multiple external services, resulting in a system that feels like
traditional web hosting while being fully decentralized under the hood.