72 lines
2.4 KiB
TypeScript
72 lines
2.4 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { Container, SectionHeader } from "@/src/components/site";
|
|
import { Timeline } from "@/src/components/about/Timeline";
|
|
import { TagList } from "@/src/components/about/TagList";
|
|
import {
|
|
NOT_MY_THING,
|
|
STACK_ITEMS,
|
|
TIMELINE,
|
|
WORKING_MODE,
|
|
} from "@/src/components/about/aboutData";
|
|
|
|
export const metadata: Metadata = {
|
|
title: "About",
|
|
description:
|
|
"Senior engineer who makes AI-built software dependable. Web since 2011, remote since 2021, now independent.",
|
|
alternates: { canonical: "/about" },
|
|
};
|
|
|
|
// TODO(owner): link a CV download here once the PDF exists (no file yet).
|
|
|
|
export default function Page() {
|
|
return (
|
|
<Container className="py-16 md:py-24">
|
|
<SectionHeader
|
|
as="h1"
|
|
kicker="/about"
|
|
title="About"
|
|
lead="Senior engineer who makes AI-built software dependable."
|
|
/>
|
|
|
|
<div className="mt-12 max-w-2xl space-y-4 text-base leading-relaxed text-muted">
|
|
<p>
|
|
I have worked on the web since 2011, starting with an apprenticeship.
|
|
Since then I have worked in agencies and product companies, and led
|
|
the frontend team at an agency. I have been fully remote since 2021
|
|
and am now independent, while running a small product business.
|
|
</p>
|
|
<p>
|
|
Design and frontend are my strength. I am comfortable with backend
|
|
concepts and architecture. Today I mostly write TypeScript and
|
|
Next.js, plus Rust and Solidity for systems work. The path started
|
|
with Vue and plain JavaScript, and I would rather say so than pretend
|
|
I always wrote Rust.
|
|
</p>
|
|
</div>
|
|
|
|
<section className="mt-16 max-w-2xl" aria-labelledby="how-i-work">
|
|
<h2 id="how-i-work" className="!mb-3 !mt-0 !text-xl">
|
|
How I work
|
|
</h2>
|
|
<ul className="!m-0 space-y-2 !pl-5 text-muted">
|
|
{WORKING_MODE.map((line) => (
|
|
<li key={line}>{line}</li>
|
|
))}
|
|
</ul>
|
|
</section>
|
|
|
|
<section className="mt-16 max-w-3xl" aria-labelledby="timeline">
|
|
<h2 id="timeline" className="!mb-4 !mt-0 !text-xl">
|
|
Timeline
|
|
</h2>
|
|
<Timeline entries={TIMELINE} />
|
|
</section>
|
|
|
|
<div className="mt-16 grid max-w-3xl gap-10 md:grid-cols-2">
|
|
<TagList title="Stack" items={STACK_ITEMS} />
|
|
<TagList title="Not my thing" items={NOT_MY_THING} />
|
|
</div>
|
|
</Container>
|
|
);
|
|
}
|