Bio is a comprehensive link-in-bio platform clone inspired by bio.link, enabling users to create personalized landing pages with multiple links, customizable themes, and social media integration.
Tech Stack
- Framework: Next.js 15 with App Router
- Database: PostgreSQL with Prisma ORM
- Authentication: Cookie-based custom auth system
- Styling: Tailwind CSS
- File Storage: Firebase for images and media
- Deployment: Vercel
- Package Manager: pnpm
Core Features
Link Management
- Drag & Drop Interface: React Beautiful DnD for intuitive link reordering
- Multiple Link Types: Support for social links, custom URLs, and embedded content
- Link Analytics: Track clicks and engagement for each link
- Custom Icons: React Icons library for diverse icon options
- QR Code Generation: Unique QR codes for each user profile
Theme System
- 18+ Pre-built Themes: Including gradient, video, and pattern backgrounds
- Custom Theme Engine: Support for custom colors, images, and videos
- Dynamic Theme Loading: Real-time theme switching without page reload
- Confetti Effects: Special animated themes for engagement
User Experience
- Profile Customization: Avatar, bio, and social media links
- Social Sharing: React Share integration for easy profile sharing
- Content Filtering: Bad-words library for inappropriate content detection
- Toast Notifications: React Hot Toast for user feedback
- Session Management: Encrypted cookie-based authentication with crypto-js
Implementation Details
Authentication Architecture
- Three-cookie system for security: adminLinker (user ID), session_token, and isLoggedIn flag
- Middleware-based route protection for admin areas
- Secure session token generation and validation
Database Design
- User model with theme data stored as JSON
- Link and SocialLink models with proper relationships
- Optimized queries using Prisma ORM
- ID normalization for consistent UUID handling
Current Status
The platform is actively being developed with core functionality complete. Future enhancements include advanced analytics, email integration, and premium theme marketplace.
Target Audience
- Content Creators: Influencers, artists, and creators needing a central hub
- Small Businesses: Companies wanting a simple mobile-first landing page
- Freelancers: Professionals showcasing their portfolio and services
- Social Media Users: Anyone wanting to organize their online presence