Big City Life - Astro Photography Portfolio

📸 Big City Life - Modern Photography Portfolio

Big City Life is a modern photography portfolio built with Astro, featuring MDX-based content collections, React-powered interactive components, and responsive Tailwind-styled design. It offers optimized performance with static generation, image optimization (WebP, lazy loading), and SEO-ready outputs (sitemap, RSS), plus features like vertical carousel, real-time search, and mobile-friendly navigation.

🚀 Project Architecture

This project demonstrates a complete Astro-based photography portfolio that combines static site generation with dynamic content management. The architecture follows Astro’s file-based routing system and content collections pattern.

Key Technologies

Astro 5.14.1 - Static site generator with hybrid rendering
React 19.1.0 - Interactive components
TypeScript - Type safety and better DX
Tailwind CSS 4.1.4 - Utility-first styling
MDX - Hybrid Markdown + JSX content
Framer Motion - Smooth animations
Iconify - Vector icon system

🎨 Key Features

Interactive Components

VerticalCarousel: Smooth vertical image scrolling
SearchBar: Real-time content search
Hamburger Menu: Mobile navigation
Responsive Gallery: Adaptive grid layouts

Performance Optimizations

Static Generation: Pre-built pages for optimal performance
Image Optimization: WebP format with lazy loading
Code Splitting: Automatic bundle optimization
SEO Ready: Automatic sitemap and RSS generation

🌟 Ideal for Photographers and Creators

Perfect for photographers and creators to showcase work with fast loads, smooth animations, and easy content management.

🔗 Explore the Project

🌐 Live demo: bigcitylife.netlify.app
📂 GitHub repository: Big City Life

Big City Life represents my approach to modern web development: using technologies like Astro to create photography portfolios that are not only visually stunning, but also technically excellent in terms of performance and user experience.