🚀 ErrorX Forum

A modern, full-featured forum application built with Next.js 15

Featuring user authentication, post management, file uploads, and real-time interactions

🌐 Live Website • 📖 Documentation • 🐛 Report Bug • ✨ Request Feature

---

✨ Features

🔐 Authentication & User Management

Secure authentication with multiple providers and comprehensive user profiles

Feature	Description
🔑 NextAuth.js Integration	Secure authentication with multiple providers
🌐 Google OAuth	Social login support
👤 User Profiles	Customizable user profiles with avatars
🔒 Password Management	Forgot password and reset functionality
🎯 Username Generation	Automatic username generation from names/emails

📝 Content Management

Rich content creation and management system

Feature	Description
✍️ Post Creation	Rich text posts with categories
📂 Category System	Organized discussion categories
💬 Comment System	Nested comments with replies
🔍 Search Functionality	Full-text search across posts
📄 Pagination	Efficient content loading

🎨 Modern UI/UX

Built with shadcn/ui and Radix UI for exceptional user experience

Feature	Description
📱 Responsive Design	Mobile-first responsive layout
🌙 Dark/Light Mode	Theme switching with system preference detection
🎭 shadcn/ui Components	Beautiful, accessible UI components
♿ Accessibility	WCAG compliant components
⚡ Loading States	Smooth loading animations

📁 File Management

Scalable file storage and management

Feature	Description
☁️ Cloudflare R2 Storage	Scalable file storage
📤 File Upload	Drag & drop file uploads
🖼️ Image Optimization	Automatic image optimization
🌐 CDN Integration	Custom domain support for assets

🔒 Security & Validation

Enterprise-level security and validation

Feature	Description
✅ Zod Validation	Comprehensive input validation
🛡️ API Security	CORS protection and origin validation
🔐 Environment Validation	Secure environment variable handling
🎯 Type Safety	Full TypeScript support

📊 SEO & Performance

Optimized for search engines and performance

Feature	Description
🔍 SEO Optimization	Meta tags, structured data, sitemaps
⚡ Performance	Optimized images and code splitting
📈 Analytics Ready	Google Analytics integration ready
📱 Social Sharing	Open Graph and Twitter Card support

---

🛠️ Tech Stack

Frontend

Backend

Services

---

🚀 Quick Start

Prerequisites

• Node.js 18+
• PostgreSQL database
• Cloudflare R2 account (for file storage)
• SMTP email service (Gmail, SendGrid, etc.)

1️⃣ Clone & Install

# Clone the repository
git clone https://github.com/FakeErrorX/errorx-forum.git
cd errorx-forum

# Install dependencies
npm install
# or
yarn install
# or
pnpm install

2️⃣ Environment Setup

Create a .env file in the root directory:

# Database
DATABASE_URL="postgresql://username:password@localhost:5432/errorx_forum"

# NextAuth.js
NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET="your-secret-key-here"

# Google OAuth (optional)
GOOGLE_CLIENT_ID="your-google-client-id"
GOOGLE_CLIENT_SECRET="your-google-client-secret"

# Site Configuration
SITE_URL="http://localhost:3000"
SITE_NAME="ErrorX Forum"
SITE_DESCRIPTION="A modern forum for developers and tech enthusiasts"

# Social Media URLs
TWITTER_HANDLE="@FakeErrorX"
TWITTER_SITE="@FakeErrorX"
TWITTER_URL="https://twitter.com/FakeErrorX"
GITHUB_URL="https://github.com/FakeErrorX"
TELEGRAM_URL="https://t.me/ErrorX_BD"
FACEBOOK_URL="https://facebook.com/ErrorX.GG"

# Cloudflare R2 Storage
S3_REGION="auto"
S3_ENDPOINT="https://your-account-id.r2.cloudflarestorage.com"
S3_ACCESS_KEY="your-access-key"
S3_SECRET_KEY="your-secret-key"
S3_BUCKET_NAME="your-bucket-name"
S3_BUCKET_URL="https://your-custom-domain.com"

# API Security
ALLOWED_ORIGINS="http://localhost:3000,https://yourdomain.com"

# Development Configuration
LOCALHOST_PORT="3000"

# Email Configuration (SMTP)
SMTP_HOST="smtp.gmail.com"
SMTP_PORT="587"
SMTP_SECURE="false"
SMTP_USER="your-email@gmail.com"
SMTP_PASS="your-app-password"
SMTP_FROM="ErrorX Community <noreply@yourdomain.com>"

3️⃣ Database Setup

# Generate Prisma client
npx prisma generate

# Run database migrations
npx prisma db push

# (Optional) Seed the database
npx prisma db seed

4️⃣ Start Development

npm run dev
# or
yarn dev
# or
pnpm dev

🎉 Open http://localhost:3000 to view the application!

---

📁 Project Structure

errorx-forum/
├── 📁 app/                    # Next.js App Router
│   ├── 📁 api/               # API routes
│   │   ├── 📁 auth/          # Authentication endpoints
│   │   ├── 📁 posts/         # Post management
│   │   ├── 📁 users/         # User management
│   │   └── 📁 files/         # File upload endpoints
│   ├── 📁 create-post/       # Post creation page
│   ├── 📁 profile/           # User profile pages
│   ├── 📁 settings/          # User settings
│   └── 📁 signin/            # Authentication pages
├── 📁 components/            # React components
│   ├── 📁 ui/               # shadcn/ui components
│   ├── 📁 layout/           # Layout components
│   └── 📁 seo/              # SEO components
├── 📁 lib/                  # Utility libraries
│   ├── 📄 auth.ts           # Authentication configuration
│   ├── 📄 prisma.ts         # Database client
│   ├── 📄 validations.ts    # Zod validation schemas
│   └── 📄 s3.ts             # File storage utilities
├── 📁 hooks/                # Custom React hooks
├── 📁 prisma/               # Database schema
├── 📁 docs/                 # Documentation
│   ├── 📄 README.md         # Main documentation
│   ├── 📄 API.md            # API reference
│   └── 📄 DEPLOYMENT.md     # Deployment guide
├── 📁 .github/              # GitHub templates
│   ├── 📁 ISSUE_TEMPLATE/   # Issue templates
│   └── 📁 DISCUSSION_TEMPLATE/ # Discussion templates
└── 📁 public/               # Static assets

---

🔧 Available Scripts

Command	Description
npm run dev	🚀 Start development server
npm run build	🏗️ Build for production
npm run start	🎯 Start production server
npm run lint	🔍 Run ESLint
npx prisma studio	🗄️ Open Prisma Studio
npx prisma db push	📤 Push schema changes
npx prisma generate	⚙️ Generate Prisma client

---

🔒 Security Features

🛡️ Security Feature	📝 Description
Input Validation	All inputs validated with Zod
CORS Protection	API endpoints protected from external access
Environment Validation	Required environment variables validated
Password Security	Strong password requirements
SQL Injection Protection	Prisma ORM prevents SQL injection
XSS Protection	Input sanitization and validation

---

📊 Performance Features

⚡ Performance Feature	📝 Description
Image Optimization	Next.js automatic image optimization
Code Splitting	Automatic code splitting for better performance
Static Generation	Pre-rendered pages where possible
CDN Integration	Cloudflare R2 for fast asset delivery
Caching	Optimized caching strategies

---

🤝 Contributing

We welcome contributions! Please see our Contributing Guidelines for details.

Quick Start for Contributors

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

📚 Documentation

• Main Documentation - Complete project documentation
• API Reference - Detailed API documentation
• Deployment Guide - Production deployment instructions

🐛 Report Issues

• Bug Report - Report bugs and issues
• Feature Request - Suggest new features
• Question - Ask questions

💬 Discussions

• General Discussion - General project discussions
• Ideas & Brainstorming - Share ideas and brainstorm
• Q&A - Ask questions and get answers

---

📝 License

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

---

🙏 Acknowledgments

🛠️ Tool	📝 Description
Next.js	The React framework
Prisma	Database toolkit
shadcn/ui	Beautiful UI components
Radix UI	Accessible UI primitives
Tailwind CSS	Utility-first CSS
NextAuth.js	Authentication for Next.js
Zod	TypeScript-first schema validation

---

📞 Support

Need help? We're here for you!

🐛 Report Bug • ✨ Request Feature • 💬 Discussions

---

Built with ❤️ by ErrorX