DEV.co
Open-Source CMS · estruyf

vscode-front-matter

Front Matter is a VS Code extension that functions as a headless CMS for managing content in static site generators (Hugo, Jekyll, Hexo, Next.js, Gatsby, etc.). It provides content creation, media management, SEO checks, and preview capabilities directly within the editor, eliminating the need for separate CMS tools.

Source: GitHub — github.com/estruyf/vscode-front-matter
2.5k
GitHub stars
106
Forks
TypeScript
Primary language
MIT
License (OSI-approved)

Key facts

Objective fields from the source. Values we can't verify are shown as “Unknown” rather than guessed.

FieldValue
Repositoryestruyf/vscode-front-matter
Ownerestruyf
Primary languageTypeScript
LicenseMIT — OSI-approved
Stars2.5k
Forks106
Open issues93
Latest releasev10.11.0 (2026-07-02)
Last updated2026-07-02
Sourcehttps://github.com/estruyf/vscode-front-matter

What vscode-front-matter is

TypeScript-based VS Code extension offering dashboard UIs for content/media/data/taxonomy management, markdown editing with frontmatter support, multi-language content (i18n), extensibility hooks, and real-time site preview. Integrates with popular static generators through configuration-driven workflows.

Quickstart

Get the vscode-front-matter source

Clone the repository and explore it locally.

terminalbash
git clone https://github.com/estruyf/vscode-front-matter.gitcd vscode-front-matter# follow the project's README for install & configuration

Need it deployed, integrated, or customized instead? DEV.co ships production installs.

Best use cases

Static Site Content Management

Teams using Hugo, Jekyll, Next.js, or Gatsby who want centralized content editing, search, filtering, and SEO validation without leaving VS Code. Eliminates manual file navigation and provides a unified dashboard for all content artifacts.

Multi-Language Content Sites

Projects requiring i18n/multilingual support (v10+) benefit from built-in language management, allowing content creators to maintain translated content with consistent metadata across multiple language variants.

Data-Driven Static Sites

Websites using data files (JSON, YAML) alongside markdown benefit from the data files dashboard to manage taxonomy, categories, tags, and structured metadata without direct file editing.

Implementation considerations

  • VS Code must be installed and functional; extension adds ~50MB and runs within editor process—verify performance on slower development machines.
  • Project must follow a supported static generator pattern (frontmatter + markdown files) or use data files; incompatible projects require restructuring.
  • Team coordination needed: define content types, metadata schemas, and taxonomy upfront; configurable per-project in `.frontmatter/config` or team settings.
  • No built-in hosting or deployment; must maintain separate pipeline (GitHub Actions, Netlify, Vercel, etc.) for build/publish; extension handles editing only.
  • Migration from existing CMS requires mapping old content structure to markdown + frontmatter; tooling for bulk migration not documented—may require custom scripts.

When to avoid it — and what to weigh

  • Requiring Active Feature Development — Maintainer has explicitly stated focus is shifting away from major feature work due to sustainability concerns. New features will be slower; use only if current functionality meets your needs or you can sponsor development.
  • Need for Real-Time Collaboration — Extension is single-user, editor-based. Teams requiring simultaneous editing, approval workflows, or cloud-hosted CMS features should evaluate purpose-built alternatives like Contentful or Strapi.
  • Non-Developer Content Creators — Requires VS Code installation and familiarity with file structure. Non-technical editors accustomed to form-based CMS interfaces may face a steep learning curve.
  • Frequent Custom Integrations — Limited documented integration ecosystem. If you need deep third-party integrations (payment gateways, analytics, custom APIs), extensibility may not provide sufficient hooks without maintainer involvement.

License & commercial use

MIT License. Permissive open-source license allowing commercial use, modification, and distribution with attribution and liability waiver.

MIT is a permissive OSI license, so commercial use is permitted. However, review the maintainer's 2026 priorities statement: they have shifted focus toward revenue sustainability. If your business depends on active feature development or vendor support, sponsorship or alternative solutions are advisable. No explicit commercial support agreement is documented.

DEV.co evaluation signals

Editorial assessment — not user reviews. Directional, with an explicit confidence level.

SignalAssessment
MaintenanceActive
DocumentationStrong
License clarityClear
Deployment complexityLow
DEV.co fitGood
Assessment confidenceHigh
Security considerations

Extension runs within VS Code and has access to your project files and local file system. No known CVEs documented. Review data it collects (Unknown if telemetry is active). No encryption of local files; relies on OS file permissions. If storing sensitive data (API keys, credentials) in frontmatter, encrypt separately or use environment variables. Extension does not make external network calls beyond VS Code telemetry (if enabled).

Alternatives to consider

Contentful

Hosted headless CMS with powerful API, team collaboration, versioning, and workflow tools. Better for non-developer teams and multi-site scale, but higher cost and less integrated with code editor.

Strapi

Self-hosted headless CMS with flexible content modeling, admin UI, and role-based access. Stronger for teams and real-time collaboration, but requires DevOps overhead and database management.

Hugo/Jekyll Native Tooling + Git

Pure file-based approach (no CMS) with version control. Lightest footprint and most portable, but no unified dashboard, search, or SEO checks—requires manual workflow.

Software development agency

Build on vscode-front-matter with DEV.co software developers

Install Front Matter from the VS Code Marketplace and configure your first project. Start with the free tier, and consider sponsoring the maintainer if it becomes mission-critical to your team.

Talk to DEV.co

Related open-source tools

Surfaced by semantic similarity across the DEV.co open-source index.

Related on DEV.co

Explore the category and the services that help you build with it.

vscode-front-matter FAQ

Does Front Matter work with my static site generator?
Officially supported: Hugo, Jekyll, Hexo, Next.js, Gatsby, and 'many more' per docs. Requirements are markdown + frontmatter support. Check frontmatter.codes/docs for your specific generator or open an issue.
Can my team use Front Matter together?
Not in real-time collaboration. Extension is single-user per VS Code instance. Teams can use shared Git repos and take turns editing, or consider Contentful/Strapi for simultaneous editing.
Is there a free tier or commercial license?
MIT License: free to use, modify, and distribute. No separate paid tier. Maintainer accepts sponsorship for feature prioritization (see GitHub Sponsors link), but no formal commercial support agreement is documented.
What happens if the maintainer stops developing Front Matter?
MIT license ensures you retain source code and can fork/maintain it. Current maintainer states the project will continue for personal use; no end-of-life announced. Monitor GitHub for activity; consider sponsorship if mission-critical.

Software development & web development with DEV.co

From first prototype to production, DEV.co delivers software development services around tools like vscode-front-matter. Our software development agency staffs experienced software developers and web developers for custom software development, web development, integrations, and ongoing support across open-source cms and beyond.

Ready to streamline your static site workflow?

Install Front Matter from the VS Code Marketplace and configure your first project. Start with the free tier, and consider sponsoring the maintainer if it becomes mission-critical to your team.