Convert a directory of markdown files to structured and usable JSON

Features

📄 Top level files will be turned into an object
📁 Files contained within top level directories will be grouped into an object
🗂 Files contained within folders of the collections directory will be turned into an array of objects.
🐫 File names will be transformed to camelCase and used as property names
✍️ Markdown will be parsed as HTML using Metalsmith Markdown and output within a contents property.
🕹 Frontmatter will be added as properties of the generated objects.
💅 Add custom renderer options
🔧 Optionally disable markdown parsing to just recieve structured JSON containing markdown

Install

$ npm install jdown

Usage

const jdown = require('jdown');
jdown('path/to/markdown/content').then(content => console.log(content));

Where "path/to/markdown/content" is a directory containing markdown files or folders as described under the "Features" header above. The file path will be relative to the project root so if your content was in /Users/username/project/src/content, you would use jdown('src/content').

Use the generated JSON however you like, I recommend with a static site generator like React Static! This way you can use the markdown files as a CMS and use the JSON in the build stage.

Custom render options

By default, jdown uses the default marked render options, but you may pass in your own custom overrides to customize the built html. This can be useful for adding custom ids or CSS classes. In the example below you can see how you can make your links open in a new tab by default, by adding target="_blank" to anchor tags.

const jdown = require('jdown');
const marked = require('marked');
const renderer = new marked.Renderer();
renderer.link = (href, title, text) => `<a target="_blank" href="${href}" title="${title}">${text}</a>`;

jdown('path/to/markdown/content', {renderer}).then(content => console.log(content));

See the advanced configurations and extensibility sections of the marked documentation for the full list of possible options you may use here.

Disabling markdown parsing

In some cases you may wish to disable markdown parsing to just recieve structured JSON containing markdown instead of HTML. You can accomplish this using the parseMd option like so:

jdown('path/to/markdown/content', {parseMd: false}).then(content => console.log(content));

Examples

See the examples directory of this repository. To test it yourself clone this repo, install the dependancies with npm install, modify some content and run npm run example.

danwebb.co is built using jdown and React Static so see the static.config.js file in the websites github repo for a real world example.

There is also an example built into React Static that you can use to quickly get up and running here.

Contributing

Any pull requests are welcome and will be reviewed. Please use npm run test to test your changes are working before submitting any changes.

License

MIT