A modern, minimalist portfolio and blog built with Astro, featuring a beautiful monochromatic design aesthetic.
- 🎨 Minimalist Monochromatic Design
- 📱 Fully Responsive Layout
- 🌓 Custom Cursor Effects
- 📝 Integrated Blog Platform
- 🔍 SEO Optimized
- 📊 JSON-LD Schema Support
- 🎭 GSAP Animations
- 🌐 Sitemap Generation
- 📱 Mobile-First Approach
- ⚡ Lightning Fast Performance
- Astro - Static Site Generator
- TailwindCSS - Styling
- GSAP - Animations
- TypeScript - Type Safety
- Content Collections - Blog Management
- Node.js 18 or higher
- Bun package manager
- Clone the repository
git clone https://github.com/yourusername/mono-portfolio.git
cd mono-portfolio
- Install dependencies
bun install
- Start the development server
bun dev
Visit http://localhost:4321
to see your site!
/
├── public/ # Static assets
├── src/
│ ├── assets/ # Project assets
│ ├── components/ # UI components
│ ├── content/ # Blog posts and collections
│ ├── layouts/ # Page layouts
│ ├── pages/ # Route pages
│ ├── styles/ # Global styles
│ ├── types/ # TypeScript types
│ └── utils/ # Utility functions
└── package.json
Add your blog posts in src/content/blog/
using MDX format:
---
title: Your Post Title
description: Brief description
excerpt: Post excerpt
category: Category
date: 2024-04-07
lastModified: 2024-04-07
readTime: 5 min read
tags: [tag1, tag2]
image: /path/to/image.jpg
imageAlt: Image description
---
Your content here...
Command | Action |
---|---|
bun dev |
Start development server |
bun build |
Build production site |
bun preview |
Preview production build |
bun astro ... |
Run Astro commands |
- Lighthouse Score: 100/100
- Core Web Vitals Optimized
- Zero JavaScript by Default
- Optimal Asset Loading
This project is licensed under the MIT License - see the LICENSE file for details.
Contributions are welcome! Please feel free to submit a Pull Request.
⭐ Star this repo if you found it helpful!