🧵 ThreadPoster Pro

A modern, AI-powered Twitter thread management application built with Next.js, TypeScript, and Tailwind CSS.

✨ Features

🎯 Core Functionality

• Thread Editor: Create and edit Twitter threads with real-time validation
• Character Counter: Track character count for each tweet with visual indicators
• Thread Preview: See how your thread will look before posting
• Draft Saving: Save your work locally and come back later

🤖 AI-Powered Features

• AI Thread Generator: Generate engaging threads using AI based on your topic
• Multiple Templates: Educational, Story, Tips, News Analysis, and Personal Experience templates
• Custom Prompts: Customize AI generation with your own prompts

📊 Analytics & Insights

• Performance Dashboard: Track impressions, engagement, likes, and retweets
• Thread Analytics: Analyze which threads perform best
• Key Insights: Get actionable recommendations for better engagement

⏰ Scheduling & Management

• Thread Scheduling: Schedule threads for optimal posting times
• Progress Tracking: Real-time progress updates during posting
• Notification Center: Stay informed with toast notifications

📱 Modern UI/UX

• Responsive Design: Mobile-first design that works on all devices
• Dark Mode Support: Toggle between light and dark themes
• Modern Components: Built with shadcn/ui components
• Smooth Animations: Framer Motion animations for better UX

🚀 Getting Started

Prerequisites

• Node.js 18+
• npm or yarn
• Twitter Developer Account
• OpenAI API Key (optional, for AI features)

Installation

1. Clone the repository

   git clone <repository-url>
   cd threadpostingproject

2. Install dependencies

   npm install

3. Set up environment variables

   cp .env.example .env.local

   Edit .env.local with your API credentials:

   TWITTER_API_KEY=your_twitter_api_key_here
   TWITTER_API_SECRET=your_twitter_api_secret_here
   TWITTER_ACCESS_TOKEN=your_twitter_access_token_here
   TWITTER_ACCESS_TOKEN_SECRET=your_twitter_access_token_secret_here
   OPENAI_API_KEY=your_openai_api_key_here

4. Run the development server

   npm run dev

5. Open your browser Navigate to http://localhost:3000

🛠️ Tech Stack

Frontend

• Next.js 14 - React framework with App Router
• TypeScript - Type-safe development
• Tailwind CSS - Utility-first CSS framework
• shadcn/ui - Modern UI components
• Framer Motion - Smooth animations
• React Hook Form - Form handling
• Zustand - State management
• React Hot Toast - Notifications

Backend

• Next.js API Routes - Serverless API endpoints
• Twitter API v2 - Tweet posting and analytics
• OpenAI API - AI-powered content generation

Development Tools

• ESLint - Code linting
• Prettier - Code formatting
• TypeScript - Static type checking

📱 Mobile Support

The application is fully responsive and optimized for mobile devices:

• Mobile-first design approach
• Touch-friendly interface
• Collapsible navigation for mobile
• Optimized layouts for different screen sizes

🔧 Configuration

Twitter API Setup

1. Create a Twitter Developer Account
2. Create a new app in the Twitter Developer Portal
3. Generate API keys and access tokens
4. Enable OAuth 1.0a User Context for posting capabilities
5. Add your credentials to .env.local

OpenAI API Setup (Optional)

1. Get an API key from OpenAI
2. Add it to your .env.local file
3. AI features will be enabled automatically

🎨 Customization

Themes

The app supports both light and dark themes. Users can toggle between them using the theme switcher.

UI Components

All components are built with shadcn/ui and can be easily customized by modifying the component files in components/ui/.

Styling

The app uses Tailwind CSS for styling. You can customize the design system by modifying tailwind.config.ts.

📊 Analytics

The analytics dashboard provides insights into:

• Total impressions across all threads
• Average engagement rates
• Best performing threads
• Optimal posting times
• Tweet count recommendations

🔒 Security

• Environment variables for sensitive data
• Input validation and sanitization
• Rate limiting for API calls
• Secure token storage

🚀 Deployment

Vercel (Recommended)

1. Push your code to GitHub
2. Connect your repository to Vercel
3. Add environment variables in Vercel dashboard
4. Deploy automatically

Other Platforms

The app can be deployed to any platform that supports Next.js:

• Netlify
• AWS Amplify
• Railway
• Heroku

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🆘 Support

If you encounter any issues or have questions:

1. Check the Issues page
2. Create a new issue with detailed information
3. Join our community discussions

🔮 Roadmap

• Multi-account Twitter support
• Advanced scheduling with time zones
• Thread templates marketplace
• Team collaboration features
• Advanced analytics with charts
• Browser extension
• Mobile app (React Native)

---

Built with ❤️ by the ThreadPoster team