A modern, responsive portfolio website built with Next.js 16, showcasing my work as a Full-Stack Developer with 6+ years of experience.
Live Demo: alihamza.dev
- Framework: Next.js 16 (App Router)
- Styling: Tailwind CSS v4
- Language: JavaScript
- Deployment: Vercel
- Responsive design optimized for all devices
- Dark/Light mode with system preference detection
- SEO optimized with JSON-LD structured data
- Accessible (WCAG compliant)
- Performance optimized with static generation
- Smooth animations and micro-interactions
- Hero - Introduction with gradient background and CTAs
- About - Background, highlights, and remote work availability
- Skills - Technical skills organized by category
- Projects - Featured work with descriptions and links
- Experience - Professional timeline
- Contact - Multiple contact methods and CTA
# Clone the repository
git clone https://github.com/alihamzahq/alihamza.dev.git
# Navigate to project directory
cd alihamza.dev
# Install dependencies
npm install
# Run development server
npm run devOpen http://localhost:3000 to view the site.
├── app/
│ ├── layout.js # Root layout with metadata
│ ├── page.js # Home page
│ └── globals.css # Global styles and CSS variables
├── components/
│ ├── layout/ # Header, Footer
│ ├── sections/ # Page sections (Hero, About, etc.)
│ └── ui/ # Reusable UI components
├── lib/
│ ├── constants.js # Site configuration
│ └── data.js # Content data
└── public/ # Static assets
| Command | Description |
|---|---|
npm run dev |
Start development server |
npm run build |
Build for production |
npm run start |
Start production server |
npm run lint |
Run ESLint |
- Update personal information in
lib/constants.js - Modify content data in
lib/data.js - Adjust theme colors in
app/globals.css
MIT License - feel free to use this as a template for your own portfolio.
- Email: hello@alihamza.dev
- LinkedIn: alihamzadev
- GitHub: alihamzahq