Question Forum - Q&A Platform 💬

A fullstack Q&A (Question & Answer) platform similar to Stack Overflow or Quora, built with React.js and Node.js/Express. Features user authentication, question posting, and community-driven answers.

📋 Overview

Question Forum is a modern Q&A platform that enables users to:

• Ask questions and get answers from the community
• Browse and search existing questions
• Authenticate securely with JWT tokens
• Participate in knowledge sharing

Perfect for learning fullstack development, REST APIs, and modern web application patterns.

✨ Features

Current Features ✅

• 🔐 JWT Authentication - Secure user login and registration
• 📋 Question Listing - Browse all questions with details
• 🔍 Question Details - View individual questions with answers
• 👤 User Profiles - User-specific question history

Planned Features 🚧

• ✏️ Post Questions - Create new questions
• 💬 Answer Questions - Provide answers to questions
• 🗄️ Database Integration - Persistent data storage
• 🗑️ Delete Questions - Remove questions
• ✏️ Update Questions - Edit existing questions
• 👤 Enhanced Profiles - Comprehensive user profiles

🛠️ Technology Stack

Frontend

• React.js - UI library
• Bootstrap - CSS framework
• JavaScript (ES6+) - Modern JavaScript features

Backend

• Node.js - Runtime environment
• Express.js - Web framework
• JWT - Authentication tokens
• REST API - API architecture

🚀 Getting Started

Prerequisites

• Node.js 12+ and npm
• Git

Installation

1. Clone the repository:

git clone https://github.com/bhanuchaddha/Question-Forum.git
cd Question-Forum

2. Install backend dependencies:

cd backend
npm install

3. Install frontend dependencies:

cd ../frontend
npm install

Running the Application

1. Start the backend server:

cd backend
npm start

Backend runs on http://localhost:3001 (or configured port)

2. Start the frontend development server:

cd frontend
npm start

Frontend runs on http://localhost:3000

📡 API Endpoints

Authentication

POST /api/auth/register
POST /api/auth/login
POST /api/auth/logout

Questions

GET    /api/questions          # Get all questions
GET    /api/questions/:id      # Get question details
POST   /api/questions          # Create question (planned)
PUT    /api/questions/:id      # Update question (planned)
DELETE /api/questions/:id      # Delete question (planned)

Answers

GET    /api/questions/:id/answers  # Get answers for question
POST   /api/questions/:id/answers # Post answer (planned)

🏗️ Project Structure

Question-Forum/
├── backend/                 # Node.js/Express backend
│   ├── src/
│   │   ├── authentication.js
│   │   ├── config.js
│   │   └── index.js
│   └── package.json
├── frontend/                # React.js frontend
│   ├── src/
│   │   ├── components/      # React components
│   │   │   ├── NavBar/
│   │   │   ├── Question/
│   │   │   └── Questions/
│   │   ├── pages/           # Page components
│   │   └── services/        # API services
│   └── package.json
└── README.md

🔐 Authentication Flow

1. User registers/logs in
2. Backend generates JWT token
3. Token stored in localStorage
4. Token included in API requests
5. Backend validates token for protected routes

🎨 UI Components

• NavBar - Navigation with login/logout
• Questions List - Display all questions
• Question Detail - Individual question view
• Login Form - Authentication interface
• Answer Form - Post answers (planned)

🔧 Configuration

Backend Configuration

// config.js
module.exports = {
  port: process.env.PORT || 3001,
  jwtSecret: process.env.JWT_SECRET || 'your-secret-key',
  // Add database configuration
};

Frontend Configuration

Update API base URL in service files:

const API_BASE_URL = 'http://localhost:3001/api';

🧪 Testing

# Backend tests
cd backend
npm test

# Frontend tests
cd frontend
npm test

📚 Learning Objectives

This project demonstrates:

• Fullstack JavaScript development
• RESTful API design
• JWT authentication
• React component architecture
• State management patterns
• API integration

🛣️ Development Roadmap

• Implement question posting
• Add answer functionality
• Integrate database (MongoDB/PostgreSQL)
• Add search functionality
• Implement voting system
• Add tags/categories
• User reputation system
• Rich text editor for questions/answers

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

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

📄 License

This project is open source and available for educational purposes.

🔗 Resources

• React Documentation
• Express.js Documentation
• JWT Authentication
• Bootstrap Documentation

🌟 Use Cases

• Learning Fullstack Development - Perfect tutorial project
• Community Q&A Platform - Building knowledge sharing sites
• Portfolio Project - Showcase fullstack skills
• API Development - REST API best practices
• Authentication Patterns - JWT implementation

---

Built with React & Node.js ❤️