Satya Benson Portfolio

A clean, professional portfolio site built with SvelteKit, TypeScript, and Tailwind CSS. Features a tabbed interface and static markdown-based blog.

Features

• Static Site Generation: Built with SvelteKit's static adapter for fast loading
• Markdown Blog: Write posts in markdown with frontmatter support
• TypeScript: Full type safety throughout the application
• Responsive Design: Works on desktop and mobile devices
• Tab Interface: Browser-like tabbed navigation (planned feature)
• SEO Optimized: Proper meta tags and semantic HTML

Development

Setup

# Install dependencies
npm install

# Start development server
npm run dev

Adding Blog Posts

Create new markdown files in src/content/posts/ with frontmatter:

---
title: "Your Post Title"
date: "2024-01-15"
summary: "Brief description"
tags: ["tag1", "tag2"]
featured: true
draft: false
---

# Your Post Title

Content goes here...

Or use the helper script:

npm run new-post "Your Post Title"

Building for Production

# Build static site
npm run build

# Preview built site
npm run preview

Project Structure

src/
├── content/
│   └── posts/              # Markdown blog posts
├── lib/
│   ├── content/           # Content processing logic
│   ├── stores/            # Svelte stores (tabs, etc.)
│   └── types/             # TypeScript interfaces
├── routes/
│   ├── +page.svelte       # Homepage (blog index)
│   ├── cv/                # CV page
│   ├── about/             # About page
│   └── writing/
│       └── [slug]/        # Individual blog posts
└── app.html               # HTML template

Deployment

The site generates completely static files. Deploy the build/ directory to any static hosting service:

• Netlify
• Vercel
• GitHub Pages
• Your own nginx server

Custom Deployment

Update scripts/deploy.sh with your server details and run:

npm run deploy

Technologies

• SvelteKit - Full-stack framework
• TypeScript - Type safety
• Tailwind CSS - Styling
• Marked - Markdown processing
• Prism.js - Syntax highlighting
• Gray Matter - Frontmatter parsing

License

MIT for the code. Site content (posts, CV, images) is all rights reserved.