Volvox

A modern web platform for software development, mentorship, and community learning.

---

Volvox is a software development and learning community built with modern web technologies.

Showcase open-source projects, publish technical blog content, and facilitate mentorship programs.

---

Tip

New here? Start with the Quick Start guide to get up and running in minutes.

Overview

Volvox combines powerful features with a beautiful, accessible interface:

• Blog System — MDX-powered content with syntax highlighting, table of contents, and reading progress
• Product Showcase — Dynamic product pages with changelogs, screenshots, and FAQ sections
• Mentorship Platform — Connect mentors and mentees for growth opportunities
• Theme System — Light/dark/system modes with persistent selection
• Single-Page Experience — Smooth scrolling navigation with section tracking
• SEO Optimized — Dynamic sitemaps, Open Graph images, and structured data

---

Quick Start

Prerequisites

• Node.js 20 or higher

Installation

# Clone the repository
git clone https://github.com/yourusername/volvox.git
cd volvox

# Install dependencies
pnpm install

# Start development server
pnpm dev

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

---

Tech Stack

Category	Technology
Framework	Next.js 16 (App Router)
UI Library	React 19
Language	TypeScript (strict mode)
Styling	Tailwind CSS v4 with Lightning CSS
Components	Radix UI primitives
Animations	Framer Motion
Content	MDX via next-mdx-remote, rehype-highlight
Icons	@phosphor-icons/react, Lucide
Monitoring	Sentry (error tracking + replay)
Analytics	Vercel Analytics & Speed Insights

| Package Manager | pnpm v10+ |

---

Commands

Command	Description
pnpm dev	Start development server on localhost:3000
pnpm build	Create production build
pnpm start	Start production server
pnpm typecheck	Run TypeScript type checking
pnpm lint	Run ESLint
pnpm test	Run unit tests (stub)
pnpm format	Format code with Prettier

Note: Pre-commit hooks automatically run: lint-staged → typecheck → build

---

Adding Content

Blog Post

Create a new .mdx file in content/blog/:

---
title: "Your Post Title"
slug: "your-post-slug"
excerpt: "Brief description of the post"
authorId: "author-id-from-authors-json"
date: "2024-01-15"
tags: ["tag1", "tag2"]
published: true
banner: /images/your-banner.png
---
Your MDX content goes here...

Product

Create a new directory in content/products/[slug]/:

content/products/
└── your-product/
    ├── index.json      # Product metadata
    ├── changelog.mdx   # Optional changelog
    └── screenshots/    # Optional screenshots directory
        └── hero.png

index.json format:

{
  "id": "unique-uuid",
  "name": "Product Name",
  "slug": "product-slug",
  "tagline": "Short one-liner",
  "description": "Brief description",
  "longDescription": "Detailed product description",
  "features": ["Feature 1", "Feature 2"],
  "techStack": ["Tech 1", "Tech 2"],
  "links": {
    "github": "https://github.com/user/repo",
    "demo": "https://demo-url.com"
  },
  "screenshots": ["hero.png"],
  "faq": [
    {
      "question": "Common question?",
      "answer": "Answer to the question."
    }
  ]
}

Authors & Mentors

Edit the respective JSON files in content/:

• authors.json — Author profiles
• mentors.json — Mentor profiles
• mentees.json — Mentee profiles

---

License

This project is private and not licensed for reuse.

---

Built with ❤️ for the developer community