mirror of
https://github.com/urbit/developers.urbit.org.git
synced 2024-07-14 17:10:37 +03:00
pulling in data from toml in courses, using image tags for svgs, adding next session on tall cards
This commit is contained in:
parent
60dbb5ac65
commit
1070098198
@ -6,23 +6,27 @@ export default function TallCard({
|
||||
description,
|
||||
callout,
|
||||
href,
|
||||
next_cohort,
|
||||
cohort,
|
||||
className = ""
|
||||
}) {
|
||||
return <div className={"h-full flex flex-col min-h-0 " + className}>
|
||||
<div key={title} className="bg-wall-100 rounded-xl h-full">
|
||||
<div className="flex flex-col space-y-4 p-6 justify-between items-start lg:items-center relative">
|
||||
<div className="rounded-lg w-full">
|
||||
{image({ className: "w-full h-full" })}
|
||||
<Link href={href}>
|
||||
<div key={title} className="cursor-pointer bg-wall-100 rounded-xl h-full">
|
||||
<div className="flex flex-col space-y-4 p-6 justify-between items-start lg:items-center relative">
|
||||
<div className="rounded-lg w-full">
|
||||
<img src={image} className="w-full h-full"></img>
|
||||
</div>
|
||||
<div className="flex flex-col space-y-2">
|
||||
<h3>{title}</h3>
|
||||
{cohort &&
|
||||
<p className="text-sm"><span className="font-semibold">Next Session:</span> {cohort}</p>
|
||||
}
|
||||
|
||||
<p className="text-sm">{description}</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col space-y-2">
|
||||
<h3>{title}</h3>
|
||||
<p className="text-sm">{description}</p>
|
||||
</div>
|
||||
<Link href={href}>
|
||||
<a className="button-sm bg-green-400 text-white text-sm w-fit self-start ph-8">{callout}</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
}
|
||||
|
@ -1,7 +1,10 @@
|
||||
+++
|
||||
title = "App School Live"
|
||||
weight = 6
|
||||
next_cohort = "January 23, 2023"
|
||||
date = "2023-05-01"
|
||||
weight = 90
|
||||
next_cohort = "May 2023"
|
||||
image = "https://storage.googleapis.com/media.urbit.org/developers/images/app-school-live.svg"
|
||||
description = "App School focuses on how to build a backend Gall agent, then on connecting it to a React-based front-end. When you're done, you'll be able to produce and distribute your own Urbit apps."
|
||||
+++
|
||||
|
||||
The Urbit Foundation offers cohort classes to cover the [App
|
||||
|
@ -1,8 +1,9 @@
|
||||
+++
|
||||
title = "App Workshop Live"
|
||||
weight = 15
|
||||
weight = 30
|
||||
next_cohort = "Late 2023"
|
||||
|
||||
image = "https://storage.googleapis.com/media.urbit.org/developers/images/app-workshop-live.svg"
|
||||
description = "App Workshop will serve as a hands-on intensive course to build high-quality Urbit apps ready for end users. It serves as a follow-on to App School with more focus on building complex apps."
|
||||
+++
|
||||
|
||||
App Workshop will serve as a hands-on intensive course to build
|
||||
|
@ -1,7 +1,9 @@
|
||||
+++
|
||||
title = "Core School Live"
|
||||
weight = 20
|
||||
weight = 10
|
||||
next_cohort = "Late Summer 2023"
|
||||
image = "https://storage.googleapis.com/media.urbit.org/developers/images/core-school-live.svg"
|
||||
description = "Core School prepares experienced Hoon developers to work on the Arvo kernel, the Vere or New Mars runtime, and otherwise build the platform as a senior developer."
|
||||
+++
|
||||
|
||||
The Urbit Foundation will offer a cohort classes to train new core developers.
|
||||
|
@ -1,7 +1,9 @@
|
||||
+++
|
||||
title = "Hoon School Live"
|
||||
weight = 10
|
||||
weight = 100
|
||||
next_cohort = "March 20, 2023"
|
||||
image = "https://storage.googleapis.com/media.urbit.org/developers/images/hoon-school-live.svg"
|
||||
description = "Hoon School Live teaches the fundamentals of Hoon with a hands-on instructor, regular exercises and discussions, and a completion certification."
|
||||
+++
|
||||
|
||||
Periodically, the Urbit Foundation has offered synchronous cohort classes which
|
||||
|
@ -5,58 +5,20 @@ import {
|
||||
SingleColumn,
|
||||
Section,
|
||||
TwoUp,
|
||||
getAllPosts
|
||||
} from "@urbit/foundation-design-system";
|
||||
import Header from "../components/Header";
|
||||
import Footer from "../components/Footer";
|
||||
import TallCard from "../components/TallCard";
|
||||
import AppSchoolLive from "../components/icons/TallCard/appSchoolLive"
|
||||
import HoonSchoolLive from "../components/icons/TallCard/hoonSchoolLive";
|
||||
import AppWorkshopLive from "../components/icons/TallCard/appWorkshopLive";
|
||||
import CoreSchoolLive from "../components/icons/TallCard/coreSchoolLive";
|
||||
|
||||
import { pair } from "../lib/util";
|
||||
|
||||
export default function Courses({ search }) {
|
||||
export default function Courses({ search, courses }) {
|
||||
const post = {
|
||||
title: "Courses",
|
||||
description: "Join the next session of Hoon School or App School.",
|
||||
};
|
||||
|
||||
// We can't just import this information from the content folder,
|
||||
// because it uses svg icons for the cards that need to be imported
|
||||
// as React components, so they can be detected by Tailwind and
|
||||
// restyled for light and dark modes.
|
||||
//
|
||||
// The icon components need to be imported, so they can't
|
||||
// just be declared as TOML metadata, either.
|
||||
|
||||
const courses = [
|
||||
{
|
||||
title: "Hoon School Live",
|
||||
description: "Hoon School Live teaches the fundamentals of Hoon with a hands-on instructor, regular exercises and discussions, and a completion certification.",
|
||||
slug: 'hsl',
|
||||
icon: HoonSchoolLive
|
||||
},
|
||||
{
|
||||
title: "App School Live",
|
||||
description: "App School focuses on how to build a backend Gall agent, then on connecting it to a React-based front-end. When you're done, you'll be able to produce and distribute your own Urbit apps.",
|
||||
slug: 'asl',
|
||||
icon: AppSchoolLive
|
||||
},
|
||||
{
|
||||
title: "App Workshop Live",
|
||||
description: "App Workshop will serve as a hands-on intensive course to build high-quality Urbit apps ready for end users. It serves as a follow-on to App School with more focus on building complex apps.",
|
||||
slug: 'awl',
|
||||
icon: AppWorkshopLive
|
||||
},
|
||||
{
|
||||
title: "Core School Live",
|
||||
description: "Core School prepares experienced Hoon developers to work on the Arvo kernel, the Vere or New Mars runtime, and otherwise build the platform as a senior developer.",
|
||||
slug: 'csl',
|
||||
icon: CoreSchoolLive
|
||||
}
|
||||
]
|
||||
|
||||
const pairedCourses = pair(courses);
|
||||
|
||||
return (
|
||||
@ -79,10 +41,10 @@ export default function Courses({ search }) {
|
||||
<TallCard
|
||||
title={course.title}
|
||||
description={course.description}
|
||||
callout="Learn More"
|
||||
href={`/courses/${course.slug}`}
|
||||
image={course.icon}
|
||||
image={course.image}
|
||||
className="h-full"
|
||||
cohort={course.next_cohort}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
@ -94,3 +56,15 @@ export default function Courses({ search }) {
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
||||
export async function getStaticProps() {
|
||||
const courses = getAllPosts(
|
||||
["title", "slug", "next_cohort", "weight", "image", "description"],
|
||||
"courses","weight"
|
||||
);
|
||||
|
||||
return {
|
||||
props: { courses },
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -21,10 +21,6 @@ import {
|
||||
getNextPost,
|
||||
} from "@urbit/foundation-design-system";
|
||||
import { Comms, Ringsig, Squad } from "../../components/icons";
|
||||
import HoonIcon from "../../components/icons/TallCard/hoon";
|
||||
import EnvironmentIcon from "../../components/icons/TallCard/env";
|
||||
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';
|
||||
@ -187,7 +183,7 @@ function Landing({ search, posts }) {
|
||||
description="Learn how to get your urbit development environment configured"
|
||||
callout="View Guide"
|
||||
href="/guides/core/environment"
|
||||
image={EnvironmentIcon}
|
||||
image="https://storage.googleapis.com/media.urbit.org/developers/images/environment.svg"
|
||||
className="h-full"
|
||||
/>
|
||||
<TallCard
|
||||
@ -195,7 +191,7 @@ function Landing({ search, posts }) {
|
||||
description="Learn the fundamentals of the Hoon programming language"
|
||||
callout="View Guide"
|
||||
href="/guides/core/hoon-school"
|
||||
image={HoonIcon}
|
||||
image="https://storage.googleapis.com/media.urbit.org/developers/images/hoon-school.svg"
|
||||
className="h-full"
|
||||
/>
|
||||
</TwoUp>
|
||||
@ -205,7 +201,7 @@ function Landing({ search, posts }) {
|
||||
description="Learn how to build Urbit userspace applications by writing your own Gall agents"
|
||||
callout="View Guide"
|
||||
href="/guides/core/app-school"
|
||||
image={AppIcon}
|
||||
image="https://storage.googleapis.com/media.urbit.org/developers/images/app-school.svg"
|
||||
className="h-full"
|
||||
/>
|
||||
<TallCard
|
||||
@ -213,7 +209,7 @@ function Landing({ search, posts }) {
|
||||
description="Learn how to create Gall agents and integrate them into a React front-end"
|
||||
callout="View Guide"
|
||||
href="/guides/core/app-school-full-stack"
|
||||
image={FullStackIcon}
|
||||
image="https://storage.googleapis.com/media.urbit.org/developers/images/app-school-fullstack.svg"
|
||||
className="h-full"
|
||||
/>
|
||||
</TwoUp>
|
||||
|
@ -158,7 +158,7 @@ export default function Home({ search, posts, highlights }) {
|
||||
description="Learn the fundamentals of the Hoon programming language"
|
||||
callout="View Guide"
|
||||
href="/guides/core/hoon-school"
|
||||
image={HoonIcon}
|
||||
image="https://storage.googleapis.com/media.urbit.org/developers/images/hoon-school.svg"
|
||||
className="h-full"
|
||||
/>
|
||||
<TallCard
|
||||
@ -166,7 +166,7 @@ export default function Home({ search, posts, highlights }) {
|
||||
description="Learn how to build Urbit userspace applications by writing your own Gall agents"
|
||||
callout="View Guide"
|
||||
href="/guides/core/app-school"
|
||||
image={AppIcon}
|
||||
image="https://storage.googleapis.com/media.urbit.org/developers/images/app-school.svg"
|
||||
className="h-full"
|
||||
/>
|
||||
</TwoUp>
|
||||
|
Loading…
Reference in New Issue
Block a user