Project Demo - Live Link

⚙️ Tech Stack

• Zod
• Next.js
• NextAuth
• Open AI
• MongoDB
• ShadCN UI
• TypeScript
• TailwindCSS
• React Hook Form

🔋 Features

👉 Authentication: Secure sign-in with NextAuth, supporting Email/Password, Google, and GitHub.

👉 Home Page: Displays questions with filters, search, and pagination for easy navigation.

👉 Recommendations: Personalized suggestions on the home page.

👉 Complex Layout: Organized layout with popular questions and tags in view.

👉 Question Details: View questions with rich content, including images and code blocks.

👉 Voting: Upvote/downvote on questions to highlight helpful content.

👉 View Counter: Tracks the number of views for each question.

👉 Bookmarking: Save questions for quick access later.

👉 Answer Posting: MDX editor with light/dark modes for submitting answers.

👉 AI Answer Generation: Get AI-generated responses to questions.

👉 Answer Filtering: Sort answers by newest or most-voted, with pagination.

👉 Answer Voting: Upvote/downvote answers to rank quality responses.

👉 Collections: Organized saved questions with filters, search, and pagination.

👉 Community: Browse all users with search, filters, and pagination.

👉 Profile: View user info, badges, and engagement history with pagination.

👉 Job Finder: Discover jobs with filters and search, tailored to the user’s location.

👉 Tags Page: List of all tags with question counts, filters, and pagination.

👉 Tag Details: View questions by tag with search and pagination.

👉 Ask a Question: Simple interface for posting new questions.

👉 Edit & Delete: Update or remove questions and answers with validation and authorization.

👉 Global Search: Find content across questions, users, tags, and more.

👉 Responsive Design: Fully optimized for a seamless experience on desktops, tablets, and mobile devices.

👉 High Performance: Fast loading and smooth interactions for an efficient user experience.

and many more, including code architecture and reusability

🤸 Quick Start

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have the following installed on your machine:

• Git
• Node.js
• npm (Node Package Manager)

Cloning the Repository

git clone https://github.com/JavaScript-Mastery-Pro/devflow-v2-record.git
cd devflow-v2-record

Installation

Install the project dependencies using npm:

npm install

Set Up Environment Variables

Create a new file named .env in the root of your project and add the following content:

# Mongodb
MONGODB_URI=

# OpenAI
OPENAI_API_KEY=

# Rapid API
NEXT_PUBLIC_RAPID_API_KEY=

# Auth
AUTH_GOOGLE_ID=
AUTH_GOOGLE_SECRET=
AUTH_GITHUB_ID=
AUTH_GITHUB_SECRET=
AUTH_SECRET=
NEXTAUTH_URL=

# Tiny Editor
NEXT_PUBLIC_TINY_EDITOR_API_KEY=

NEXT_PUBLIC_SERVER_URL=

NODE_ENV=

Replace the placeholder values with your actual credentials. You can obtain these credentials by signing up on the respective websites

Running the Project

npm run dev

Open http://localhost:3000 in your browser to view the project.