HT Folio — Hassan Algasid's portfolio

Live: https://ht-folio.pages.dev (or your custom domain) Stack: Astro 5 SSR · Tailwind · Cloudflare Pages · JSON Resume

Hassan's personal portfolio site for HassTech LLC. AI Solutions / Forward Deployed positioning, seven curated production-app cards, JSON Resume data layer.

Architecture

src/
├── data/
│   ├── resume.json      ← JSON Resume v1 — single source of truth for /resume + /about + /
│   ├── projects.json    ← Curated seven-project showcase (HT Calc, HassTech API, HTPdf, NeuronScope, HT Meter, HT Career, HT Resume)
│   └── types.ts         ← Type contracts for both
├── pages/
│   ├── index.astro      ← Home (hero + featured projects + operating model + outcomes)
│   ├── projects.astro   ← Full grid of all seven projects
│   ├── about.astro      ← Forward Deployed positioning, skills, beliefs
│   ├── resume.astro     ← JSON Resume rendered to HTML, print-friendly
│   ├── contact.astro    ← Email / GitHub / studio links + good-fit checklist
│   ├── api/
│   │   └── resume.json.ts  ← Public JSON Resume export (CORS-enabled)
│   ├── og/
│   │   └── [username].png.ts  ← Dynamic OG image generation
│   └── robots.txt.ts
├── components/
│   ├── Hero.astro       ← Aurora hero with shipped-count badge
│   ├── ProjectCard.astro ← Curated project card with chrome/stat/win accent system
│   ├── NavBar.astro     ← Sticky nav, theme toggle, "Hire" CTA
│   ├── Footer.astro     ← Sitemap + studio links
│   ├── TechBadge.astro  ← Auto-icon tech badge from simple-icons
│   ├── ThemeToggle.astro
│   └── ...              ← Legacy SaaS components retained for future revival
├── layouts/
│   └── Layout.astro     ← Theme tokens, glassmorphism, tri-color brand system
├── lib/
│   ├── github.ts, icons.ts, config.ts  ← Active
│   └── ...              ← Legacy SaaS libs (jwt, oauth, nda, narrative, analytics, audit, architecture)
└── middleware.ts        ← Basic-auth gate (passive when secrets unset)

archive/
└── saas-routes/         ← Original HT Folio SaaS routes (OAuth, NDA, pricing,
                          configure, [username] dynamic renderer, AI narrative,
                          analytics) — preserved for future SaaS revival.

Brand system — tri-color luminescent gradients

Three semantic roles, never collapse to one accent:

Role	Colors	Used for
Chrome	from-orange-500 via-amber-500 to-orange-500	Hero, CTAs, primary chrome
Stat	from-blue-500 to-sky-500	Result numbers, metrics, stat callouts
Win	from-emerald-400 via-green-400 to-teal-400	"Shipped" badges, outcome confirmations

Tailwind helpers: bg-ht-chrome, bg-ht-stat, bg-ht-win for backgrounds; .chrome-text, .stat-text, .win-text for gradient text.

CSS tokens live in src/layouts/Layout.astro under html.dark / html.light. Dark mode is the default, neon-on-dark; light mode is softer/frosted with stone-50 base.

Editing content

Add or change a project: edit src/data/projects.json AND src/data/resume.json. Both surfaces re-render on next build. Each project has: slug, name, tagline, description, tech[], stat, status (shipped/beta/building/archived), liveUrl, repoUrl, featured, accent (chrome/stat/win).

Update positioning, skills, work history: edit src/data/resume.json. Schema is JSON Resume v1.

Local dev

npm install
npm run dev          # http://localhost:4321
npm run check        # astro + tsc typecheck (do this before pushing)
npm run build        # production bundle to dist/
npm run preview      # local preview of the built bundle

Deploy

Wired for Cloudflare Pages with the @astrojs/cloudflare SSR adapter.

npm run build
npx wrangler pages deploy dist --project-name=ht-folio

The wrangler.toml binds the existing KV namespace FOLIO_CONFIG (id 161ed2f490c240e68a5f05c2d9b11241). It's currently used only for the optional first-party analytics pixel. To disable analytics, leave the binding unset or set PUBLIC_ANALYTICS_DISABLED=true.

To gate the site behind basic auth (e.g. while iterating in private), set BASIC_AUTH_USER and BASIC_AUTH_PASS in Pages secrets. Without those, the site is fully public — src/middleware.ts is no-op.

Licenses

All embedded OSS is permissive (MIT / Apache 2.0 / BSD / ISC / MPL-2.0) per HassTech licensing policy. See THIRD_PARTY_NOTICES.md.

Related

• HT Calc — pro mortgage / real-estate calculator
• HassTech API — financial calc API platform
• HTPdf — Stripe-quality PDFs in one API call
• HT Meter — live AI usage + FinOps tracker
• HT Career — career landing + AI concierge
• NeuronScope — neural-net inspection desktop app