urbit/developers.urbit.org
1
1
Fork 0
mirror of https://github.com/urbit/developers.urbit.org.git synced 2024-08-17 01:30:31 +03:00
Code Issues Packages Projects Releases Wiki Activity

pages/guides: generate additional guide cards from metadata

Browse Source
This commit is contained in:
Matilde Park 2022-11-22 13:48:40 -08:00
parent a9feda22f5
commit 0c140f4152
1 changed files with 27 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
pages/guides/[[...slug]].js
View File

@ -27,6 +27,7 @@ import AppIcon from "../../components/icons/TallCard/app";
import FullStackIcon from "../../components/icons/TallCard/full";
import guidesTree from "../../cache/guides.json";
import { join } from "path";
import { pair } from '../../lib/util';
export default function GuidePage({
search,
@ -38,7 +39,7 @@ export default function GuidePage({
nextPost,
}) {
if (!params.slug) {
return <Landing search={search} />;
return <Landing search={search} posts={posts} />;
}
return (
<>
@ -115,12 +116,22 @@ const breadcrumbs = (posts, paths) => {
return results;
};
function Landing({ search }) {
function Landing({ search, posts }) {
const post = {
title: "Guides",
description:
"Everything you need to know to start building applications on Urbit.",
};
const additionalGuides = pair([
...posts.children.additional.pages,
...Object.entries(posts.children.additional.children)
.filter(([, e]) => e !== "pages").map(([k, v]) => ({ ...v, ...{ slug: k } }))]
.sort((a, b) => {
return a.title.toLowerCase().localeCompare(b.title.toLowerCase())
})
);
return (
<Container>
<Head>
@ -210,94 +221,23 @@ function Landing({ search }) {
</Section>
<Section short>
<h3 className="pt-12">Additional Guides</h3>
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-12">
<CardText
title="Writing Aqua Tests"
text="Learn to write tests with Aqua"
className="basis-1/2"
href="/guides/additional/aqua"
/>
<CardText
title="CLI Apps"
text="Learn to build command line applications"
className="basis-1/2"
href="/guides/additional/cli-tutorial"
/>
</div>
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-6">
<CardText
title="Using the HTTP API"
text="Learn how to interact with ships through Eyre’s web API"
className="basis-1/2"
href="/guides/additional/http-api-guide"
/>
<CardText
title="Working with JSON"
text="Learn how to handle this common data standard in Urbit"
className="basis-1/2"
href="/guides/additional/json-guide"
/>
</div>
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-6">
<CardText
title="Parsing"
text="Learn to parse text with Hoon"
className="basis-1/2"
href="/guides/additional/parsing"
/>
<CardText
title="Sail: HTML in Hoon"
text="Learn the basics of Sail"
className="basis-1/2"
href="/guides/additional/sail"
/>
</div>
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-6">
<CardText
title="Distributing Software"
text="Learn to publish a desk that others can install"
className="basis-1/2"
href="/guides/additional/software-distribution"
/>
<CardText
title="Working with Strings"
text="Learn about Hoon’s two main string types"
className="basis-1/2"
href="/guides/additional/strings"
/>
</div>
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-6">
<CardText
title="Writing Unit Tests"
text="Learn to write unit tests in Hoon"
className="basis-1/2"
href="/guides/additional/unit-tests"
/>
<CardText
title="Threads"
text="Learn to write asynchronous I/O functions"
className="basis-1/2"
href="/guides/additional/threads/fundamentals"
/>
</div>
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-6">
<CardText
title="Serving a Browser Game"
text="Serve a client-side game from Urbit"
className="basis-1/2"
href="/guides/additional/client"
/>
<div className="basis-1/2" />
</div>
<h3 className="my-12">Additional Guides</h3>
{additionalGuides.map((pair) => {
return <TwoUp>
{pair.map((guide) => {
return <CardText
title={guide.title}
text={guide.description}
className="basis-1/2"
href={`/guides/additional/${guide.slug}`}
/>
})}
</TwoUp>
})}
</Section>
</SingleColumn>
<Footer />
</Container >
</Container>
);
}