P2NS Website

Modern, professional public-facing website for P2NS (Peer-to-Peer Decentralized DNS System).

Features

• Modern Design: Built with Next.js 14+, TypeScript, and Tailwind CSS
• Responsive: Mobile-first design that works on all devices
• Dark Mode: Automatic dark mode support
• Interactive Diagrams: Animated visualizations of P2P concepts
• Comprehensive Documentation: Complete guides and API references
• SEO Optimized: Proper metadata, structured data, and semantic HTML
• Accessible: WCAG AA compliant with proper ARIA labels

Getting Started

Prerequisites

• Node.js 18 or higher
• npm or yarn

Installation

# Install dependencies
npm install

# Run development server
npm run dev

# Build for production
npm run build

# Start production server
npm start

The website will be available at http://localhost:3000.

Project Structure

p2ns-website/
├── app/                    # Next.js App Router pages
│   ├── about/             # About P2NS page
│   ├── learn/             # P2P education pages
│   ├── features/          # Features page
│   ├── docs/              # Documentation pages
│   └── community/         # Community page
├── components/            # React components
│   ├── layout/           # Layout components (Navigation, Footer)
│   ├── sections/         # Page sections (Hero, Features, etc.)
│   ├── diagrams/         # Interactive diagrams
│   └── ui/               # Reusable UI components
├── public/                # Static assets
└── styles/                # Global styles

Deployment

Self-Hosted

The website is designed to be self-hostable. You can deploy it using:

• Docker: See Dockerfile and docker-compose.yml
• Node.js: Run npm run build && npm start
• Static Export: Configure Next.js for static export if needed

Environment Variables

No environment variables are required for basic operation. All configuration is handled through Next.js.

Technologies Used

• Next.js 14+: React framework with App Router
• TypeScript: Type-safe development
• Tailwind CSS: Utility-first CSS framework
• Framer Motion: Animation library
• Lucide React: Icon library
• Shiki: Syntax highlighting

Contributing

Contributions are welcome! Please follow the same contribution guidelines as the main P2NS repository.