58 lines
2.0 KiB
Markdown
58 lines
2.0 KiB
Markdown
---
|
||
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.
|
||
|
||
Below is a screenshot of how the final website will look like:
|
||
![[tutorial-1-result.png]]
|
||
|
||
### Setup a sandbox website including live publishing
|
||
|
||
- Prerequisites: sign up for GitHub and Vercel
|
||
- Navigate to [datopian/flowershow repository](https://github.com/datopian/flowershow)
|
||
- Click on "Deploy"
|
||
- Let the site build on Vercel
|
||
- Visit the site! Yay! Your site is working! 🎉
|
||
|
||
### Now, let's edit the front page
|
||
|
||
- Navigate to `content/index.md` file in the site repository
|
||
- Add some text to it
|
||
- Save and watch the site redeploy
|
||
- Visit the site! Yay! Your changes are live! 🎉
|
||
|
||
### Let's add a page: e.g. about page
|
||
|
||
- Navigate to the `content` folder in the site repository
|
||
- Add `about.md` file with some text
|
||
- Save and watch the site redeploy
|
||
- Visit the site! Yay! Your changes are live! 🎉
|
||
|
||
> [!tip]
|
||
> Read full tutorial [[create-a-website-from-scratch|here!]]
|
||
|
||
# Tutorial 2: Editing your site locally on your computer
|
||
|
||
### 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 ...)
|
||
|
||
### Why go local?
|
||
|
||
While editing on GitHub UI is acceptable, it has its limitations – it doesn't support working offline, adding multiple files simultaneously, or previewing many markdown syntax elements supported by Flowershow-based websites.
|