All issues
Publish amazing content in a unique format.
Cards to share tips and have fun.
Now with all new cards!
Technonomicon
Astro Theme
Free as in beer.
The greatest theme for writing.
- Built around MDX
- Powerful portability
The technonomicon is the book of the devs. This card allows you to author content in unique ways, and remix it across your site using the combined powers of MDX and technomancy.
Play this card command the book of the devs.
Technonomicon
Astro Theme
Free as in beer.
The greatest theme for writing.
- Built around MDX
- Powerful portability
The technonomicon is the book of the devs. This card allows you to author content in unique ways, and remix it across your site using the combined powers of MDX and technomancy.
Play this card command the book of the devs.
These two cards use the same file for content. They simply have a different wrapper. A wrapper which has total control of how the elements are rendered, because of the power of MDX.
Get started making your technonomicon.
Start it up like any other Astro theme.
npm create astro@latest -- --template technomancy-dev/technonomicon
cd ./technomancy
npm run devAfter that you can open up pages/index.astro where you will see we are using collections to get an issue. Issues are the basic building blocks of a technonomicon. They can be treated like pages in a textbook or issues of a newspaper, but we will get into that later. For now just open up the file for the issue and glance through it.
You will notice it is an MDX file that is tying a few things together.
It might do something simple like pull togther two articles and join them with a title for the issue.
The Technonomicon is an Astro Theme for getting weird.
Whether it be a curse, blog, tabloid, manga, if you want to write a lot of content and publish it on the web the technonomicon is the way to do it.
Somewhere along the way we all agreed a blog should look one particular way. This* (largely because of the popularity of wordpress) caused all of the web to take a similar shape. And that way kindof sucks. So I made something else.
Ok, maybe that is a bit dramtic, but I do think it is pretty cool, and it was inspired by various forms of print media, and early ideas about how the internet should work.
Because of this is has a large focus on text, and how ideas connect to each other.
This is a Digital Garden, so you will need some gardening tools.
What is an issue.
Issues are at their core a collection of things. These can be articles links to other parts of the web. Images, Data Visualizations and much more.
They are meant to tie things together in a consumable package.
If you are making a course, the course could be made of issues, which represent topics.
The issues bring together many lessons into articles.
There are components made for rendering articles in an issue. Like the <MarkdownSnippet/> component.
This component is used when you want to render the article directly, instead of just linking to it, or cutting an excerpt.
import { getEntry } from "astro:content";
import ArticleTeaser from "../../components/ArticleTeaser.astro";
export const article = await getEntry(
"articles",
"article",
);
<ArticleTeaser
markdown={article}
components={{
{/* Components to override or add */}
}}
cta="Read more about getting started"
/>What is an article.
Articles are the topics that warrant their own page, but likely will also end up (at least partially) shown in an issue.
Articles have access to some special tricks that make them easier to render inside an issue. One example of this is the <More/> component.
You can use <More/> to add things that should show in the article but be hidden when rendered elsewhere.
<More>
Stuff that should be shown in the full article, but not in an issue.
</More>