2021-09-30 16:23:38 +03:00
|
|
|
|
import Head from "next/head";
|
2022-06-22 03:49:31 +03:00
|
|
|
|
import Header from "../components/Header";
|
|
|
|
|
|
import Footer from "../components/Footer";
|
2022-06-28 01:01:14 +03:00
|
|
|
|
import BlogPreview from "../components/BlogPreview";
|
|
|
|
|
|
import EventPreview from "../components/EventPreview";
|
2022-06-23 07:01:56 +03:00
|
|
|
|
import {
|
|
|
|
|
|
Container,
|
|
|
|
|
|
SingleColumn,
|
|
|
|
|
|
Section,
|
|
|
|
|
|
TwoUp,
|
|
|
|
|
|
} from "foundation-design-system";
|
2021-10-01 19:51:50 +03:00
|
|
|
|
import Link from "next/link";
|
2022-06-22 03:49:31 +03:00
|
|
|
|
import {
|
|
|
|
|
|
Comms,
|
2022-07-15 22:04:22 +03:00
|
|
|
|
Ringsig,
|
2022-06-22 03:49:31 +03:00
|
|
|
|
Database,
|
|
|
|
|
|
Distribution,
|
2022-06-28 00:26:35 +03:00
|
|
|
|
Functional,
|
2022-06-22 03:49:31 +03:00
|
|
|
|
Identity,
|
|
|
|
|
|
Interface,
|
|
|
|
|
|
MintFiller,
|
|
|
|
|
|
Peer,
|
|
|
|
|
|
} from "../components/icons";
|
|
|
|
|
|
import Card from "../components/Card";
|
|
|
|
|
|
import TallCard from "../components/TallCard";
|
2022-06-28 01:01:14 +03:00
|
|
|
|
import { getAllPosts, getAllEvents } from "../lib/lib";
|
|
|
|
|
|
import { eventKeys } from "../lib/constants";
|
|
|
|
|
|
import { DateTime } from "luxon";
|
2022-07-05 22:08:39 +03:00
|
|
|
|
import { formatDate, generateDisplayDate } from "../lib/lib";
|
2021-09-30 16:10:31 +03:00
|
|
|
|
|
2022-06-28 01:01:14 +03:00
|
|
|
|
export default function Home({ search, whatsNew }) {
|
2021-09-30 16:10:31 +03:00
|
|
|
|
return (
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<div>
|
2021-09-30 16:10:31 +03:00
|
|
|
|
<Head>
|
2021-09-30 16:23:38 +03:00
|
|
|
|
<title>Urbit Developers</title>
|
2021-09-30 16:10:31 +03:00
|
|
|
|
</Head>
|
2021-10-01 19:19:03 +03:00
|
|
|
|
<Container>
|
2022-06-23 10:55:08 +03:00
|
|
|
|
<Header search={search} />
|
2021-10-01 19:19:03 +03:00
|
|
|
|
<SingleColumn>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Section className="pb-72">
|
|
|
|
|
|
{/* Hero statement */}
|
|
|
|
|
|
<div className="flex flex-col space-y-4">
|
|
|
|
|
|
<h1 className="max-w-prose">
|
2022-06-28 00:30:17 +03:00
|
|
|
|
Discover the creative possibilities of a unified operating
|
|
|
|
|
|
system
|
2022-06-22 03:49:31 +03:00
|
|
|
|
</h1>
|
2022-06-28 19:53:52 +03:00
|
|
|
|
<div className="flex flex-col md:flex-row space-y-4 md:space-y-0 md:space-x-4 pt-4">
|
2022-06-30 02:19:10 +03:00
|
|
|
|
<Link href="/guides/quickstart/chat-guide" passHref>
|
2022-06-28 00:26:35 +03:00
|
|
|
|
<a className="button-lg bg-green-400 text-white">
|
|
|
|
|
|
Quickstart
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Link href="/overview" passHref>
|
2022-06-28 00:26:35 +03:00
|
|
|
|
<a className="button-lg bg-blue-400 text-white">
|
2022-06-22 03:49:31 +03:00
|
|
|
|
Read the Overview
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
2022-06-30 03:06:48 +03:00
|
|
|
|
<Link href="/guides" passHref>
|
2022-06-28 00:26:35 +03:00
|
|
|
|
<a className="button-lg bg-white border-wall-500 border-2">
|
2022-06-22 03:49:31 +03:00
|
|
|
|
Learn the Stack
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</Section>
|
2021-10-02 19:23:45 +03:00
|
|
|
|
<Section short>
|
2022-06-28 00:26:35 +03:00
|
|
|
|
<h2 className="font-normal">
|
|
|
|
|
|
Urbit provides{" "}
|
|
|
|
|
|
<span className="font-bold">foundational primitives</span> at the
|
|
|
|
|
|
operating system layer, serving as a better platform for building{" "}
|
|
|
|
|
|
<span className="font-bold">
|
|
|
|
|
|
networked, decentralized applications
|
|
|
|
|
|
</span>
|
|
|
|
|
|
.
|
2022-06-22 03:49:31 +03:00
|
|
|
|
</h2>
|
|
|
|
|
|
<div className="flex flex-wrap pt-12">
|
|
|
|
|
|
{pitch.map((each) => {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div
|
|
|
|
|
|
key={each.title}
|
2022-06-22 21:06:14 +03:00
|
|
|
|
className="basis-full md:basis-1/2 xl:basis-1/3 flex space-x-2 justify-start items-start my-8 pr-8"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
>
|
|
|
|
|
|
{each.icon}
|
|
|
|
|
|
<div className="flex flex-col">
|
|
|
|
|
|
<p className="font-bold text-sm">{each.title}</p>
|
|
|
|
|
|
<p className="text-sm">{each.content}</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
);
|
|
|
|
|
|
})}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div className="pt-12">
|
2021-10-01 19:19:03 +03:00
|
|
|
|
<p>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
Thanks to this architecture, you can take software into
|
|
|
|
|
|
production within weeks rather than months. Check out our
|
|
|
|
|
|
Lightning Tutorials below to jump right in and build an app in
|
|
|
|
|
|
15 minutes.
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</Section>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Section>
|
|
|
|
|
|
<h2 className="pt-12">Quickstart: Lightning Tutorials</h2>
|
2022-06-23 07:01:56 +03:00
|
|
|
|
<div className="flex flex-col space-y-8 md:space-y-0 md:flex-row md:space-x-8 pt-12">
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Card
|
|
|
|
|
|
icon={<Comms />}
|
|
|
|
|
|
title="Encrypted Chat Application"
|
|
|
|
|
|
text="Build your own secure comms tool"
|
|
|
|
|
|
className="basis-1/2"
|
2022-06-29 02:19:40 +03:00
|
|
|
|
href="/guides/quickstart/chat-guide"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
/>
|
2022-07-15 13:27:24 +03:00
|
|
|
|
<Card
|
2022-07-15 22:04:22 +03:00
|
|
|
|
icon={<Ringsig />}
|
2022-07-15 13:27:24 +03:00
|
|
|
|
title="Ring Signature Voting App"
|
|
|
|
|
|
text="Build an anonymous voting app for groups"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
className="basis-1/2"
|
2022-07-15 13:27:24 +03:00
|
|
|
|
href="/guides/quickstart/voting-guide"
|
|
|
|
|
|
/>
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</div>
|
|
|
|
|
|
</Section>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Section className="flex flex-col space-y-12">
|
|
|
|
|
|
<h2>Guides</h2>
|
|
|
|
|
|
<p className="text-lg">
|
|
|
|
|
|
Learn the foundations of software development on Urbit with our
|
|
|
|
|
|
core curriculum of guides.
|
|
|
|
|
|
</p>
|
2022-06-23 07:01:56 +03:00
|
|
|
|
<TwoUp>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<TallCard
|
|
|
|
|
|
title="Hoon School"
|
|
|
|
|
|
description="Learn the fundamentals of the Hoon programming language"
|
|
|
|
|
|
callout="View Guide"
|
2022-06-29 02:19:40 +03:00
|
|
|
|
href="/guides/core/hoon-school"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
image="/images/hoon.svg"
|
2022-06-23 07:01:56 +03:00
|
|
|
|
className="h-full"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
/>
|
|
|
|
|
|
<TallCard
|
|
|
|
|
|
title="App School"
|
|
|
|
|
|
description="Learn how to build Urbit userspace applications by writing your own Gall agents"
|
|
|
|
|
|
callout="View Guide"
|
2022-06-29 02:19:40 +03:00
|
|
|
|
href="/guides/core/app-school"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
image="/images/app.svg"
|
2022-06-23 07:01:56 +03:00
|
|
|
|
className="h-full"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
/>
|
2022-06-23 07:01:56 +03:00
|
|
|
|
</TwoUp>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Link href="/guides" passHref>
|
|
|
|
|
|
<a className="button-lg bg-wall-600 text-white w-fit">
|
|
|
|
|
|
View All Guides
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
|
|
|
|
|
</Section>
|
|
|
|
|
|
<Section className="flex flex-col space-y-12">
|
|
|
|
|
|
<h2>Courses</h2>
|
|
|
|
|
|
<p className="text-lg">
|
|
|
|
|
|
Want an interactive experience to truly learn software development
|
|
|
|
|
|
on Urbit? Join the next cohort for Hoon or App School Live and
|
|
|
|
|
|
learn with a group.
|
|
|
|
|
|
</p>
|
|
|
|
|
|
<Link href="/courses" passHref>
|
|
|
|
|
|
<a className="button-lg bg-green-400 text-white w-fit">
|
|
|
|
|
|
View Courses
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
|
|
|
|
|
</Section>
|
|
|
|
|
|
<Section className="flex flex-col space-y-8">
|
|
|
|
|
|
<h2>Community</h2>
|
|
|
|
|
|
<p className="text-lg">
|
|
|
|
|
|
The developer community is friendly, helpful, and organized from
|
|
|
|
|
|
within Urbit itself.
|
|
|
|
|
|
</p>
|
2022-06-30 03:06:48 +03:00
|
|
|
|
<div className="flex flex-col space-y-4 md:space-y-0 md:flex-row md:space-x-4 pb-4">
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Card
|
2022-06-30 03:06:48 +03:00
|
|
|
|
title="Developer Events"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
text="We regularly host livestreams, meetups, and hackathons"
|
2022-06-30 03:06:48 +03:00
|
|
|
|
href="/community/events"
|
2022-06-22 03:49:31 +03:00
|
|
|
|
callout="View Events"
|
|
|
|
|
|
className="basis-1/2"
|
|
|
|
|
|
/>
|
|
|
|
|
|
<Card
|
|
|
|
|
|
title="Opportunities"
|
|
|
|
|
|
text="Urbit is growing and there are many opportunities to find a job, grant, or funding for your great idea"
|
|
|
|
|
|
href="/community/opportunities"
|
|
|
|
|
|
callout="Explore Opportunities"
|
|
|
|
|
|
className="basis-1/2"
|
|
|
|
|
|
/>
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</div>
|
2022-06-30 03:06:48 +03:00
|
|
|
|
|
|
|
|
|
|
<Link href="/community" passHref>
|
|
|
|
|
|
<a className="button-lg bg-wall-600 text-white w-fit">
|
|
|
|
|
|
Community Pages
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</Section>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Section className="flex flex-col space-y-8">
|
|
|
|
|
|
<h2>What's New</h2>
|
2022-06-28 01:01:14 +03:00
|
|
|
|
<TwoUp>
|
|
|
|
|
|
{whatsNew.slice(0, 2).map((e) => {
|
|
|
|
|
|
if (e.type === "event") {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<EventPreview event={e} className="basis-1/2 h-full" />
|
|
|
|
|
|
);
|
|
|
|
|
|
} else if (e.type === "blog") {
|
2022-07-02 00:43:54 +03:00
|
|
|
|
const date = generateDisplayDate(e.date);
|
2022-06-28 01:01:14 +03:00
|
|
|
|
return (
|
|
|
|
|
|
<Link href={`/blog/${e.slug}`}>
|
|
|
|
|
|
<div className="cursor-pointer bg-wall-100 rounded-xl basis-1/2 h-full">
|
|
|
|
|
|
<div className="flex flex-col p-6 justify-between items-between h-full relative">
|
|
|
|
|
|
<img
|
|
|
|
|
|
className="rounded-xl w-full flex-1 object-cover"
|
|
|
|
|
|
src={e.extra.image}
|
2022-07-02 00:43:54 +03:00
|
|
|
|
style={{ aspectRatio: "4 / 3" }}
|
2022-06-28 01:01:14 +03:00
|
|
|
|
/>
|
|
|
|
|
|
<div className="grow-1 shrink-0 flex flex-col h-full min-h-0 pt-4">
|
|
|
|
|
|
<h3 className="mb-2">{e.title}</h3>
|
2022-07-05 22:08:39 +03:00
|
|
|
|
<p className="text-sm">
|
|
|
|
|
|
{e.extra.author ? (
|
|
|
|
|
|
<span className="type-sub-bold mr-2">
|
|
|
|
|
|
{e.extra.author}
|
|
|
|
|
|
</span>
|
|
|
|
|
|
) : null}
|
|
|
|
|
|
{e.extra.ship ? (
|
|
|
|
|
|
<Link
|
|
|
|
|
|
href={`https://urbit.org/ids/${e.extra.ship}`}
|
|
|
|
|
|
passHref
|
|
|
|
|
|
>
|
|
|
|
|
|
<a className="type-sub-bold text-wall-500 font-mono">
|
|
|
|
|
|
{e.extra.ship}
|
|
|
|
|
|
</a>
|
|
|
|
|
|
</Link>
|
|
|
|
|
|
) : null}
|
|
|
|
|
|
</p>
|
|
|
|
|
|
<p className="text-wall-500 type-sub shrink-0">
|
|
|
|
|
|
{formatDate(date)}
|
|
|
|
|
|
</p>
|
2022-06-28 01:01:14 +03:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</Link>
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
|
|
|
|
|
})}
|
|
|
|
|
|
</TwoUp>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
</Section>
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</SingleColumn>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
<Footer />
|
2021-10-01 19:19:03 +03:00
|
|
|
|
</Container>
|
2022-06-22 03:49:31 +03:00
|
|
|
|
</div>
|
2021-09-30 16:23:38 +03:00
|
|
|
|
);
|
2021-09-30 16:10:31 +03:00
|
|
|
|
}
|
2022-06-22 03:49:31 +03:00
|
|
|
|
|
|
|
|
|
|
const pitch = [
|
|
|
|
|
|
{
|
|
|
|
|
|
icon: <Identity className="shrink-0" />,
|
|
|
|
|
|
title: "Identity",
|
2022-06-28 00:26:35 +03:00
|
|
|
|
content:
|
2022-06-30 03:06:48 +03:00
|
|
|
|
"Identity is built-in at the lowest level of the stack – say goodbye to auth systems.",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
},
|
|
|
|
|
|
{
|
2022-06-28 00:26:35 +03:00
|
|
|
|
icon: <Functional className="shrink-0" />,
|
|
|
|
|
|
title: "Functional Network",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
content:
|
2022-06-28 00:26:35 +03:00
|
|
|
|
"Immutable, functional programming across the entire OS and network",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
icon: <Database className="shrink-0" />,
|
2022-06-28 00:26:35 +03:00
|
|
|
|
title: "Built-in Database",
|
2022-06-30 03:06:48 +03:00
|
|
|
|
content: "Every piece of state in your application is persistent, always",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
icon: <Peer className="shrink-0" />,
|
|
|
|
|
|
title: "Peer-to-Peer Applications",
|
2022-06-28 00:26:35 +03:00
|
|
|
|
content: "Urbit makes robust peer-to-peer applications easy to build",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
icon: <Distribution className="shrink-0" />,
|
|
|
|
|
|
title: "Open Distribution",
|
2022-06-28 00:26:35 +03:00
|
|
|
|
content:
|
|
|
|
|
|
"Distribute software directly to users — you are your own app store",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
icon: <Interface className="shrink-0" />,
|
|
|
|
|
|
title: "Web Interfaces",
|
2022-06-28 00:26:35 +03:00
|
|
|
|
content:
|
|
|
|
|
|
"Urbit applications can be built on any interface framework, including the web",
|
2022-06-22 03:49:31 +03:00
|
|
|
|
},
|
|
|
|
|
|
];
|
2022-06-28 01:01:14 +03:00
|
|
|
|
|
|
|
|
|
|
export async function getStaticProps() {
|
|
|
|
|
|
const posts = getAllPosts(
|
|
|
|
|
|
["title", "slug", "date", "description", "extra"],
|
|
|
|
|
|
"blog",
|
|
|
|
|
|
"date"
|
|
|
|
|
|
).map((e) => ({ ...e, type: "blog" }));
|
|
|
|
|
|
const events = getAllEvents(eventKeys, "community/events").map((e) => ({
|
|
|
|
|
|
...e,
|
|
|
|
|
|
type: "event",
|
|
|
|
|
|
}));
|
|
|
|
|
|
const whatsNew = [...posts, ...events].sort((a, b) => {
|
|
|
|
|
|
return DateTime.fromISO(a.date || a.ends) >
|
|
|
|
|
|
DateTime.fromISO(b.date || b.ends)
|
|
|
|
|
|
? -1
|
|
|
|
|
|
: 1;
|
|
|
|
|
|
});
|
|
|
|
|
|
return {
|
|
|
|
|
|
props: {
|
|
|
|
|
|
whatsNew,
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
}
|
