How to vibe codeSendible

Prerequisites

• Node.jsfree

  Required runtime for building and running the full-stack Next.js application.

• GitHubfree

  Source control and deployment pipeline integration with Vercel.

AI coding tools

• Claude Code

  Best-in-class terminal coding agent for scaffolding multi-file features, managing database schemas, and iterating rapidly through complex API integrations.

• Cursor

  AI-native code editor for reviewing diffs, fine-tuning React UI components, and managing workspace views.

Build guide

1. 01Project Scaffolding & Database Schema

   Initialize the Next.js repository with Tailwind CSS, configure Drizzle ORM with Neon Postgres, and set up better-auth supporting users, organizations, and workspaces.

   Create a new Next.js project using App Router, TypeScript, and Tailwind CSS. Install Drizzle ORM and configure connection pooling for Neon Postgres. Define database schemas in TypeScript for users, organizations (workspaces), social_accounts (storing encrypted OAuth tokens and platform metadata), scheduled_posts (with fields for content, media URLs, target platform, scheduled timestamp, and status enum), and post_logs. Implement better-auth with organization plugin support so users can switch between different client workspaces. Ensure strict foreign key relationships and indexes on scheduled timestamps and workspace IDs.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Workspace & Role-Based Access Control UI

   Build the dashboard layout with workspace switching, team member management, and role-based permissions using shadcn/ui components.

   Build a responsive dashboard layout using Next.js App Router and shadcn/ui components. Implement a workspace selector dropdown in the top navigation bar that allows users to switch between client accounts. Create settings pages for managing workspace team members, inviting users via email, and assigning role-based permissions (admin, editor, client reviewer). Write server actions that verify the active workspace context and enforce authorization checks on all database mutations.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03OAuth Integration Hub for Social Networks

   Implement OAuth connection flows for core platforms (Meta, LinkedIn, X, TikTok) to securely link user profiles without exposing passwords.

   Create a social account integration hub page that displays connected profiles per workspace and a 'Connect Profile' button. Implement secure OAuth 2.0 callback handlers for Meta (Facebook/Instagram), LinkedIn, and X (Twitter). Store encrypted access and refresh tokens securely in the database using a cryptographic helper. Include token status indicators, automatic expiration warnings, and a mechanism to disconnect or reconnect expired accounts.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Smart Compose & CSV Bulk Importer

   Build the post composition interface with multi-platform tailoring, character limit validation, media attachment support, and CSV bulk importing.

   Build a multi-platform post composer interface allowing users to select multiple social profiles, type custom text, add hashtags, attach first comments, and upload media files. Add real-time character limit counters for each selected platform. Implement a CSV bulk import feature with a file upload parser that validates CSV rows against required scheduling schema fields and populates the database queue in bulk with user review confirmation.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05Reliable Background Job Scheduler & Queue

   Integrate Inngest or durable background workers to poll and execute scheduled posts across platform APIs precisely on time.

   Implement a durable background processing pipeline using Inngest or serverless cron jobs to execute scheduled posts. Write worker functions that query pending posts whose scheduled timestamp has arrived, lock the records to prevent duplicate execution, dispatch the payload to the respective social platform API (Meta, LinkedIn, X, etc.), handle API rate limits and retry logic gracefully, and update the post status to 'published' or 'failed' with error logging.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06Unified Priority Inbox & Engagement Stream

   Develop a centralized inbox merging incoming comments, mentions, and direct messages across connected social profiles.

   Build a centralized priority inbox interface that aggregates incoming comments, DMs, and mentions from connected social platforms into a unified feed. Implement filtering by workspace, social network, and read status. Create reply action forms that call platform APIs to send responses directly back to the respective comment or thread from within the app dashboard.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for Sendible