diff --git a/site/content/config.js b/site/content/config.js
index 4d8eda19..d89f6610 100644
--- a/site/content/config.js
+++ b/site/content/config.js
@@ -21,6 +21,7 @@ const config = {
     { name: "Blog", href: "/blog" },
     { name: "Showcases", href: "/#showcases" },
     { name: "Howtos", href: "/howto" },
+    { name: "Guide", href: "/guide" },
     { name: "Examples", href: "https://github.com/datopian/portaljs/tree/main/examples", target: "_blank" },
     { name: "Components", href: "https://storybook.portaljs.org", target: "_blank" },
     // { name: "DL Demo", href: "/data-literate/demo" },
diff --git a/site/content/guide/index.md b/site/content/guide/index.md
new file mode 100644
index 00000000..38376e1d
--- /dev/null
+++ b/site/content/guide/index.md
@@ -0,0 +1,54 @@
+---
+showToc: false
+showSidebar: false
+---
+
+<Hero title="Markdown-based Websites" subtitle="Create markdown-based website, update it, add collaborators and discover markdown superpowers" />
+
+# Tutorial 1: Create a website from scratch using markdown and PortalJS
+
+In this tutorial we will walk you through creating an elegant fully functional website written in simple markdown and published with PortalJS.
+
+By the end of this tutorial you will
+
+- have a working markdown-based website powered by PortalJS.
+- be able to edit the text and add pages all from an online interface without installing anything.
+
+🖼️ [SCREENSHOT of final website]
+
+### Setup a sandbox website including live publishing 💃
+
+https://app.tango.us/app/workflow/Setup-a-Flowershow-sandbox-website-including-publishing-9bef984b9dd14c07ae3288bb426c306e
+
+- Prerequisites: sign up for github (and vercel?)
+- Navigate to datopian flowershow: [link] 🖼️
+- Fork this? or click on deploy vercel
+- Let it build
+- Visit the site! Yay! your site is working 🖼️
+
+### Now let's edit the page
+
+💃 https://app.tango.us/app/workflow/Edit-a-single-Markdown-based-page-4aa9bd806829415eb3a86136bfb176eb
+
+- Add some text: let's change the front page
+  - (save and watch it redeploy)
+- Add a remote image??
+- Add an image??? (is it worth it or could come later)
+
+### Let's add a page: e.g. about page
+
+💃 https://app.tango.us/app/workflow/Add-a-single-Markdown-based-page-c14ae6dc9e1549f5af87b513daa701ba
+
+### What is this markdown stuff?
+
+- Idea of "markup" - how is this different from plain text
+- Brief info about markdown
+- Link to markdown tutorials
+- Explain we offer "markdown plus"
+- ?? Explain about PFM (vs GFM ...)
+
+### Trailer for tutorial 2
+
+[Optional] Intro to Part II: What's next and why are we going to install to go local ...
+
+Editing on github UI is ok but there are some issues e.g. can't work offline; can't add multiple files at same times, no "WYSIWYG" markdown editing; github markdown is subtlye different etc etc.