0

The most interesting feature of Gatsby to me is gatsby-source-filesystem's ability to tap into a directory of markdown files and serve up that static content to React via GraphQL queries. In essence, flat files with YAML frontmatter that are filterable, sortable, nestable, etc. How is it done? Is it based on an existing method? If not, could it be extracted for use with other stacks? (Vuepress for example)

Follow-up: is the method YAML specific? Could it be TOML or JSON or CSV or or or...?

Wray Bowling
  • 2,346
  • 2
  • 16
  • 19
  • In case this clarifies anything, I'm not sure if `apollo` is doing the work, or if it's something to do with webpack's `yaml-loader` or what – Wray Bowling Aug 16 '18 at 15:54

1 Answers1

1

gatsby-source-filesystem doesn't have any markdown-specific logic and indeed is not responsible for splitting out the frontmatter. That's the job of gatsby-transformer-remark, which uses grey-matter to do the actual frontmatter parsing (source).

From there nodes are created using the createNode action provided by Gatsby. The types are inferred by Gatsby based on the values of the nodes.

coreyward
  • 77,547
  • 20
  • 137
  • 166
  • Oooooooh Thank you, Corey! Grey matter looks very nice. createNode will take some more digging to understand, but you've set me on the right course. :) – Wray Bowling Aug 22 '18 at 16:21