docs: expand README with detailed project information, features, tech stack, and setup instructions.

Author: Kashan-2912

README.md

@@ -1,2 +1,68 @@
-# api-documentation-generator
-NextJS Hackathon
+# Clariodocs | API Documentation Generator
+Transform your API specification into a clean, branded, and shareable documentation site instantly. Clariodocs is a powerful tool designed for developers to effortlessly convert OpenAPI specs and Postman Collections into beautiful, interactive documentation.
+![Clariodocs Dashboard Hero](public/images/create-beautiful-api.png)
+## 🚀 Features
+- **Easy API Spec Upload**: Upload your OpenAPI (JSON/YAML) or Postman collection in seconds.
+- **AI-Powered Enhancement**: Automatically generate clear descriptions, functional code examples, and usage patterns using advanced LLMs (e.g., Anthropic Claude 3.5 Sonnet via OpenRouter).
+- **Beautiful Documentation UI**: Get a modern, responsive interface complete with dark mode support.
+- **Multiple Templates**: Choose from Minimal, Developer Hub, Enterprise, or Interactive templates to match your audience's needs.
+- **Interactive Editor**: Tweak and edit your generated documentation in a split-pane interactive Monaco Editor.
+- **Custom Domain Support**: Host on our platform or bring your own domain for a seamless, branded experience.
+- **Export Options**: Download your generated documentation as PDF or ZIP files.
+## 💻 Tech Stack
+- **Framework**: [Next.js 15.2](https://nextjs.org/) (React 19)
+- **Styling**: [Tailwind CSS v4](https://tailwindcss.com/) with Framer Motion, Radix UI primitives, and custom Glowing Effects
+- **Authentication & Database**: [Supabase](https://supabase.com/)
+- **AI Generation**: [OpenRouter](https://openrouter.ai/) for LLM integration
+- **Editor**: [@monaco-editor/react](https://github.com/suren-atoyan/monaco-react) & MDX
+- **Drag & Drop**: [@dnd-kit](https://dndkit.com/)
+## 📂 Project Structure
+```bash
+clariodocs-api-documentation-generator/
+├── src/
+│   ├── app/                 # Next.js App Router (pages layout & routing)
+│   │   ├── (dashboard)/     # Main app dashboard, document generation, and editor
+│   │   ├── api/             # API Routes for database and OpenRouter calls
+│   │   └── ...
+│   ├── components/          # Reusable UI components (sections, layouts, MDX elements)
+│   ├── hooks/               # Custom React hooks
+│   ├── lib/                 # Service functions (Supabase client, docService, OpenRouter)
+│   ├── provider/            # Global context providers
+│   ├── services/            # Business logic and external API integrations
+│   └── types/               # TypeScript type definitions
+├── public/                  # Static assets (images, icons)
+├── package.json             # NPM dependencies and scripts
+└── next.config.ts           # Next.js configuration
+```
+## 🛠️ Getting Started
+Follow these steps to set up the project locally:
+### 1. Clone the repository
+```bash
+git clone <repository-url>
+cd clariodocs-api-documentation-generator
+```
+### 2. Install Dependencies
+```bash
+npm install
+```
+### 3. Environment Variables
+Create a `.env.local` file in the root directory and add the necessary environment variables based on `.env.example`:
+```env
+NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
+NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
+OPENROUTER_API_KEY=your_openrouter_api_key
+```
+### 4. Run the Development Server
+```bash
+npm run dev
+```
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the application.
+## 🤝 Contributing
+Contributions are welcome! Please feel free to submit a Pull Request.
+1. Fork the Project
+2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
+3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
+4. Push to the Branch (`git push origin feature/AmazingFeature`)
+5. Open a Pull Request
+## 📄 License
+This project is licensed under the MIT License - see the `LICENSE` file for details.