Aries Chan's Garden

Powered by 🌱Roam Garden

Roam Garden for Beginners: 5 Easy Steps to Sowing Seeds in Roam Research

Did you know that you can create beautiful static sites/digital gardens based on your Roam Research graph in just a few clicks? Yes, Vlad Sitalo made it possible! He created Roam Garden so you can easily sow seeds in Roam and let them bloom on the internet. With a few tags, you can choose which notes you want to make public for the world to see.

As a Roam Research power-user, I asked myself if it's possible to create a blog out of my graph since there's this option to keep it private or make it publicly available. But the thought of having multiple graphs to manage can be time-consuming. Switching between graphs to make an update can be tedious.

To find an answer to my question, I contacted the Roam Research team and posed the question: Can a Roam graph be turned into a blog? It was Matt who introduced me to a tool called Roam Garden.

Roam Garden, in a nutshell, allows you to publish your Roam graph and notes in a format that people can explore.

Let me walk you through on how you can easily setup Roam Garden in just a few steps.

First, go to Roam Garden and sign up. Keep your credit card handy so that you can avail of the 7-day free trial. Please choose a username to your liking since it serves as your default Roam Garden address (ex. username.roam.garden).

Second, it's time to plant your garden! Start by naming your garden. In the 'Starting page' box, choose the name of the note you want to make public (ex. Blog). In the 'Make pages with these tags public (all pages are private by default)' box, use the same name of the note you provided in the first box plus create the 'make-public' tag (Ex. Blog, make-public). You may skip the 'Make blocks with these tags private' box. Note: Go to your Roam graph to make sure that the notes/tags you want to use do exist.

Third, go to your Roam Research account and export your graph using JSON. See gif below:

Fourth, go back to Roam Garden and upload the JSON file under 'Your graph JSON'. You may skip 'Custom CSS'.

Fifth, click on the 'Submit' button. Depending on the size of your files, it might take more or less 15 minutes to update your garden. You'll receive an email saying that your garden has blossomed.

If the above steps didn't work for you, you could use the following steps instead:

  1. Go to your Roam graph and create a roam/garden note.
  1. Create a roam/js note and follow the steps on how to install a Roam plugin.
  1. Paste this Roam Garden plugin code block:

let id = "roam-garden-plantsman" let existingRg = document.getElementById(id) if (!existingRg) { const extension = document.createElement("script") extension.src = "https://resources.roam.garden/js/plantsman.min.js"

extension.id = id
extension.async = true
extension.type = "text/javascript"
document.getElementsByTagName("head")[0].appendChild(extension)

}

  1. Go to your roam/garden note. You should see there the Roam Garden user interface. Enter your Roam Garden username and password.
  1. Provide the necessary information and then click on the 'Submit' button and wait until your garden blossoms.

You are reading this blog inside my garden. To visit other gardens for inspiration, check out the following links:

In sum, Roam Research serves as a knowledge management system and a database for the resumes that I’ve written for clients in the US. And now that Roam Garden is here, it’s high time for ideas to blossom.

Resources

You can also check out the following resources if you want an in-depth tutorial directly from the creator of Roam Garden himself, Vlad Sitalo:

Roam Garden for Beginners: 5 Easy Steps to Sowing Seeds in Roam Research