Nairobi DevOps Community

A modern, responsive web application for the Nairobi DevOps Community. Built with React, TypeScript, Vite, and Tailwind CSS.

---

Table of Contents

• Nairobi DevOps Community
  • Table of Contents
  • About
  • Features
  • Tech Stack
  • Project Structure
  • Data Folder
  • Getting Started
    • Prerequisites
    • Installation
  • Scripts
  • Contributing
  • License

---

About

This platform empowers developers, automation experts, and tech enthusiasts to learn, network, and advance DevOps practices in Kenya's vibrant technology ecosystem. It features event management, community resources, and collaborative tools.

---

Features

• Modern, responsive UI with dark mode
• Event and gallery management (static/demo only)
• Community and partner sections
• Modular, scalable codebase

---

Tech Stack

• React (with hooks)
• TypeScript
• Vite
• Tailwind CSS
• Radix UI, Lucide Icons, Framer Motion, Wouter, React Query

---

Project Structure

NairobiDevOps-1/
  client/         # React frontend (src/, components/, pages/, contexts/, hooks/, etc.)
  client/src/data/ # Static data files (testimonials, gallery images, partners, etc.)
  components.json # UI config
  tailwind.config.ts # Tailwind CSS config
  tsconfig.json   # TypeScript config
  vite.config.ts  # Vite config
  package.json    # Project dependencies and scripts

---

Data Folder

The client/src/data/ directory contains static data used throughout the application. This includes:

• testimonialsData.ts: Member testimonials displayed on the site
• galleryData.ts: Image URLs and metadata for the gallery section
• partnersData.ts: Information about community partners and sponsors
• whatWeDoData.ts: Details about the community's activities and offerings

---

Getting Started

Prerequisites

• Node.js (v20+ recommended)
• npm or yarn

Installation

1. Clone the repository:

   git clone <repo-url>
   cd ndc-redesign-website

2. Install dependencies: Use npm ci for a consistent installation that matches our CI environment.

   npm ci

3. Start the development server:

   npm run dev

   • The app will be available at http://localhost:5173.

---

Scripts

• npm run dev — Start the app in development mode.
• npm run build — Build the client for production.
• npm run test — Run tests using Vitest.
• npm run lint — Check for code quality issues with ESLint.
• npm run format — Format all files with Prettier.
• npm run preview — Preview the production build locally.

---

Code Style

This project uses Prettier for code formatting and ESLint for code quality rules. Both are enforced by our CI pipeline. Mandatory Check: Please run npm run format, npm run lint, and npm run build before pushing your changes to ensure code integrity and build success.

---

Documentation

The docs/ directory contains detailed documentation about the project's architecture and security workflows:

• SECURITY-HEADERS.md: Explains the "Single Source of Truth" architecture for HTTP security headers.
• CONTRIBUTING.md: Our main contribution guide.

---

Contributing

We welcome contributions from the community! Whether you're fixing a bug, adding a new feature, or improving documentation, your help is valuable.

To ensure a smooth collaboration, please read our Contribution Guide before you start. It contains detailed information on our development workflow, coding standards, and pull request process.

Quick Links

• Branching Strategy
• Commit Message Convention
• Submitting a Pull Request

---

License

This project is licensed under the MIT License.