Programmatically generating menus is a difficult concept at first because it seems simple enough just to hardcode your menu into a component. However, making a reusable and data agnostic menu component is really easy and can travel with you from project to project. Here, I want to outline two approaches to generating menus from your data. The first involves defining menu items in markdown frontmatter, which can be useful when designing sites for folks less familiar with javascript or coding more generally. The second is an iteration on the current Gatsby documentation that skips using GraphQL fragments in favor of a meta config file.

My personal website, inadequate futures, has been rewritten a total of three times. I was inspired to pick html and css back up after learning about static site generators, specifically Jekyll, after reading about Alex Gil's "Ed" theme for minimal editions (I am in the process of porting this over to Gatsby. More on that at the end of this post). The first version of the site was launched about a year ago on GitHub pages with the help of Hugo, which quickly shifted my focus from building my website back towards the world of frontend development. Not long after launching "if-ver01," I started reading about the JAMStack and React, which offered what seemed like a robust alternative for turning markdown files into blog posts.