# How to Vibe Code Your Own Bluesky (and Stop Paying for It) > The decentralized social network - Site: https://bsky.app - Category: Social Media - Verdict: **Solid side project** (65/100 vibecodeable) - Estimated effort: 2-3 weeks part-time ## Verdict Build a centralized monolithic clone of the core UI and database loop, but keep paying or use the official app if you want the actual federated AT Protocol network. Replicating Bluesky's distributed AT Protocol, cryptographic PDS federation, and decentralized firehose architecture is an enterprise distributed systems feat that is impractical for a solo developer. However, building a classic centralized microblogging monolith (PostgreSQL, Node.js backend, Next.js frontend) with the same visual loop and core features is a very realistic side project using AI coding tools. ### What you can't replicate - The 45M+ active user social graph - True AT Protocol PDS account portability and decentralization - The global network of custom domain handle verification and relay infrastructure ## What it does A decentralized microblogging social media platform built on the AT Protocol, offering portable digital identities, custom domain handles, and modular algorithmic feeds. ### Core features - User profile management and authentication - Microblogging compose box (text posts up to 300 characters, media attachments) - Following/follower graph and relationship management - Chronological home timeline feed - Like, repost, and reply interactions - Notifications system - Basic search for users and posts ## The business ### Pricing - Consumer: Free ### Funding $124M raised. - Corporate Spin-out ($13M, 2021) - Seed ($8M, July 2023) - Series A ($15M, October 2024) - Series B ($100M, March 2026) Investors: Neo, Blockchain Capital, Bain Capital Crypto, Alumni Ventures, Anthos Capital, Bloomberg Beta, Knight Foundation, True Ventures Founded 2019. Team size: 30 to 50 employees. ## The hard parts - Replicating the distributed AT Protocol (PDS instances, cryptographic repo commits, and AppView relay synchronization) - DNS TXT record verification pipeline for custom domain handles - Real-time firehose data streaming and indexing architecture - Modular subscription feeds and custom third-party algorithmic feed routing ## How to vibe code Bluesky ### Prerequisites - Node.js LTS (free): Required runtime for executing the Next.js frontend and backend APIs. - GitHub (free): Source code repository and deployment trigger for cloud hosting. ### Recommended AI tools - Claude Code: Best-in-class agentic coding tool for scaffolding full-stack features and executing multi-file changes directly from the terminal. - Cursor: Ideal AI-native editor for refining UI components, composing feeds, and reviewing code diffs interactively. ### Stack - Frontend: Next.js (React) with Tailwind CSS - Backend: Next.js Server Actions / API Routes - Database: Neon (Serverless Postgres) - Auth: better-auth - Payments: none - Other: Vercel AI SDK, PostHog ### Hosting - Vercel (Zero-config hosting for the Next.js frontend and serverless API endpoints.): $0/mo (Hobby Tier) - Neon (Serverless Postgres database storing users, posts, follows, and likes.): $0/mo (Free Tier) ### Build guide 1. **Project Scaffolding & Database Schema** — Initialize the Next.js project with Tailwind CSS, configure Neon PostgreSQL connection via Drizzle ORM, and define the foundational database models for users, posts, follows, and likes. ``` Initialize a new Next.js project with TypeScript, Tailwind CSS, and App Router. Set up Drizzle ORM configured for a Neon serverless PostgreSQL database. Create the database schema with tables for users (id, handle, email, password_hash, display_name, avatar_url, bio, created_at), posts (id, author_id, content, reply_root_id, reply_parent_id, created_at), follows (follower_id, following_id, created_at), and likes (user_id, post_id, created_at). Ensure proper foreign key constraints, indexes on foreign keys and creation timestamps, and write a migration script. ``` 2. **Authentication Integration** — Implement local authentication using better-auth to manage user sessions, sign-up, sign-in, and session cookies connected to the Neon database. ``` Integrate better-auth into the Next.js application using the Neon PostgreSQL database. Create API endpoints and client-side helper hooks for email/password sign up, sign in, and session management. Build clean, responsive sign-in and sign-up pages styled with Tailwind CSS matching a modern microblogging aesthetic. Add middleware to protect authenticated routes. ``` 3. **Core Layout & Navigation Shell** — Build the responsive web app shell featuring a sidebar/bottom navigation bar for Home, Search, Notifications, Profile, and a prominent compose action button. ``` Build the main application layout shell in Next.js using Tailwind CSS. Include a sticky sidebar (for desktop) and bottom navigation bar (for mobile) with navigation items: Home, Search, Notifications, Profile, and Settings. Add a persistent 'Compose' trigger button. Ensure the layout is fully responsive, clean, and mimics a modern microblogging client layout. ``` 4. **Post Composition & Timeline Feed** — Develop the post creation component with a 300-character limit indicator and server action handling, alongside the chronological home timeline feed displaying author details and timestamps. ``` Create a post composition component featuring a text textarea with a live 300-character limit counter, validation, and a submit button invoking a Next.js server action. Then, build the home timeline feed component that fetches posts from followed users and the current user in reverse chronological order, including author display names, handles, avatars, formatted timestamps, and placeholder action buttons for reply, repost, and like. ``` 5. **Interactions: Likes, Reposts, and Replies** — Implement interactive backend logic and UI state updates for liking, reposting, and threading replies to microblog posts. ``` Implement server actions and client state handlers for liking, unliking, reposting, and replying to posts. Update the post card component to display live counts for likes, replies, and reposts, with optimistic UI updates when users click interaction buttons. Create a threaded post detail view page that displays a post, its parent context, and all child replies. ``` 6. **User Profiles & Follow Mechanics** — Build user profile pages showing user bios, post histories, follower/following counts, and functional follow/unfollow buttons. ``` Build a dynamic user profile page route ([handle]) that displays the user's avatar, banner, display name, handle, bio, follower count, and following count. Add a functional follow/unfollow toggle button with server action handling. Include tabbed navigation on the profile page to switch between 'Posts', 'Replies', and 'Likes' authored or interacted with by that user. ``` 7. **Polish, Error Handling & Deployment** — Add loading skeletons, error boundaries, toast notifications for user actions, and prepare the project for deployment on Vercel with Neon. ``` Add loading skeleton states for the feed and profile pages, error boundaries for robust fault tolerance, and toast notifications for successful actions or errors. Write a comprehensive README.md detailing local setup instructions, environment variables configuration, and deployment steps for Vercel and Neon. ``` ### Cost vs paying **Starting costs (one-time):** - AI coding assistant subscription: $20 one-time - Total: ~$20 one-time **Ongoing costs (monthly):** - Vercel Hobby Hosting: $0/mo - Neon Serverless Postgres: $0/mo - Total: $0/mo - Paying for the SaaS instead: Free - Build time: 25-35 hours - AI tool credits: $20 one-time (Cursor or Claude Pro) - Break-even: N/A (Official app is free) ## Sources - [Wikipedia: Bluesky](https://en.wikipedia.org/wiki/Bluesky) - [Bluesky Official Blog: Series B Announcement](https://bsky.social/about/blog/03-19-2026-series-b)