front-matter
gray-matter
Our great sponsors
front-matter | gray-matter | |
---|---|---|
3 | 6 | |
590 | 2,484 | |
- | - | |
1.1 | 0.0 | |
5 months ago | 3 months ago | |
JavaScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
front-matter
-
Label automation at your fingertips
front-matter parser
- Why I built my own static site generator
-
Making a Markdown Editor for Your Vue Blog with Front Matter Support
What we want is for our editor to take the combination of front-matter data and markup, then be able to extract the two before storing that data separately somewhere. We'll be using the front-matter module to extract the data we need from the text editor content.
gray-matter
-
Link component(s) in markdown file
Use https://www.npmjs.com/package/gray-matter
-
How I built my portfolio using NextJS, Typescript, and Chakra UI
gray-matter: Converts a string with front-matter to object.
-
Adding an Updated Date to Markdown and Mdx Posts
Read each file with the gray-matter package which parses the frontmatter for us.
-
How to create a blog for your Next.js and ChakraUI website
Load the frontmatter - gray-matter
-
How I Built An Incomplete CMS
I began building a blog application for a site that I may or may not finish. The bulk of the project is based on the blog-starter-typescript example in the NextJs GitHub repo. Their example loads markdown files from a folder in the root directory and uses remark and gray-matter to convert the markdown into html and to get file metadata. The example code for these function is located in their lib folder as api.ts and markdownToHtml.ts.
-
AMP CMS: Finishing & deploying to DigitalOcean
Markdown content is parsed by gray-matter and then rendered to html by marked with an amp-image tag instead of a img. You can pass parameters (like width, height, layout and etc) to an image tag with the query parameters:
What are some alternatives?
docsify - 🃏 A magical documentation site generator.
remark - remark is a popular tool that transforms markdown with plugins. These plugins can inspect and change your markup. You can use remark on the server, the client, CLIs, deno, etc.
react-markdown - Markdown component for React
TypeScript - TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
next-markdown-blog
next-markdown-blog - A lightly opinionated, full-featured Next.js blog managed through Git Workflows with markdown files.
Assemble - Get the rocks out of your socks! Assemble makes you fast at web development! Used by thousands of projects for rapid prototyping, themes, scaffolds, boilerplates, e-books, UI components, API documentation, blogs, building websites/static site generator, an alternative to Jekyll for gh-pages and more! Gulp- and grunt-friendly.
marked - A markdown parser and compiler. Built for speed.
Metalsmith - An extremely simple, pluggable static site generator.
Wintersmith - A flexible static site generator