markdown in `doc-site`
In this video we will see how to use markdown in `doc-site`.
Introduction
`fastn` supports the `Markdown`. Hence, instead of learning tags, one can still
create content-heavy and powerful website using plain text without missing out
on formatting.
Supporting `Markdown` makes `fastn` versatile as it also supports the
conversion of the marked-up text into various output formats such as HTML.
By importing the `doc-site` package in your fastn projects and using
any of the component like `ds.markdown` component, you gain access to
Markdown's intuitive and readable text formatting syntax.
Markdown
`Markdown` is a way to write the content for the web.
Markdown provides a way to style text elements such as headings, lists, links,
and more, using plain text and minimal special characters.
📝
Markdown Yes, but...
We do not recommend you to style text elements such as `headings`, `images` and
`code-block` instead we want you to use following components:
| Elements | Components |
| :---------- | :--------- |
| heading | `ds.h1` |
| image | `ds.image` |
| code-block | `ds.code` |
Benefits
- Markdown's simplicity, readibility, and portability as plain texts can be
easily shared and opened on any platform. Hence, using it in `doc-site` makes
it a valuable tool for content creators and developers alike.
- Markdown is widely used in blogging, instant messaging, online forums,
collaborative software, documentation pages, and readme files.
- It gives rich styling to the text.
Let's see what all we can do by using Markdown in `doc-site`.
Markdown syntax in doc-site
To use the *Markdown Syntax* in your fastn projects using components of
`doc-site`. The first thing is to add doc-site in your package and then use
the components of `doc-site` package.
To add `doc-site` in your package.
Add it as the `fastn.dependency` in your `FASTN.ftd` document.
Dependency
-- fastn.dependency: fastn-community.github.io/doc-site
Lang:
ftd
Then, import the `doc-site` package in your documents like `index.ftd`
Importing doc-site
-- import: fastn-community.github.io/doc-site as ds
Lang:
ftd
Now, start using the components like ds.page, ds.markdown, ds.h1 etc.
Syntax
-- ds.markdown:
Lang:
ftd
Plain text
Input
-- ds.markdown:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt.
Lang:
ftd
Output
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt.
Inline styles
Input
-- ds.markdown:
**Bold Text** dolor sit amet, *Italic text* elit, sed do eiusmod tempor
incididunt.
Lang:
ftd
Output
**Bold Text** dolor sit amet, *Italic text* elit, sed do eiusmod tempor
incididunt.
Inline links
Input
-- ds.markdown:
Lorem ipsum [fastn](https://fastn.com/) amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt.
Lang:
ftd
Output
Lorem ipsum [fastn](https://fastn.com/) amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt.
Turning a URL into a link
Input
-- ds.markdown:
https://fastn.com/
Lang:
ftd
Output
https://fastn.com/
Markdown List
Input
-- ds.markdown:
**Bullet list:**
- List item 1
- List item 2
- List item 3
- Sub List item 1
- Sub List item 1
**Ordered list:**
1. List item
2. List item
3. List item
1. Sub List Item
2. Sub List Item
3. Sub List Item
Lang:
ftd
Output
**Bullet list:**
- List item 1
- List item 2
- List item 3
- Sub List item 1
- Sub List item 1
**Ordered list:**
1. List item
2. List item
3. List item
1. Sub List Item
2. Sub List Item
3. Sub List Item
We can strikethrough a word or a sentence using single `~` symbol
Strikethrough
Input
-- ds.markdown:
~The world is flat.~
Lang:
ftd
Output
~The world is flat.~
To create a superscript, use one caret symbol (^) before and after the
characters.
Superscript
Input
-- ds.markdown:
X^2^
Lang:
ftd
Output
X^2^
Horizontal Rule
Input
-- ds.markdown:
To create a Horizontal Rule we write
***
Lang:
ftd
Output
To create a Horizontal Rule we write
***
This way you can make use of Markdown in your fastn projects.
Thank you guys, keep watching these videos to learn more about fastn.
Support us by giving a star ⭐ on
[GitHub](https://github.com/fastn-stack/fastn/) and join our fastn community
on [Discord](/discord/).
Support `fastn`!
Enjoying `fastn`? Please consider giving us a star ⭐️ on
[GitHub](https://github.com/fastn-stack/fastn) to show your support!
[⭐️](https://github.com/fastn-stack/fastn)
Getting Help
Have a question or need help?
Visit our [GitHub Q&A discussion](https://github.com/fastn-stack/fastn/discussions/categories/q-a)
to get answers and subscribe to it to stay tuned.
Join our [Discord](https://discord.gg/a7eBUeutWD) channel and share your
thoughts, suggestion, question etc.
Connect with our [community](/community/)!
[💻️](/community/)
Found an issue?
If you find some issue, please visit our [GitHub
issues](https://github.com/fastn-stack/fastn/issues) to tell us about it.
Quick links:
- [Install `fastn`](install/)
- [Create `fastn` package](create-fastn-package/)
- [Expander Crash Course](expander/)
- [Syntax Highlighting in Sublime Text](/sublime/)
Join us
We welcome you to join our [Discord](https://discord.gg/a7eBUeutWD) community
today.
We are trying to create the language for human beings and we do not believe it
would be possible without your support. We would love to hear from you.
Copyright © 2023 - fastn.com
