Now that you completed the Quick Start section of this guide, we are ready to learn how to add content to a Greenlight site with minimal programming requirements. This project is powered by Markdown, allowing content creators to author blog posts using a straightforward syntax built for writing documents as it is simpler than HTML. It also means that as a site manager you do not need a database to store all of the text you will be writing, instead you can store the Markdown ( .md files) on Github and let this app generate all of the HTML for you when you execute this command:

Let's give it a try and write your first blog post - don't worry, you can always remove it later.

Notice that your project has the following structure:

1. There are many files and folders in the directory, to make a post you need to use the /content/blog directory. Please note that Greenlight is setup to only to generate content from Markdown .md files using this directory so you must put your files here for them to render properly.
2. Once you have navigated to the /content/blog directory, create a new folder called 'my-first-post'.
3. Inside that folder, add a file called 'my-first-post.md' that will be your post.
4. Inside the new file, add a title, description and date for the post using the format below.

5. You can now add sample text to the new file. Try using a tool like loremipsum.io to generate placeholder text if you can't think of anything.

6. Additionally you can add images to this folder and then include them in the blog post using this syntax:

7. Once you are done creating your first blog post, make sure that the development server is running (see the Scripts for more information).
8. Go to http://localhost:8000/docs/my-first-post to find your new blog post.

That's all you need to do to write your first blog post or article.

There is still much more to Markdown syntax beyond the previous example. You can write tables, lists, headings and all sorts of elements using this language. All of the documentation you are now reading was written with Markdown, just to give you an idea of what you can do with it.

We highly recommend that you checkout this website to learn more about Markdown. Additionally, the Markdown Reference article from the documentation provides examples of this syntax and how it will be rendered on a Greenlight site.

You're likely trying out Greenlight for its Tableau embedding capabilities. The Markdown + Tableau viz combo that get's transformed into a website is pretty sweet. This works because Greenlight leverages MDX to allow users to add React components to Markdown files.

Greenlight was designed to bring the modern web to your finger tips. There is a lot that goes on under the hood without you noticing and you are free keep these details as magical or make them as familiar to you as you want. While it is not necessary for you to become a React expert to use this site template, we would definitely encourage you to try the tutorial and become familiar with the documentation at your own pace.

We have taken care to make React components used while writing blog posts as minimalist as possible by removing much of the complexity. The Tableau component is a great example as it only needs three lines of code and a URL, let's have a look:

Every React component is capitalized and written as a tag with </> angle brackets much like HTML. It then has a prop declaring the URL of the embedded visualization. All of the complexity of using Tableau's JavaScript API has been simplified into this straightforward syntax. It even adds a fully styled toolbar right below the viz! You can add multiple <Tableau/> components to the same blog post and customize the components even further. To learn more, please refer to the Tableau Reference for a deep dive.

You can learn more by checking out Gatsby's article on MDX. All of the components that have been built into Greenlight are described within the MDX Reference article of the documentation.