Comma Project Documentation

Project Overview

Comma is a modern web application built with a Django backend and Vue.js frontend. This comprehensive documentation provides detailed information about all aspects of the project, including APIs, component libraries, infrastructure, and development guides for developers, contributors, and users.

The application is deployed across two environments:

Prod: comma.cm
Dev: beta.comma.cm

This documentation site aims to provide a unified interface for all documentation needs, bringing together multiple sources into a single, password-protected site accessible at docs.comma.cm.

Tech Stack

Backend

Django 4+: Python web framework
Django REST Framework: API development
PostgreSQL: Primary database
AWS S3: File storage integration

Frontend

Vue 3: JavaScript framework for UI development
PrimeVue 4.3.3: UI component library
Tailwind CSS 3.4.17: Utility-first CSS framework
Vite: Build tool and development server

Documentation Tools

VuePress: Documentation framework based on Vue.js
Integration with PrimeVue and Tailwind CSS to maintain visual consistency with the application

Documentation Structure

API Documentation

REST API - Documentation for the Comma REST API with Swagger UI integration
GraphQL API - Documentation and playground for the Comma GraphQL API

Component Library

PrimeVue.js components used throughout the project
Storybook integration for interactive component documentation

Infrastructure

AWS Resources and Configuration
Terraform Documentation

AI Integration

Prompts - Guidelines and templates for effective AI prompt engineering
Architecture - Technical design of our AI systems and integration points
Labs - Experimental AI features and prototypes under development

Guides

Dev Guides - Setting up your dev environment and workflow
Deployment Guides - Deploying to prod and dev environments
Operations Guides - Monitoring, maintenance, and troubleshooting
Future Work - Planned enhancements and features

Each area is designed to be self-contained but cross-referenced where appropriate. We follow a component-based documentation approach that aligns with our architecture.

Version Tracking

The project maintains compatibility with the following major dependency versions:

Component	Version	Notes
Python	3.8+	Required for Django 4+
Django	4.0+	Core backend framework
Vue	3.5.13	Frontend framework
PrimeVue	4.3.3	UI component library
Tailwind CSS	3.4.17	CSS framework
Node.js	16+	Required for frontend build

Setup Instructions

Setting Up Documentation Environment

Clone the repository:
```
git clone [repository-url]
cd comma
```
Install documentation dependencies:
```
cd docs
npm install
```
Start the documentation development server:
```
npm run dev
```
The documentation will be available at http://localhost:8090/.
Build the documentation site for production:
```
npm run build
```
The built files will be available in the .vuepress/dist directory.

Contributing to Documentation

Documentation files are written in Markdown (.md) or MDX (.mdx) format
Place new documentation files in the appropriate directory structure
Link documents in the navigation structure defined in .vuepress/config.js
Preview changes using the development server
Submit a pull request for review

Documentation Style Guide

Use clear, concise language
Include code examples where appropriate
Structure content with proper headings (h1, h2, h3, etc.)
Provide screenshots for UI components and workflows
Link to related documentation pages when referencing other parts of the system

Contact

For questions or suggestions about the documentation, please create an issue on our GitHub repository.