mirror of
https://github.com/prdlk/website.git
synced 2026-08-03 01:41:53 +00:00
init: add project files
This commit is contained in:
Prad Nukala
@@ -0,0 +1,91 @@
|
||||
import { ArticleLayout } from '@/components/ArticleLayout'
|
||||
import Image from 'next/image'
|
||||
import designSystem from './planetaria-design-system.png'
|
||||
|
||||
export const article = {
|
||||
author: 'Adam Wathan',
|
||||
date: '2022-09-05',
|
||||
title: 'Crafting a design system for a multiplanetary future',
|
||||
description:
|
||||
'Most companies try to stay ahead of the curve when it comes to visual design, but for Planetaria we needed to create a brand that would still inspire us 100 years from now when humanity has spread across our entire solar system.',
|
||||
}
|
||||
|
||||
export const metadata = {
|
||||
title: article.title,
|
||||
description: article.description,
|
||||
}
|
||||
|
||||
export default (props) => <ArticleLayout article={article} {...props} />
|
||||
|
||||
Most companies try to stay ahead of the curve when it comes to visual design, but for Planetaria we needed to create a brand that would still inspire us 100 years from now when humanity has spread across our entire solar system.
|
||||
|
||||
<Image src={designSystem} alt="" />
|
||||
|
||||
I knew that to get it right I was going to have to replicate the viewing conditions of someone from the future, so I grabbed my space helmet from the closet, created a new Figma document, and got to work.
|
||||
|
||||
## Sermone fata
|
||||
|
||||
Lorem markdownum, bracchia in redibam! Terque unda puppi nec, linguae posterior
|
||||
in utraque respicere candidus Mimasque formae; quae conantem cervice. Parcite
|
||||
variatus, redolentia adeunt. Tyrioque dies, naufraga sua adit partibus celanda
|
||||
torquere temptata, erit maneat et ramos, [iam](#) ait dominari
|
||||
potitus! Tibi litora matremque fumantia condi radicibus opusque.
|
||||
|
||||
Deus feram verumque, fecit, ira tamen, terras per alienae victum. Mutantur
|
||||
levitate quas ubi arcum ripas oculos abest. Adest [commissaque
|
||||
victae](#) in gemitus nectareis ire diva
|
||||
dotibus ora, et findi huic invenit; fatis? Fractaque dare superinposita
|
||||
nimiumque simulatoremque sanguine, at voce aestibus diu! Quid veterum hausit tu
|
||||
nil utinam paternos ima, commentaque.
|
||||
|
||||
```c
|
||||
exbibyte_wins = gigahertz(3);
|
||||
grayscaleUtilityClient = control_uat;
|
||||
pcmciaHibernate = oop_virus_console(text_mountain);
|
||||
if (stateWaisFirewire >= -2) {
|
||||
jfs = 647065 / ldapVrml(tutorialRestore, 85);
|
||||
metal_runtime_parse = roomComputingResolution - toolbarUpload +
|
||||
ipx_nvram_open;
|
||||
} else {
|
||||
maximizeSidebar *= suffix_url(flatbed + 2, requirements_encoding_node +
|
||||
only_qbe_media, minicomputer);
|
||||
}
|
||||
```
|
||||
|
||||
Aere repetiti cognataque natus. Habebat vela solutis saepe munus nondum adhuc
|
||||
oscula nomina pignora corpus deserat.
|
||||
|
||||
## Lethaei Pindumve me quae dinumerat Pavor
|
||||
|
||||
Idem se saxa fata pollentibus geminos; quos pedibus. Est urnis Herses omnes nec
|
||||
divite: et ille illa furit sim verbis Cyllenius.
|
||||
|
||||
1. Captus inpleverunt collo
|
||||
2. Nec nam placebant
|
||||
3. Siquos vulgus
|
||||
4. Dictis carissime fugae
|
||||
5. A tacitos nulla viginti
|
||||
|
||||
Ungues fistula annoso, ille addit linoque motatque uberior verso
|
||||
[rubuerunt](#) confine desuetaque. _Sanguine_ anteit
|
||||
emerguntque expugnacior est pennas iniqui ecce **haeret** genus: peiora imagine
|
||||
fossas Cephisos formosa! Refugitque amata [refelli](#)
|
||||
supplex. Summa brevis vetuere tenebas, hostes vetantis, suppressit, arreptum
|
||||
regna. Postquam conpescit iuvenis habet corpus, et erratica, perdere, tot mota
|
||||
ars talis.
|
||||
|
||||
```c
|
||||
digital.webcam_dual_frequency = webmasterMms;
|
||||
if (5 + language_standalone_google) {
|
||||
cc_inbox_layout *= file_character;
|
||||
task += p;
|
||||
lockUnicode += enterprise_monochrome(tokenFunctionPersonal, keyVirtual,
|
||||
adf);
|
||||
}
|
||||
windows_binary_esports(87734, array(restoreRomTopology, adRaw(407314),
|
||||
dongleBashThumbnail), interpreter);
|
||||
```
|
||||
|
||||
Sit volat naturam; motu Cancri. Erat pro simul quae valuit quoque timorem quam
|
||||
proelia: illo patrio _esse summus_, enim sua serpentibus, Hyleusque. Est coniuge
|
||||
recuso; refert Coroniden ignotos manat, adfectu.
|
||||
BIN
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
@@ -0,0 +1,106 @@
|
||||
import { ArticleLayout } from '@/components/ArticleLayout'
|
||||
|
||||
export const article = {
|
||||
author: 'Adam Wathan',
|
||||
date: '2022-09-02',
|
||||
title: 'Introducing Animaginary: High performance web animations',
|
||||
description:
|
||||
'When you’re building a website for a company as ambitious as Planetaria, you need to make an impression. I wanted people to visit our website and see animations that looked more realistic than reality itself.',
|
||||
}
|
||||
|
||||
export const metadata = {
|
||||
title: article.title,
|
||||
description: article.description,
|
||||
}
|
||||
|
||||
export default (props) => <ArticleLayout article={article} {...props} />
|
||||
|
||||
When you’re building a website for a company as ambitious as Planetaria, you need to make an impression. I wanted people to visit our website and see animations that looked more realistic than reality itself.
|
||||
|
||||
To make this possible, we needed to squeeze every drop of performance out of the browser possible. And so Animaginary was born.
|
||||
|
||||
```js
|
||||
import { animate } from '@planetaria/animaginary'
|
||||
|
||||
export function MyComponent({ open, children }) {
|
||||
return (
|
||||
<animate.div
|
||||
in={open}
|
||||
animateFrom="opacity-0 scale-95"
|
||||
animateTo="opacity-100 scale-100"
|
||||
duration={350}
|
||||
>
|
||||
{children}
|
||||
</animate.div>
|
||||
)
|
||||
}
|
||||
```
|
||||
|
||||
Animaginary is our new web animation library that redefines what you thought was possible on the web. Hand-written in optimized WASM, Animaginary can even animate the `height` property of an element at 60fps.
|
||||
|
||||
## Sermone fata
|
||||
|
||||
Lorem markdownum, bracchia in redibam! Terque unda puppi nec, linguae posterior
|
||||
in utraque respicere candidus Mimasque formae; quae conantem cervice. Parcite
|
||||
variatus, redolentia adeunt. Tyrioque dies, naufraga sua adit partibus celanda
|
||||
torquere temptata, erit maneat et ramos, [iam](#) ait dominari
|
||||
potitus! Tibi litora matremque fumantia condi radicibus opusque.
|
||||
|
||||
Deus feram verumque, fecit, ira tamen, terras per alienae victum. Mutantur
|
||||
levitate quas ubi arcum ripas oculos abest. Adest [commissaque
|
||||
victae](#) in gemitus nectareis ire diva
|
||||
dotibus ora, et findi huic invenit; fatis? Fractaque dare superinposita
|
||||
nimiumque simulatoremque sanguine, at voce aestibus diu! Quid veterum hausit tu
|
||||
nil utinam paternos ima, commentaque.
|
||||
|
||||
```c
|
||||
exbibyte_wins = gigahertz(3);
|
||||
grayscaleUtilityClient = control_uat;
|
||||
pcmciaHibernate = oop_virus_console(text_mountain);
|
||||
if (stateWaisFirewire >= -2) {
|
||||
jfs = 647065 / ldapVrml(tutorialRestore, 85);
|
||||
metal_runtime_parse = roomComputingResolution - toolbarUpload +
|
||||
ipx_nvram_open;
|
||||
} else {
|
||||
maximizeSidebar *= suffix_url(flatbed + 2, requirements_encoding_node +
|
||||
only_qbe_media, minicomputer);
|
||||
}
|
||||
```
|
||||
|
||||
Aere repetiti cognataque natus. Habebat vela solutis saepe munus nondum adhuc
|
||||
oscula nomina pignora corpus deserat.
|
||||
|
||||
## Lethaei Pindumve me quae dinumerat Pavor
|
||||
|
||||
Idem se saxa fata pollentibus geminos; quos pedibus. Est urnis Herses omnes nec
|
||||
divite: et ille illa furit sim verbis Cyllenius.
|
||||
|
||||
1. Captus inpleverunt collo
|
||||
2. Nec nam placebant
|
||||
3. Siquos vulgus
|
||||
4. Dictis carissime fugae
|
||||
5. A tacitos nulla viginti
|
||||
|
||||
Ungues fistula annoso, ille addit linoque motatque uberior verso
|
||||
[rubuerunt](#) confine desuetaque. _Sanguine_ anteit
|
||||
emerguntque expugnacior est pennas iniqui ecce **haeret** genus: peiora imagine
|
||||
fossas Cephisos formosa! Refugitque amata [refelli](#)
|
||||
supplex. Summa brevis vetuere tenebas, hostes vetantis, suppressit, arreptum
|
||||
regna. Postquam conpescit iuvenis habet corpus, et erratica, perdere, tot mota
|
||||
ars talis.
|
||||
|
||||
```c
|
||||
digital.webcam_dual_frequency = webmasterMms;
|
||||
if (5 + language_standalone_google) {
|
||||
cc_inbox_layout *= file_character;
|
||||
task += p;
|
||||
lockUnicode += enterprise_monochrome(tokenFunctionPersonal, keyVirtual,
|
||||
adf);
|
||||
}
|
||||
windows_binary_esports(87734, array(restoreRomTopology, adRaw(407314),
|
||||
dongleBashThumbnail), interpreter);
|
||||
```
|
||||
|
||||
Sit volat naturam; motu Cancri. Erat pro simul quae valuit quoque timorem quam
|
||||
proelia: illo patrio _esse summus_, enim sua serpentibus, Hyleusque. Est coniuge
|
||||
recuso; refert Coroniden ignotos manat, adfectu.
|
||||
@@ -0,0 +1,60 @@
|
||||
import { type Metadata } from 'next'
|
||||
|
||||
import { Card } from '@/components/Card'
|
||||
import { SimpleLayout } from '@/components/SimpleLayout'
|
||||
import { type ArticleWithSlug, getAllArticles } from '@/lib/articles'
|
||||
import { formatDate } from '@/lib/formatDate'
|
||||
|
||||
function Article({ article }: { article: ArticleWithSlug }) {
|
||||
return (
|
||||
<article className="md:grid md:grid-cols-4 md:items-baseline">
|
||||
<Card className="md:col-span-3">
|
||||
<Card.Title href={`/articles/${article.slug}`}>
|
||||
{article.title}
|
||||
</Card.Title>
|
||||
<Card.Eyebrow
|
||||
as="time"
|
||||
dateTime={article.date}
|
||||
className="md:hidden"
|
||||
decorate
|
||||
>
|
||||
{formatDate(article.date)}
|
||||
</Card.Eyebrow>
|
||||
<Card.Description>{article.description}</Card.Description>
|
||||
<Card.Cta>Read article</Card.Cta>
|
||||
</Card>
|
||||
<Card.Eyebrow
|
||||
as="time"
|
||||
dateTime={article.date}
|
||||
className="mt-1 hidden md:block"
|
||||
>
|
||||
{formatDate(article.date)}
|
||||
</Card.Eyebrow>
|
||||
</article>
|
||||
)
|
||||
}
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'Articles',
|
||||
description:
|
||||
'All of my long-form thoughts on programming, leadership, product design, and more, collected in chronological order.',
|
||||
}
|
||||
|
||||
export default async function ArticlesIndex() {
|
||||
let articles = await getAllArticles()
|
||||
|
||||
return (
|
||||
<SimpleLayout
|
||||
title="Writing on software design, company building, and the aerospace industry."
|
||||
intro="All of my long-form thoughts on programming, leadership, product design, and more, collected in chronological order."
|
||||
>
|
||||
<div className="md:border-l md:border-zinc-100 md:pl-6 md:dark:border-zinc-700/40">
|
||||
<div className="flex max-w-3xl flex-col space-y-16">
|
||||
{articles.map((article) => (
|
||||
<Article key={article.slug} article={article} />
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</SimpleLayout>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,101 @@
|
||||
import { ArticleLayout } from '@/components/ArticleLayout'
|
||||
|
||||
export const article = {
|
||||
author: 'Adam Wathan',
|
||||
date: '2022-07-14',
|
||||
title: 'Rewriting the cosmOS kernel in Rust',
|
||||
description:
|
||||
'When we released the first version of cosmOS last year, it was written in Go. Go is a wonderful programming language, but it’s been a while since I’ve seen an article on the front page of Hacker News about rewriting some important tool in Go and I see articles on there about rewriting things in Rust every single week.',
|
||||
}
|
||||
|
||||
export const metadata = {
|
||||
title: article.title,
|
||||
description: article.description,
|
||||
}
|
||||
|
||||
export default (props) => <ArticleLayout article={article} {...props} />
|
||||
|
||||
When we released the first version of cosmOS last year, it was written in Go. Go is a wonderful programming language with a lot of benefits, but it’s been a while since I’ve seen an article on the front page of Hacker News about rewriting some important tool in Go and I see articles on there about rewriting things in Rust every single week.
|
||||
|
||||
```rust
|
||||
use ferris_says::say;
|
||||
use std::io::{stdout, BufWriter};
|
||||
|
||||
fn main() {
|
||||
let stdout = stdout();
|
||||
let message = String::from("Hello fellow hackers");
|
||||
let width = message.chars().count();
|
||||
|
||||
let mut writer = BufWriter::new(stdout.lock());
|
||||
say(message.as_bytes(), width, &mut writer).unwrap();
|
||||
}
|
||||
```
|
||||
|
||||
I derive a large amount of my self-worth from whether or not Hacker News is impressed with the work I'm doing, so when I realized this, I cancelled all of our existing projects and started migrating everything to Rust immediately.
|
||||
|
||||
## Sermone fata
|
||||
|
||||
Lorem markdownum, bracchia in redibam! Terque unda puppi nec, linguae posterior
|
||||
in utraque respicere candidus Mimasque formae; quae conantem cervice. Parcite
|
||||
variatus, redolentia adeunt. Tyrioque dies, naufraga sua adit partibus celanda
|
||||
torquere temptata, erit maneat et ramos, [iam](#) ait dominari
|
||||
potitus! Tibi litora matremque fumantia condi radicibus opusque.
|
||||
|
||||
Deus feram verumque, fecit, ira tamen, terras per alienae victum. Mutantur
|
||||
levitate quas ubi arcum ripas oculos abest. Adest [commissaque
|
||||
victae](#) in gemitus nectareis ire diva
|
||||
dotibus ora, et findi huic invenit; fatis? Fractaque dare superinposita
|
||||
nimiumque simulatoremque sanguine, at voce aestibus diu! Quid veterum hausit tu
|
||||
nil utinam paternos ima, commentaque.
|
||||
|
||||
```c
|
||||
exbibyte_wins = gigahertz(3);
|
||||
grayscaleUtilityClient = control_uat;
|
||||
pcmciaHibernate = oop_virus_console(text_mountain);
|
||||
if (stateWaisFirewire >= -2) {
|
||||
jfs = 647065 / ldapVrml(tutorialRestore, 85);
|
||||
metal_runtime_parse = roomComputingResolution - toolbarUpload +
|
||||
ipx_nvram_open;
|
||||
} else {
|
||||
maximizeSidebar *= suffix_url(flatbed + 2, requirements_encoding_node +
|
||||
only_qbe_media, minicomputer);
|
||||
}
|
||||
```
|
||||
|
||||
Aere repetiti cognataque natus. Habebat vela solutis saepe munus nondum adhuc
|
||||
oscula nomina pignora corpus deserat.
|
||||
|
||||
## Lethaei Pindumve me quae dinumerat Pavor
|
||||
|
||||
Idem se saxa fata pollentibus geminos; quos pedibus. Est urnis Herses omnes nec
|
||||
divite: et ille illa furit sim verbis Cyllenius.
|
||||
|
||||
1. Captus inpleverunt collo
|
||||
2. Nec nam placebant
|
||||
3. Siquos vulgus
|
||||
4. Dictis carissime fugae
|
||||
5. A tacitos nulla viginti
|
||||
|
||||
Ungues fistula annoso, ille addit linoque motatque uberior verso
|
||||
[rubuerunt](#) confine desuetaque. _Sanguine_ anteit
|
||||
emerguntque expugnacior est pennas iniqui ecce **haeret** genus: peiora imagine
|
||||
fossas Cephisos formosa! Refugitque amata [refelli](#)
|
||||
supplex. Summa brevis vetuere tenebas, hostes vetantis, suppressit, arreptum
|
||||
regna. Postquam conpescit iuvenis habet corpus, et erratica, perdere, tot mota
|
||||
ars talis.
|
||||
|
||||
```c
|
||||
digital.webcam_dual_frequency = webmasterMms;
|
||||
if (5 + language_standalone_google) {
|
||||
cc_inbox_layout *= file_character;
|
||||
task += p;
|
||||
lockUnicode += enterprise_monochrome(tokenFunctionPersonal, keyVirtual,
|
||||
adf);
|
||||
}
|
||||
windows_binary_esports(87734, array(restoreRomTopology, adRaw(407314),
|
||||
dongleBashThumbnail), interpreter);
|
||||
```
|
||||
|
||||
Sit volat naturam; motu Cancri. Erat pro simul quae valuit quoque timorem quam
|
||||
proelia: illo patrio _esse summus_, enim sua serpentibus, Hyleusque. Est coniuge
|
||||
recuso; refert Coroniden ignotos manat, adfectu.
|
||||
Reference in New Issue
Block a user