Skip to content

Repository files navigation

CodeFlow

The Intelligent Knowledge-Sharing Platform for Developers

Next.jsTypeScriptDockerPrismaTailwindClerk

View DemoReport BugRequest Feature


🚀 Overview

CodeFlow is a community-driven Q&A platform designed for developers to share knowledge, solve problems, and build reputation.

Unlike standard forums, CodeFlow leverages an intelligent recommendation engine. By tracking user interactions and tag engagement, the system learns your tech stack (e.g., React, Docker, Rust) to curate a personalized feed. Whether you're debugging a complex distributed system or centering a div, CodeFlow surfaces the most relevant solutions for you.

🏗 System Architecture

CodeFlow is built on a modern, server-first architecture using Next.js 15 Server Actions for robust data mutations and Clerk for secure identity management.

graph TD
User((User)) -->|Auth| Clerk
User -->|HTTP/HTTPS| Next[Next.js 15 App]
Next -->|Server Actions| Prisma[Prisma ORM]
Prisma -->|SQL Query| DB[(NeonDB Postgres)]
Clerk -->|Webhook Sync| Next
Next -->|Validation| Zod
Loading

✨ Key Features

🧠 Intelligent Recommendations

A custom-built engine analyzes your reading history and interaction patterns to suggest questions that match your expertise.

⚡ Global & Local Search

  • Global Search: Query the entire database for questions, users, or tags.
  • Local Filters: Sort results dynamically by Newest, Most Frequent, Unanswered, or Recommended.

💬 Community Interaction

  • Markdown Editor: Rich text support with syntax highlighting for code blocks.
  • Voting System: Reputation-based upvote/downvote mechanism.
  • Views & Stats: Real-time engagement metrics for every question.

👤 Developer Profile & Reputation

  • Portfolio Showcase: Display your bio, location, and links.
  • Gamification: Earn badges (Bronze, Silver, Gold) and reputation points based on community validation of your answers.

🛠 Tech Stack

CategoryTechnologyDescription
FrontendNext.js 15 (App Router)Server Components & Client Components
StylingTailwind CSS & Shadcn UIResponsive, accessible UI components
BackendServer ActionsServer-side mutations without API routes
DatabasePostgreSQL (NeonDB)Serverless SQL database
DevOpsDockerMulti-stage build containerization
ORMPrismaType-safe database access
AuthClerkAuthentication & User Management

Screenshots

Home Feed

Home Feed

💻 Getting Started

You can run CodeFlow locally using standard Node.js or via Docker.

Prerequisites

  • Node.js v18+
  • Docker (Optional)
  • PostgreSQL database URL
  • Clerk account keys

Environment Setup

Create a .env file in the root directory:

# Clerk AuthNEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_...CLERK_SECRET_KEY=sk_test_...NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-inNEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up# DatabaseDATABASE_URL="postgresql://..."# TinyMCE (Optional)NEXT_PUBLIC_TINY_EDITOR_API_KEY=...

Option 1: Standard Setup (Node.js)

  1. Install dependencies
npm install
  1. Initialize Database
npx prisma db push
npx prisma db seed
  1. Run the server
npm run dev

Option 2: Docker Setup 🐳

CodeFlow includes a multi-stage Dockerfile optimized for production performance.

  1. Build the image
docker build -t codeflow .
  1. Run the container
docker run -p 3000:3000 --env-file .env codeflow

Open http://localhost:3000 to view the app.


🤝 Contributing

Contributions are welcomed! Please follow these steps:

  1. Fork the repository.
  2. Create a new branch: git checkout -b feature/your-feature-name.
  3. Make your changes and commit them: git commit -m 'Add some feature'.
  4. Push to the branch: git push origin feature/your-feature-name.
  5. Submit a pull request.

Built with ❤️ by KingsCreatives

About

The Intelligent Knowledge-Sharing Platform for Developers

Resources

Stars

1 star

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages