A modern Next.js application that accelerates your social media workflow with intelligent AI agents that create, optimize, and schedule your content across all platforms.
- AI-Powered Content Creation: Intelligent content generation and optimization
- Multi-Platform Support: Twitter (X) and LinkedIn integration
- Smart Scheduling: Optimal posting times for maximum engagement
- Authentication: Google OAuth and Email magic links via NextAuth.js
- Twitter Integration: Full OAuth 1.0a flow for posting tweets
- User Management: Profile management and analytics
- Security: Rate limiting, input sanitization, and security headers
- Modern UI: Beautiful interface built with shadcn/ui and Tailwind CSS
- Node.js 18+
- MongoDB database
- Google OAuth credentials
- Twitter API credentials
- Resend account for email magic links
- Cloudflare Turnstile account for bot protection
- Copy the environment template:
cp .env.example .env.local- Fill in your environment variables:
# NextAuth Configuration
NEXTAUTH_SECRET=your-secret-key-here
NEXTAUTH_URL=http://localhost:3000
# Database
MONGODB_URI=mongodb://localhost:27017/postlane-db
MONGODB_DB_NAME=postlane-db
# Google OAuth
GOOGLE_CLIENT_ID=your-google-client-id
GOOGLE_CLIENT_SECRET=your-google-client-secret
# Twitter OAuth
TWITTER_CLIENT_ID=your-twitter-client-id
TWITTER_CLIENT_SECRET=your-twitter-client-secret
# Email Configuration (Resend)
RESEND_API_KEY=your-resend-api-key
EMAIL_FROM=your-verified-email@domain.com
# Security (Cloudflare Turnstile)
NEXT_PUBLIC_TURNSTILE_SITE_KEYY=your-turnstile-site-key
TURNSTILE_SECRET_KEY=your-turnstile-secret-key# Install dependencies
npm install
# Run development server
npm run devOpen http://localhost:3000 to see the application.
# Development
npm run dev
# Build for production
npm run build
# Start production server
npm start
# Lint code
npm run lint
# Fix linting issues
npm run lint:fixPostLane uses shadcn/ui - a collection of beautifully designed, accessible, and customizable components built on top of Radix UI primitives and styled with Tailwind CSS.
- Accessible Components: Built with accessibility in mind using Radix UI primitives
- Customizable: Easy to modify and extend with Tailwind CSS
- Dark Mode: Built-in dark theme support with CSS variables
- Responsive: Mobile-first design approach
- Type Safe: Full TypeScript support (when implemented)
- Layout: Sidebar, Sheet, Card, Separator
- Forms: Input, Button, Label, Checkbox, Select
- Feedback: Alert, Badge, Skeleton, Tooltip
- Navigation: Dropdown Menu, Toggle, Toggle Group
- Data Display: Avatar
# Add new shadcn/ui components
npx shadcn-ui@latest add [component-name]
# Example: Add a dialog component
npx shadcn-ui@latest add dialog- Framework: Next.js 14 with App Router
- Authentication: NextAuth.js v4
- Database: MongoDB with connection pooling
- UI Components: shadcn/ui with Radix UI primitives
- Styling: Tailwind CSS with CSS variables
- OAuth: Twitter OAuth 1.0a, Google OAuth 2.0
- Email: Resend for magic links
- Security: Cloudflare Turnstile for bot protection
app/
├── api/ # API routes
│ ├── auth/ # NextAuth configuration
│ ├── tweet/ # Tweet posting
│ ├── twitter/ # Twitter OAuth flow
│ └── user/ # User management
├── auth/ # Authentication pages
├── chat/ # Main application
└── layout.js # Root layout
components/
├── ui/ # shadcn/ui components
├── auth/ # Authentication components
├── features/ # Feature-specific components
├── layout/ # Layout components
└── common/ # Shared components
lib/
├── auth.js # Authentication utilities
├── mongodb.js # Database connection
├── security.js # Security utilities
├── twitter-oauth.js # Twitter OAuth implementation
├── twitter-token-validator.js # Token validation
└── utils.js # Utility functions
- Rate Limiting: Built-in rate limiting for API endpoints
- Input Sanitization: XSS protection and input validation
- Security Headers: Comprehensive security headers
- Token Validation: Automatic Twitter token validation
- Session Management: Secure JWT sessions with MongoDB storage
- Bot Protection: Cloudflare Turnstile integration
- CSRF Protection: Built-in NextAuth.js CSRF protection
Ensure all required environment variables are set in production:
# Required for production
NEXTAUTH_SECRET=your-production-secret
NEXTAUTH_URL=https://yourdomain.com
MONGODB_URI=your-production-mongodb-uri
MONGODB_DB_NAME=postlane-db
GOOGLE_CLIENT_ID=your-google-client-id
GOOGLE_CLIENT_SECRET=your-google-client-secret
TWITTER_CLIENT_ID=your-twitter-client-id
TWITTER_CLIENT_SECRET=your-twitter-client-secret
RESEND_API_KEY=your-resend-api-key
EMAIL_FROM=your-verified-email@domain.com
TURNSTILE_SITE_KEY=your-turnstile-site-key
TURNSTILE_SECRET_KEY=your-turnstile-secret-key
NODE_ENV=production- Connect your GitHub repository to Vercel
- Set environment variables in Vercel dashboard
- Deploy automatically on push to main branch
- Railway: Supports MongoDB and Next.js
- Netlify: With serverless functions
- DigitalOcean: App Platform with managed MongoDB
- Use MongoDB Atlas for production database
- Ensure connection string includes SSL
- Set up proper indexes for performance
The application includes built-in analytics:
- User registration and sign-in tracking
- Twitter connection status monitoring
- Tweet posting success/failure rates
- Rate limiting and error tracking
-
Twitter OAuth Errors
- Verify Twitter app credentials
- Check callback URLs in Twitter Developer Portal
- Ensure OAuth 1.0a is enabled
-
Database Connection Issues
- Verify MongoDB URI format
- Check network connectivity
- Ensure database user permissions
-
Email Magic Links Not Working
- Verify Resend API key
- Check domain verification in Resend
- Ensure EMAIL_FROM is verified
-
Turnstile Verification Issues
- Verify TURNSTILE_SITE_KEY and TURNSTILE_SECRET_KEY
- Check domain configuration in Cloudflare Turnstile
- Ensure site key matches the domain