Personal portfolio and blog of Mickaël Alves - Tech Lead Frontend, Speaker, and Developer Experience enthusiast.
This portfolio is built with modern web technologies:
- ⚡ Next.js 16 - React framework with App Router
- ⚛️ React 19 - Latest React with compiler
- 🎨 Motion - Smooth animations
- 🔍 nuqs - Type-safe URL search params
- 📝 MDX - Blog posts with
next-mdx-remote, Shiki syntax highlighting andrehype-slug - 🎭 Lottie - Interactive animations
- 🎯 Radix UI - Accessible UI components
- 🧹 Oxlint & Oxfmt - Fast linting & formatting
- 📦 pnpm - Efficient package manager
- 📚 Blog - Technical articles and tutorials
- 🎤 Talks - Conference presentations and meetup sessions
- 🎙️ Podcasts - Tech podcast appearances
- 💼 Projects - Showcase of open-source and personal projects
- ℹ️ About - Career, community involvement, and education
- 🔎 Command Bar - Quick navigation and full-text search of talks, articles and podcasts with
Cmd+K(kbar+ Pagefind) - 🌐 SEO Optimized - OpenGraph, JSON-LD, and sitemap
- ⚡ Performance - Optimized images, fonts, and code splitting
- Node.js >= 24.x
- pnpm >= 12.x
# Install dependencies
pnpm install
# Run development server
pnpm dev
# Build for production (generates icons, then the search index)
pnpm build
# Start production server
pnpm startOpen http://localhost:3000 to view the portfolio.
mickaelalvs.dev/
├── app/ # Next.js App Router pages
├── modules/ # React components organized by feature
├── data/ # Content data (talks, projects, etc.)
├── articles/ # Markdown blog posts
├── lib/ # Blog, JSON-LD and Shiki helpers
├── scripts/ # Icon generation and search index build
├── public/ # Static assets
└── utils/ # Helper utilities
# Lint code
pnpm lint
# Lint and auto-fix
pnpm lint:fix
# Format code
pnpm format
# Check formatting (used in CI)
pnpm format:checkThis project was built using the portfolio template by Zeno Rocha. The original template is available under the MIT License.
MIT License - see the LICENSE file for details.