---
name: blog-creator
description: Create SEO-optimized MDX blog posts with proper frontmatter
---

# Blog Post Creator Skill

This skill helps you create high-quality, SEO-optimized blog posts using the MDX content engine.

## Directory Structure

- **Content Location**: `src/content/blog/*.mdx`
- **Images**: `/public/assets/images/` (reference as `/assets/images/...`)
- **Engine**: `src/lib/mdx/blogs.ts`
- **Frontend**: `src/app/(website-layout)/blog/`

## File Format

Each blog post must be a `.mdx` file with specific frontmatter:

```markdown
---
title: "Your Engaging Title Here"
tags: ["tag1", "tag2", "seo-keyword"]
featuredImage: "/assets/images/your-image.png"
createdDate: "YYYY-MM-DD"
description: "A compelling meta description for SEO (150-160 chars recommended)"
---

# Your Title H1

Introduction paragraph...

## Section H2

Content...
```

## Best Practices

1.  **Slug Generation**: The filename becomes the slug (e.g., `my-post.mdx` -> `/blog/my-post`). Use kebab-case.
2.  **Images**: Place images in `public/assets/images` and reference them with absolute paths.
3.  **Tags**: Used for "Related Articles" logic. Include 3-5 relevant tags.
4.  **Components**: You can import and use React components inside MDX files (if configured in `mdx-components.tsx`).
5.  **SEO**: - `title`: Used for `<title>` and `og:title`. - `description`: Used for `<meta name="description">` and `og:description`. - `featuredImage`: Used for `og:image`.
    **DO NOT USE single quotes in the frontmatter. Use double quotes instead.**

## Workflow

1.  Create a new file: `src/content/blog/your-slug.mdx`.
2.  Add the frontmatter.
3.  Write content using Markdown syntax.
4.  (Optional) Add images to `public/assets/images/`.

## Example

File: `src/content/blog/getting-started.mdx`

```markdown
---
title: "Getting Started with Indie Kit"
tags: ["guide", "tutorial", "indie-kit"]
featuredImage: "/assets/images/og.png"
createdDate: "2024-03-20"
description: "A complete guide to setting up your new SaaS project with Indie Kit in under 10 minutes."
---

# Getting Started

Welcome to the future of SaaS development...
```

Refer to [reference.md](reference.md) for more details.