[{"_1":2,"_29":-5,"_30":-5},"loaderData",{"_3":4},"routes/thoughts.tags.$tag",{"_5":6,"_7":8},"tag","markdown","thoughts",[9],{"_10":11,"_12":13,"_14":15,"_16":17,"_18":19,"_23":24,"_25":26,"_27":28},"slug","frontmatter-basics","year","2025","title","Frontmatter Basics","dateCreated",["D",1752796800000],"tags",[6,20,21,22],"frontmatter","blogging","yaml","content","\nFrontmatter is YAML metadata at the top of markdown files. It's wrapped in triple dashes and lets you add structured data to your content.\n\n```yaml\n---\ntitle: My Post\ntags: [web, javascript]\ndraft: false\n---\n\n# Your content starts here\n```\n\n## Common uses:\n- **Tags** - organize content by topic\n- **Drafts** - hide work-in-progress posts\n- **Metadata** - titles, dates, descriptions\n\n## This file's frontmatter:\n```yaml\n---\ntitle: Frontmatter Basics\ndate: 2025-07-18\ntags: [markdown, frontmatter, blogging, yaml]\n---\n```\n\nYep, using frontmatter to explain frontmatter.\n\nModern frameworks support it natively: Astro has built-in frontmatter with type-safe content collections, while Next.js and React Router require third-party libraries like `next-mdx-remote` or `react-router-mdx` for frontmatter support. The `gray-matter` library handles parsing in Node.js. Simple concept, very useful for content management.\n","compiledContent","

Frontmatter is YAML metadata at the top of markdown files. It's wrapped in triple dashes and lets you add structured data to your content.

---\ntitle: My Post\ntags: [web, javascript]\ndraft: false\n---\n\n# Your content starts here\n

Common uses:

Tags - organize content by topic
Drafts - hide work-in-progress posts
Metadata - titles, dates, descriptions

This file's frontmatter:

---\ntitle: Frontmatter Basics\ndate: 2025-07-18\ntags: [markdown, frontmatter, blogging, yaml]\n---\n

Yep, using frontmatter to explain frontmatter.

Modern frameworks support it natively: Astro has built-in frontmatter with type-safe content collections, while Next.js and React Router require third-party libraries like next-mdx-remote or react-router-mdx for frontmatter support. The gray-matter library handles parsing in Node.js. Simple concept, very useful for content management.

","filePath","/home/runner/work/personal-website/personal-website/thoughts/markdown/frontmatter-basics.md","actionData","errors"]

Thoughts tagged: markdown