|
| 1 | +# AGENTS.md |
| 2 | + |
| 3 | +This file provides guidance to AI agents when working with code in this repository. |
| 4 | + |
| 5 | +## Communication Style |
| 6 | + |
| 7 | +- Use direct, concise language without unnecessary adjectives or adverbs |
| 8 | +- Avoid flowery or marketing-style language ("tremendous", "dramatically", "revolutionary", etc.) |
| 9 | +- Don't use vague superlatives ("comprehensive", "complete", "full", "entire", "thorough", "detailed") |
| 10 | +- Don't include flattery or excessive praise ("excellent!", "perfect!", "great job!") |
| 11 | +- State facts and findings directly without embellishment |
| 12 | +- Skip introductory phrases like "I'm excited to", "I'd be happy to", "Let me dive into" |
| 13 | +- Avoid concluding with summary statements unless specifically requested |
| 14 | +- When presenting options or analysis, lead with the core information, not commentary about it |
| 15 | + |
| 16 | +## Project Overview |
| 17 | + |
| 18 | +This is the source code for ddev.com, a static website built with Astro and hosted on Cloudflare Pages. The site features a blog, documentation, sponsor information, and project resources for DDEV, a local development environment tool. |
| 19 | + |
| 20 | +## Development Commands |
| 21 | + |
| 22 | +Use DDEV for all development tasks: |
| 23 | + |
| 24 | +- `ddev start` - Start project with all dependencies |
| 25 | +- `ddev npm run dev` - Start development server with hot reloading |
| 26 | +- `ddev npm run build` - Build production site to `./dist/` |
| 27 | +- `ddev npm run preview` - Preview built site locally |
| 28 | +- `ddev npm run prettier` - Check code formatting |
| 29 | +- `ddev npm run prettier:fix` - Auto-fix formatting issues |
| 30 | +- `ddev npm run textlint` - Check content for writing issues |
| 31 | +- `ddev npm run textlint:fix` - Auto-fix content issues |
| 32 | + |
| 33 | +### Site Access |
| 34 | + |
| 35 | +- Dev server: https://<projectname>.ddev.site:4321 |
| 36 | +- Built site: https://<projectname>.ddev.site |
| 37 | + |
| 38 | +### Testing and Quality |
| 39 | + |
| 40 | +Before committing changes, always run: |
| 41 | + |
| 42 | +1. `ddev npm run prettier:fix` - Fix formatting |
| 43 | +2. `ddev npm run textlint:fix` - Check content quality |
| 44 | +3. `ddev start` - Ensure environment is working |
| 45 | +4. Spellcheck and check links in any new content |
| 46 | + |
| 47 | +### Commits |
| 48 | + |
| 49 | +When making commits after major changes, use AI-assisted commit messages that include: |
| 50 | + |
| 51 | +- Clear description of changes made |
| 52 | +- End with: `🤖 Developed with assistance from [Claude Code](https://claude.ai/code)` |
| 53 | +- Include: `Co-Authored-By: Claude <noreply@anthropic.com>` |
| 54 | + |
| 55 | +Only commit when explicitly requested by the user. |
| 56 | + |
| 57 | +## Working with Claude Code |
| 58 | + |
| 59 | +### Branch Naming |
| 60 | + |
| 61 | +Use descriptive branch names that include: |
| 62 | + |
| 63 | +- Date in YYYYMMDD format |
| 64 | +- Your GitHub username |
| 65 | +- Brief description of the work |
| 66 | + |
| 67 | +Format: `YYYYMMDD_<username>_<short_description>` |
| 68 | + |
| 69 | +Examples: |
| 70 | + |
| 71 | +- `20250919_rfay_update_quickstart` |
| 72 | +- `20250919_username_fix_blog_styling` |
| 73 | +- `20250919_contributor_add_sponsor` |
| 74 | + |
| 75 | +### Whitespace and Formatting |
| 76 | + |
| 77 | +- **Never add trailing whitespace** - Blank lines must be completely empty (no spaces or tabs) |
| 78 | +- Match existing indentation style exactly (spaces vs tabs, indentation depth) |
| 79 | +- Preserve the file's existing line ending style |
| 80 | +- Run linting tools to catch whitespace issues before committing |
| 81 | + |
| 82 | +## Architecture |
| 83 | + |
| 84 | +### Technology Stack |
| 85 | + |
| 86 | +- **[Astro](https://astro.build)** - Static site generator |
| 87 | +- **[Tailwind CSS](https://tailwindcss.com)** - Utility-first CSS framework |
| 88 | +- **[Tailwind Typography](https://tailwindcss.com/docs/typography-plugin)** - Typography plugin |
| 89 | +- **[Heroicons](https://heroicons.com)** - Icon library |
| 90 | +- **[Textlint](https://textlint.github.io)** - Content linting |
| 91 | +- **[Giscus](https://giscus.app)** - GitHub-based commenting system |
| 92 | + |
| 93 | +### Project Structure |
| 94 | + |
| 95 | +``` |
| 96 | +├── cache/ # GitHub API response cache for local development |
| 97 | +├── public/ # Static assets copied to dist/ |
| 98 | +│ ├── logos/ # Sponsor and technology logos (prefer SVG) |
| 99 | +│ └── _redirects # Cloudflare Pages redirects |
| 100 | +├── src/ |
| 101 | +│ ├── components/ # Reusable Astro components |
| 102 | +│ ├── content/ # Content collections (blog, authors) |
| 103 | +│ ├── layouts/ # Page layout wrapper |
| 104 | +│ ├── lib/ # Utilities (GitHub API, search, read time) |
| 105 | +│ ├── pages/ # Direct route mapping (.astro files) |
| 106 | +│ └── styles/ # Global PostCSS styles |
| 107 | +├── .env.example # Environment variables template |
| 108 | +├── astro.config.mjs # Astro configuration |
| 109 | +├── package.json # Dependencies and scripts |
| 110 | +└── tailwind.config.cjs # Tailwind configuration |
| 111 | +``` |
| 112 | + |
| 113 | +### Content Management |
| 114 | + |
| 115 | +The site uses Astro's Content Collections with strict schema validation: |
| 116 | + |
| 117 | +- **Blog posts**: `src/content/blog/*.md` - Markdown with frontmatter, validated against categories and author schemas |
| 118 | +- **Authors**: `src/content/authors/*.md` - Author profiles with name, firstName, and optional avatarUrl |
| 119 | +- **Static pages**: `src/pages/*.astro` - Direct route mapping |
| 120 | + |
| 121 | +### Content Schema |
| 122 | + |
| 123 | +Blog posts require: |
| 124 | + |
| 125 | +- Valid author (must exist in authors collection) |
| 126 | +- Categories from predefined list: Announcements, Community, DevOps, Performance, Guides, TechNotes, Training, Videos |
| 127 | +- pubDate as Date object |
| 128 | +- Optional featureImage with alt text |
| 129 | + |
| 130 | +### Content Linking |
| 131 | + |
| 132 | +- **Internal blog links**: Use markdown filename references (e.g., `[link text](filename.md)`) for links between blog posts. Astro automatically resolves these to proper URLs. |
| 133 | +- **Other internal links**: Use root-relative paths (e.g., `[Contact](/contact)`) for links to other site pages |
| 134 | +- **External links**: Use full URLs for links outside the site |
| 135 | + |
| 136 | +### GitHub Integration |
| 137 | + |
| 138 | +The site fetches dynamic data from GitHub API: |
| 139 | + |
| 140 | +- Requires `GITHUB_TOKEN` environment variable |
| 141 | +- Uses local `cache/` directory to reduce API calls during development |
| 142 | +- Token needs: `repo`, `read:org`, `read:user`, `read:project` scopes |
| 143 | + |
| 144 | +### Sponsor Management |
| 145 | + |
| 146 | +Featured sponsors are managed in `src/featured-sponsors.json` with specific schema for logos, URLs, and types. This data generates sponsor displays and SVG badges used in the main DDEV repository. |
| 147 | + |
| 148 | +## Development Setup |
| 149 | + |
| 150 | +### DDEV Setup (Recommended) |
| 151 | + |
| 152 | +1. Run `ddev start` to start and set up the project's dependencies |
| 153 | +2. Open https://<projectname>.ddev.site:4321 in your browser |
| 154 | +3. To rebuild static site: `ddev npm run build` |
| 155 | +4. Static site available at: https://<projectname>.ddev.site |
| 156 | + |
| 157 | +### Setup Without DDEV |
| 158 | + |
| 159 | +1. Run `nvm use` to use appropriate Node.js version |
| 160 | +2. Run `npm install` to install dependencies |
| 161 | +3. Run `npm run dev` to start development server |
| 162 | +4. Visit `http://localhost:4321/` |
| 163 | + |
| 164 | +### GitHub Token Setup |
| 165 | + |
| 166 | +For dynamic GitHub data (not required for blog posts): |
| 167 | + |
| 168 | +1. Run `cp .env.example .env` |
| 169 | +2. Create [classic GitHub access token](https://github.com/settings/tokens) with scopes: `repo`, `read:org`, `read:user`, `read:project` |
| 170 | +3. Add token to `.env` as `GITHUB_TOKEN=your_token_here` |
| 171 | + |
| 172 | +## Content Creation |
| 173 | + |
| 174 | +### Blog Posts |
| 175 | + |
| 176 | +Template for new blog posts in `src/content/blog/`: |
| 177 | + |
| 178 | +```markdown |
| 179 | +--- |
| 180 | +title: "Post Title" |
| 181 | +pubDate: 2023-01-01 |
| 182 | +summary: Brief description |
| 183 | +author: Author Name |
| 184 | +featureImage: |
| 185 | + src: /img/blog/kebab-case.jpg |
| 186 | + alt: Descriptive alt text |
| 187 | + caption: Optional caption |
| 188 | + credit: Optional credit |
| 189 | +categories: |
| 190 | + - Category Name |
| 191 | +--- |
| 192 | + |
| 193 | +Post content here... |
| 194 | +``` |
| 195 | + |
| 196 | +**Categories**: Announcements, Community, DevOps, Performance, Guides, TechNotes, Training, Videos |
| 197 | + |
| 198 | +**Images**: Production-ready, <2MB, reasonable dimensions, optimized |
| 199 | + |
| 200 | +### Authors |
| 201 | + |
| 202 | +Add new authors to `src/content/authors/` with schema: |
| 203 | + |
| 204 | +- name (must match blog post frontmatter) |
| 205 | +- firstName |
| 206 | +- avatarUrl (optional) |
| 207 | + |
| 208 | +### Pages |
| 209 | + |
| 210 | +Add `.astro` files to `src/pages/` where filename becomes URL slug. |
| 211 | + |
| 212 | +## Quality Control |
| 213 | + |
| 214 | +### Textlint |
| 215 | + |
| 216 | +- Configuration in `.textlintrc` |
| 217 | +- Runs against `src/content/**` |
| 218 | +- Enforces consistent language and terminology |
| 219 | +- Run `ddev npm run textlint` before committing |
| 220 | + |
| 221 | +### Prettier |
| 222 | + |
| 223 | +- Configuration in `.prettierrc` |
| 224 | +- Auto-formats code |
| 225 | +- Run `ddev npm run prettier:fix` before committing |
| 226 | +- VS Code: Auto-format on save enabled |
| 227 | + |
| 228 | +### Recommended VS Code Extensions |
| 229 | + |
| 230 | +- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) |
| 231 | +- [EditorConfig](https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig) |
| 232 | +- [Astro](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode) |
| 233 | + |
| 234 | +## Build & Deployment |
| 235 | + |
| 236 | +- GitHub Actions tests on every push to main |
| 237 | +- Cloudflare Pages automatically builds and deploys from main branch |
| 238 | +- Preview builds created for all PR branches |
| 239 | +- Redirects managed via `public/_redirects` file |
| 240 | + |
| 241 | +### Secrets |
| 242 | + |
| 243 | +Production requires `GITHUB_TOKEN` environment variable in Cloudflare Pages settings. |
| 244 | + |
| 245 | +## Important Notes |
| 246 | + |
| 247 | +- Always preserve existing code style and component patterns |
| 248 | +- Blog images should be production-ready: optimized, < 2MB, reasonable dimensions |
| 249 | +- All content goes through textlint validation for consistency |
| 250 | +- The site is configured for DDEV development with special CORS and host settings |
| 251 | +- Use kebab-case for blog post filenames |
| 252 | +- Prefer SVG logos in `public/logos/` |
| 253 | +- Internal blog links use markdown filename references |
| 254 | +- External links use full URLs |
| 255 | + |
| 256 | +## Resources |
| 257 | + |
| 258 | +- [Astro Documentation](https://docs.astro.build) |
| 259 | +- [DDEV Documentation](https://ddev.readthedocs.io/) |
| 260 | +- [Contributing to ddev.com Training](https://ddev.com/blog/ddev-website-for-contributors/) |
0 commit comments