Ask, Answer, Elevate Your Code - A modern Q&A platform for developers
- 🔍 Q&A Hub - Ask programming questions and get expert answers
- 💬 Threaded Comments - Multi-level comment system with GIF support
- ⭐ Voting System - Upvote/downvote posts and comments
- 🏆 Reputation & Badges - Earn points for valuable contributions
- 🔔 Real-time Notifications - Get notified when someone responds
- 🔐 Secure Authentication - OTP-based login with email verification
- 👮♂️ Content Moderation - Advanced reporting and moderation system
- 🎨 Beautiful UI - Modern design with smooth animations
- 📱 PWA Support - Installable as a mobile app
- 🌙 Dark/Light Mode - Customizable theme preferences
- Framework: Next.js 14 with App Router
- Language: TypeScript
- Styling: Tailwind CSS with custom animations
- UI Components: Radix UI primitives
- Animations: Framer Motion
- Icons: Lucide React, Tabler Icons
- Database: PostgreSQL
- ORM: Drizzle ORM
- Authentication: Custom token-based auth with OTP
- Email: Resend API
- Rate Limiting: Built-in rate limiting
- Security: Cloudflare Turnstile CAPTCHA
- Rich Text Editor: MDX Editor with markdown support
- GIF Support: Giphy API integration
- PWA: Next.js PWA with offline support
- Analytics: Performance monitoring
- Node.js 18+
- PostgreSQL database
- pnpm (recommended) or npm
-
Clone the repository
git clone https://github.com/shravanasati/stackit.git cd stackit -
Install dependencies
pnpm install
-
Set up environment variables Create a
.env.localfile in the root directory:# Database Configuration DB_HOST=localhost DB_PORT=5432 DB_USER=your_username DB_PASSWORD=your_password DB_NAME=stackit DB_SSL=false DATABASE_URL=postgresql://your_username:your_password@localhost:5432/stackit # Authentication SECRET_KEY=your_secret_key_here SALT=your_salt_here # Email (Resend) RESEND_API_KEY=your_resend_api_key # Captcha (Cloudflare Turnstile) TURNSTILE_SECRET_KEY=your_turnstile_secret # Moderation MODERATOR_EMAILS=[email protected],[email protected] # Discord Webhook (Optional) DISCORD_WEBHOOK_URL=your_discord_webhook_url # Environment NODE_ENV=development
-
Set up the database
# Generate database schema pnpm run db:generate # Apply migrations pnpm run db:push
-
Start the development server
pnpm dev
-
Open your browser Navigate to http://localhost:3000
stackit/
├── app/ # Next.js App Router pages
│ ├── api/ # API routes
│ ├── admin/ # Admin dashboard
│ ├── create/ # Post creation
│ ├── feed/ # Main feed
│ ├── login/ # Authentication
│ └── post/ # Individual post pages
├── components/ # React components
│ ├── LandingPage/ # Landing page sections
│ ├── Posts/ # Post-related components
│ ├── ui/ # Reusable UI components
│ └── Gradients/ # Background components
├── lib/ # Core business logic
│ ├── actions/ # Server actions
│ ├── database/ # Database operations
│ └── utils/ # Utility functions
├── hooks/ # Custom React hooks
├── migrations/ # Database migrations
└── public/ # Static assets
StackIt uses PostgreSQL with the following main tables:
posts- Questions/posts with voting and moderationcomments- Threaded comments with GIF supporttokens- User authentication tokensnotifications- User notifications systemreports- Content moderation reportsotp- One-time passwords for authenticationsecurity_logs- Admin activity logging
# Development
pnpm dev # Start development server
pnpm build # Build for production
pnpm start # Start production server
pnpm lint # Run ESLint
# Database
pnpm db:generate # Generate database migrations
pnpm db:migrate # Apply migrations
pnpm db:push # Push schema changes
pnpm db:studio # Open Drizzle StudioBuild and run with Docker:
# Build the Docker image
docker build -t stackit .
# Run the container
docker run -p 3000:3000 --env-file .env.local stackit- OTP-based login with email verification
- Role-based access (user, admin)
- Secure token management with automatic expiration
- Rate limiting to prevent abuse
- Rich text editor with markdown support
- Tag system for categorizing posts
- Multi-level comments with threaded replies
- GIF integration via Giphy API
- Vote system for quality control
- Content reporting system
- Admin dashboard for moderation
- Automated content filtering
- Security logging for audit trails
- Progressive Web App (PWA) support
- Infinite scrolling for posts
- Real-time notifications
- Responsive design for all devices
- Smooth animations with Framer Motion
- CAPTCHA protection with Cloudflare Turnstile
- Rate limiting on all sensitive endpoints
- Content sanitization to prevent XSS
- SQL injection protection via Drizzle ORM
- Secure authentication with encrypted tokens
- Connect your repository to Vercel
- Set environment variables in Vercel dashboard
- Deploy - Vercel will automatically build and deploy
-
Build the project
pnpm build
-
Start the production server
pnpm start
We welcome contributions! Please see our Contributing Guidelines for details.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- Next.js team for the amazing framework
- Drizzle Team for the excellent ORM
- Radix UI for accessible component primitives
- Vercel for hosting and deployment platform
- Issues: GitHub Issues
- Discussions: GitHub Discussions
- Email: [email protected]
Built with ❤️ by the StackIt team