# Bio site

This repo is my personal portfolio: one long scrolling page with a hero, skills, projects, experience, and a bit of “who I am” at the bottom. I wanted something fast, static, and easy to tweak without a CMS—just TypeScript content files and Vue components.

If you landed here to fork it for yourself, the **product spec** lives in [`PRD/PRDs/Bio Site PRD.template.md`](PRD/PRDs/Bio%20Site%20PRD.template.md). Copy that file, fill it in locally, and keep anything too specific for public GitHub out of the tracked tree (see `.gitignore`).

## What’s inside

- **Vue 3 + Vite** for the UI
- **Tailwind** for layout and color
- **GSAP** for scroll-triggered section reveals (loaded on demand so the first paint stays light)
- **Shipped as static HTML/JS/CSS** in `dist/`—fine for Netlify-style hosts, GitHub Pages, or a tiny **nginx** container (see `Dockerfile`)

## Run it locally

You’ll want Node 20+ (22 matches CI/Docker).

```bash
npm install
npm run dev
```

Vite will print a URL—usually `http://localhost:5173`.

## Build for production

```bash
npm run build
npm run preview
```

Output is in `dist/`.

## Docker (optional)

The container only serves prebuilt files with nginx; there is no Node process at runtime.

```bash
docker build -t bio-site .
docker run --rm -p 8080:80 bio-site
```

Or with Compose (defaults to host port **8080**):

```bash
docker compose up -d --build
```

If the site is **not** at the root URL (e.g. GitHub Pages project pages), set a base path at build time—see `VITE_BASE` in `docker-compose.yml` and the GitHub Pages note below.

## GitHub Pages (project site)

If the live URL looks like `https://username.github.io/repo-name/`, set repo variable **`VITE_BASE`** to `/repo-name/` (Actions → Variables), enable Pages from Actions, and use [`.github/workflows/pages.yml`](.github/workflows/pages.yml). For a user site at the repo root, leave `VITE_BASE` unset.

## Make it yours

| What | Where |
|------|-------|
| Name, links, email, tagline | `src/content/site.ts` |
| Skills | `src/content/skills.ts` |
| Projects | `src/content/projects.ts` |
| Roles | `src/content/experience.ts` |
| Avatar | Replace or point `public/` assets from `HeroSection.vue` |
| Resume link | Add `public/resume.pdf` on your machine before build/deploy; it is **gitignored** so a public clone does not ship your PDF (the download link still works in your own builds) |
| SEO / social | `index.html` (`title`, description, Open Graph, `og:url`) |

## License

Private / personal use—change the license if you fork for something public.