cade/web-portfolio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

+ big verbiage update

Browse source
This commit is contained in:
Cayden Schwechten 2026-11-03 09:00:14 -06:00
parent fe3021f0c2
commit 81c290ea87
10 changed files with 140 additions and 114 deletions
Download patch file Download diff file Expand all files Collapse all files

8
AGENTS.md
View file

@ -2,12 +2,8 @@
## This is NOT the Next.js you know ## This is NOT the Next.js you know
This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read the relevant guide in `node_modules/next/dist/docs/` (resolved from this file's directory; in monorepos the `next` package may not be visible from the repo root) before writing any code. Heed deprecation notices.
the relevant guide in `node_modules/next/dist/docs/` (resolved from this file's directory; in monorepos the `next`
package may not be visible from the repo root) before writing any code. Heed deprecation notices.
This block is written and re-added by `next dev` — verify at This block is written and re-added by `next dev` — verify at `node_modules/next/dist/server/lib/generate-agent-files.js`. Removing it from a diff only re-creates the uncommitted change; committing it with your work keeps the tree clean.
`node_modules/next/dist/server/lib/generate-agent-files.js`. Removing it from a diff only re-creates the uncommitted
change; committing it with your work keeps the tree clean.
<!-- END:nextjs-agent-rules --> <!-- END:nextjs-agent-rules -->

2
README.md
View file

@ -1,6 +1,6 @@
# Cayden's Website # Cayden's Website
A developer portfolio built with **Next.js 16**, **React 19**, **TypeScript**, and **Tailwind CSS 4**, featuring a full-page React Bits `GradientWaves` ("Aurora") background behind sharp, translucent `1px` panels. Software engineer & AI orchestrator portfolio built with **Next.js 16**, **React 19**, **TypeScript**, and **Tailwind CSS 4**, featuring a full-page React Bits `GradientWaves` ("Aurora") background behind sharp, translucent `1px` panels.
## Structure ## Structure

10
app/globals.css
View file

@ -1,10 +1,12 @@
@import 'tailwindcss'; @import 'tailwindcss';
@theme inline { @theme inline {
--font-display: var(--font-geist-serif), ui-serif, Georgia, Cambria, 'Times New Roman', --font-display:
Times, serif; var(--font-geist-serif), ui-serif, Georgia, Cambria, 'Times New Roman',
--font-serif: var(--font-geist-serif), ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
Times, serif; --font-serif:
var(--font-geist-serif), ui-serif, Georgia, Cambria, 'Times New Roman',
Times, serif;
--font-sans: var(--font-inter), ui-sans-serif, system-ui, sans-serif; --font-sans: var(--font-inter), ui-sans-serif, system-ui, sans-serif;
--font-mono: --font-mono:
var(--font-jetbrains-mono), ui-monospace, SFMono-Regular, monospace; var(--font-jetbrains-mono), ui-monospace, SFMono-Regular, monospace;

12
app/layout.tsx
View file

@ -1,7 +1,7 @@
import type {ReactNode} from 'react'; import type { ReactNode } from 'react';
import type {Metadata, Viewport} from 'next'; import type { Metadata, Viewport } from 'next';
import {Inter, JetBrains_Mono, Space_Grotesk} from 'next/font/google'; import { Inter, JetBrains_Mono, Space_Grotesk } from 'next/font/google';
import {GeistSerif} from 'geist/font/serif'; import { GeistSerif } from 'geist/font/serif';
import './globals.css'; import './globals.css';
import Header from '@/components/layout/layout-header'; import Header from '@/components/layout/layout-header';
import Footer from '@/components/layout/layout-footer'; import Footer from '@/components/layout/layout-footer';
@ -24,9 +24,9 @@ const jetbrainsMono = JetBrains_Mono({
}); });
export const metadata: Metadata = { export const metadata: Metadata = {
title: 'Cayden — Web Developer', title: 'Cayden — Software Engineer & AI Orchestrator',
description: description:
'Web developer building clinical interfaces and fleet software.', 'Software engineer and AI orchestrator building clinical interfaces, fleet telemetry, and high-performance web systems.',
}; };
export const viewport: Viewport = { export const viewport: Viewport = {

2
components/sections/contact.tsx
View file

@ -1,4 +1,4 @@
import {site} from '@/lib/site'; import { site } from '@/lib/site';
const Contact = () => ( const Contact = () => (
<section id="contact" className="container-page pt-12 pb-24"> <section id="contact" className="container-page pt-12 pb-24">

68
components/sections/feats.tsx
View file

@ -1,31 +1,49 @@
import Reveal from '@/components/ui/reveal'; import Reveal from '@/components/ui/reveal';
import SectionHeading from '@/components/ui/section-heading'; import SectionHeading from '@/components/ui/section-heading';
import {feats} from '@/lib/site'; import { feats } from '@/lib/site';
const Feats = () => ( const Feats = () => {
<section id="feats" className="container-page py-16"> const isOddTotal = feats.length % 2 === 1;
<SectionHeading title="Leadership">
Operations and community work outside of code.
</SectionHeading>
<ul className="grid panel sm:grid-cols-2"> return (
{feats.map((feat, i) => ( <section id="feats" className="container-page py-16">
<li <SectionHeading title="Leadership">
key={feat.title} Operations and community work outside of code.
className="border-white/12 p-6 transition-colors not-last:border-b hover:bg-white/[0.04] sm:odd:border-r sm:odd:nth-last-2:border-b-0 md:p-7" </SectionHeading>
>
<Reveal delay={i * 60}> <ul className="grid panel sm:grid-cols-2">
<h3 className="font-display text-base font-normal text-ink"> {feats.map((feat, i) => {
{feat.title} const isLast = i === feats.length - 1;
</h3> const isLastRow = isOddTotal
<p className="mt-1.5 text-sm leading-relaxed text-ink/70"> ? isLast
{feat.detail} : i >= feats.length - 2;
</p> const isLeftCol = i % 2 === 0;
</Reveal> const colSpan = isOddTotal && isLast ? 'sm:col-span-2' : '';
</li> const rightBorder =
))} isLeftCol && !(isOddTotal && isLast)
</ul> ? 'sm:border-r'
</section> : '';
); const bottomBorder = isLastRow ? 'sm:border-b-0' : '';
return (
<li
key={feat.title}
className={`border-white/12 p-6 transition-colors not-last:border-b hover:bg-white/[0.04] md:p-7 ${colSpan} ${rightBorder} ${bottomBorder}`}
>
<Reveal delay={i * 60}>
<h3 className="font-display text-base font-normal text-ink">
{feat.title}
</h3>
<p className="mt-1.5 text-sm leading-relaxed text-ink/70">
{feat.detail}
</p>
</Reveal>
</li>
);
})}
</ul>
</section>
);
};
export default Feats; export default Feats;

2
components/sections/hero.tsx
View file

@ -1,5 +1,5 @@
import Image from 'next/image'; import Image from 'next/image';
import {about, site, stack} from '@/lib/site'; import { about, site, stack } from '@/lib/site';
const Hero = () => ( const Hero = () => (
<section id="about" className="container-page py-20 md:pt-28 md:pb-24"> <section id="about" className="container-page py-20 md:pt-28 md:pb-24">

130
components/sections/projects.tsx
View file

@ -1,79 +1,79 @@
import Reveal from '@/components/ui/reveal'; import Reveal from '@/components/ui/reveal';
import SectionHeading from '@/components/ui/section-heading'; import SectionHeading from '@/components/ui/section-heading';
import {projects} from '@/lib/site'; import { projects } from '@/lib/site';
const Projects = () => { const Projects = () => {
const rem = projects.length % 3; const rem = projects.length % 3;
const lastRowStart = projects.length - (rem || 3); const lastRowStart = projects.length - (rem || 3);
return ( return (
<section id="work" className="container-page py-16"> <section id="work" className="container-page py-16">
<SectionHeading title="Selected Work"> <SectionHeading title="Selected Work">
Instant-Response Web Applications Instant-Response Web Applications
</SectionHeading> </SectionHeading>
<div className="grid panel md:grid-cols-6"> <div className="grid panel md:grid-cols-6">
{projects.map((project, i) => { {projects.map((project, i) => {
const inLastRow = i >= lastRowStart; const inLastRow = i >= lastRowStart;
const colSpan = const colSpan =
inLastRow && rem === 1 inLastRow && rem === 1
? 'md:col-span-6' ? 'md:col-span-6'
: inLastRow && rem === 2 : inLastRow && rem === 2
? 'md:col-span-3' ? 'md:col-span-3'
: 'md:col-span-2'; : 'md:col-span-2';
const rightRule = const rightRule =
i !== projects.length - 1 && i % 3 !== 2 i !== projects.length - 1 && i % 3 !== 2
? 'md:border-r' ? 'md:border-r'
: ''; : '';
const bottomRule = inLastRow ? 'md:border-b-0' : ''; const bottomRule = inLastRow ? 'md:border-b-0' : '';
const className = `group grid border-white/12 p-6 transition-colors not-last:border-b hover:bg-white/4 md:p-7 ${colSpan} ${rightRule} ${bottomRule}`; const className = `group grid border-white/12 p-6 transition-colors not-last:border-b hover:bg-white/4 md:p-7 ${colSpan} ${rightRule} ${bottomRule}`;
const content = ( const content = (
<Reveal delay={i * 60}> <Reveal delay={i * 60}>
<div className="flex h-full flex-col justify-between"> <div className="flex h-full flex-col justify-between">
<div> <div>
<h3 className="flex items-baseline justify-between gap-2 font-display text-lg font-normal tracking-tight text-ink group-hover:text-crest"> <h3 className="flex items-baseline justify-between gap-2 font-display text-lg font-normal tracking-tight text-ink group-hover:text-crest">
<span>{project.title}</span> <span>{project.title}</span>
{project.href && ( {project.href && (
<span <span
aria-hidden aria-hidden
className="text-sm text-aurora transition-transform group-hover:translate-x-0.5 group-hover:-translate-y-0.5" className="text-sm text-aurora transition-transform group-hover:translate-x-0.5 group-hover:-translate-y-0.5"
> >
↗ ↗
</span> </span>
)} )}
</h3> </h3>
<p className="mt-2.5 text-sm leading-relaxed text-ink/70"> <p className="mt-2.5 text-sm leading-relaxed text-ink/70">
{project.blurb} {project.blurb}
</p> </p>
</div> </div>
<p className="mt-8 border-t border-white/10 pt-3 font-mono text-xs text-aurora/90"> <p className="mt-8 border-t border-white/10 pt-3 font-mono text-xs text-aurora/90">
{project.stack} {project.stack}
</p> </p>
</div> </div>
</Reveal> </Reveal>
); );
return project.href ? ( return project.href ? (
<a <a
key={project.title} key={project.title}
href={project.href} href={project.href}
target="_blank" target="_blank"
rel="noreferrer" rel="noreferrer"
className={className} className={className}
> >
{content} {content}
</a> </a>
) : ( ) : (
<article key={project.title} className={className}> <article key={project.title} className={className}>
{content} {content}
</article> </article>
); );
})} })}
</div> </div>
</section> </section>
); );
}; };
export default Projects; export default Projects;

4
components/ui/section-heading.tsx
View file

@ -1,4 +1,4 @@
import type {ReactNode} from 'react'; import type { ReactNode } from 'react';
type Props = { type Props = {
title: string; title: string;
@ -9,7 +9,7 @@ const SectionHeading = ({ title, children }: Props) => (
<div className="mb-6 flex flex-col justify-between gap-2 border-b border-white/15 pb-4 sm:flex-row sm:items-end"> <div className="mb-6 flex flex-col justify-between gap-2 border-b border-white/15 pb-4 sm:flex-row sm:items-end">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<span aria-hidden className="h-px w-5 bg-aurora" /> <span aria-hidden className="h-px w-5 bg-aurora" />
<h2 className="font-display text-2xl font-normal tracking-tight text-ink md:text-3xl"> <h2 className="font-display text-2xl font-normal tracking-tight text-ink md:text-3xl">
{title} {title}
</h2> </h2>
</div> </div>

16
lib/site.ts
View file

@ -12,9 +12,9 @@ export type Feat = {
export const site = { export const site = {
name: 'Cayden Codes', name: 'Cayden Codes',
role: 'Web Developer', role: 'Software Engineer & AI Orchestrator',
tagline: tagline:
"I'm a proven people leader building fast, dependable web software for clinical floors and fleet operations.", 'Software engineer and AI orchestrator building fast, resilient systems for clinical floors, fleet telemetry, and complex web architectures.',
gitlab: 'https://gitlab.com/caydens', gitlab: 'https://gitlab.com/caydens',
email: 'hi@caydens.dev', email: 'hi@caydens.dev',
}; };
@ -29,7 +29,8 @@ export const nav = [
export const stack = ['TypeScript', 'React', 'Next.js', 'Python', 'JavaScript']; export const stack = ['TypeScript', 'React', 'Next.js', 'Python', 'JavaScript'];
export const about = [ export const about = [
'I engineer responsive, high-performance web applications where speed and clarity are paramount, specializing in touch-first EHR interfaces and live fleet telemetry for mobile medical workstations. I bridge the gap between human workflows and technical architecture to deliver interfaces that feel natural, comfortable, and precise.', 'I am a software engineer and AI orchestrator with a relentless focus on core programming craftsmanship, systems architecture, and runtime performance. Whether engineering touch-first EHR interfaces for high-pressure clinical floors or architecting real-time telemetry pipelines for mobile medical workstations, my work is rooted in writing clean, resilient, and maintainable code across TypeScript, React, Next.js, and Python.',
'As an AI orchestrator, I approach models as architectural building blocks rather than superficial shortcuts. I design deterministic multi-agent workflows, structured context pipelines, and robust tooling integrations—grounded in strict validation, solid state machines, and end-to-end code execution.',
'Outside of software engineering, I directed one of the Southeast’s largest interest-driven communities, producing 250-attendee live events, speaking at regional conventions, and coordinating partnerships with major streaming platforms.', 'Outside of software engineering, I directed one of the Southeast’s largest interest-driven communities, producing 250-attendee live events, speaking at regional conventions, and coordinating partnerships with major streaming platforms.',
]; ];
@ -39,6 +40,11 @@ export const projects: Project[] = [
blurb: 'Empower high-stakes healthcare environments with real-time tracking, telemetry, and remote management for EHR devices.', blurb: 'Empower high-stakes healthcare environments with real-time tracking, telemetry, and remote management for EHR devices.',
stack: 'TypeScript · Next.js · SQL · Rust', stack: 'TypeScript · Next.js · SQL · Rust',
}, },
{
title: 'Enterprise Agent Governance Framework',
blurb: 'Centralized developer tooling and orchestration suite—enforcing deterministic agent rules, custom MCP servers, automated style guides, and standardized integration patterns across enterprise repositories.',
stack: 'TypeScript · Node.js · MCP · Shell',
},
{ {
title: 'Leadership Training Platforms', title: 'Leadership Training Platforms',
blurb: 'Prepare corporate leaders for critical decision-making through dynamic, real-world simulations of routine and high-stress management.', blurb: 'Prepare corporate leaders for critical decision-making through dynamic, real-world simulations of routine and high-stress management.',
@ -80,4 +86,8 @@ export const feats: Feat[] = [
title: 'Public speaking', title: 'Public speaking',
detail: 'Regular convention panelist on community and operations leadership.', detail: 'Regular convention panelist on community and operations leadership.',
}, },
{
title: 'Crisis response & rapid deployment',
detail: 'A proven knack for quick deadlines and tight risks—always willing to meet deadlines during downtime or fast-tracked product launches and go extremely far to make that happen, including flying across the world to Malaysia with under 6 hours’ notice in case of emergency to secure a product launch.',
},
]; ];