Digital Garden is a content-first project meant to make it easier to write and curate content on the web. This is a project I've built for myself but hope it can be useful for other folks looking to create their own gardens that leverage the open web. You can use components in your content seamlessly using MDX which is rad for writing.
I was inspired by numerous posts that struck a chord.
At the time of writing this I had roughly 100 WIP blog posts and essays
that were sitting, hidden in a local directory: ~nt.
With a nice digital garden, content can be fun again. With MDX you can now write dynamic and immersive content that can show rather than tell. I've found myself writing a lot more, and want to make it easy as hell to share that content with the community. With a digital garden I can share thoughts with folks without having to copy pasta the material to a GitHub Gist.
Install the libraries that are needed:
yarn add gatsby gatsby-theme-digital-garden react react-domCreate a gatsby-config.js that uses the gatsby-theme-digital-garden
theme:
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: 'gatsby-theme-digital-garden',
options: {}
}
]
}site
├── gatsby-config.js
├── package.json
├── pages
│ └── index.md
│ └── contact.md
├── posts
│ └── my-first-post.md
└── wiki
├── music
│ └── list.md
└── thoughts
├── thoughts-1.md
└── thoughts-2.mdOnly the journal feature uses chronological order by default since it's meant to be a long running diary of ideas. The posts and wiki categories default to alphabetical but allow for you to set a priority. The priority key is used to sort. The higher priority number wins.
---
title: My wiki page
priority: 9999
---This project is nowhere close to completed. There are numerous things on the horizon like:
- Content ordering
- Wiki index page
- Typography theming
- Layout theming
- Custom colors
- Projects section (portfolio)
- Post archive
These following posts served as an inspiration to start this project.