A modern, responsive portfolio website built with Next.js, React, TypeScript, and MDX. This portfolio showcases your projects and blog posts, which you can easily write locally in Markdown.
- 🎨 Modern and clean design with dark/light mode
- 📱 Fully responsive layout
- 📝 Blog support with MDX
- 🚀 Built with Next.js 14 and React 18
- 💻 TypeScript for type safety
- 🎯 SEO optimized
- ⚡ Fast page loads with static generation
- 🎨 Styled with Tailwind CSS
- 🔍 Syntax highlighting for code blocks
- 📦 Easy to customize and extend
-
Clone the repository:
git clone https://github.com/yourusername/portfolio.git cd portfolio
-
Install dependencies:
pnpm install
-
Start the development server:
pnpm dev
-
Open http://localhost:3000 in your browser.
- Update the metadata in
src/app/layout.tsx
- Modify the content in
src/app/page.tsx
- Update the about page in
src/app/about/page.tsx
- Add your projects in
src/content/projects/
- Each project should be a markdown file with frontmatter:
--- title: Project Name description: Project description date: 2024-03-20 tags: [react, nextjs, typescript] image: /images/projects/project-name.png ---
- Add your blog posts in
src/content/blog/
- Each post should be a markdown file with frontmatter:
--- title: Blog Post Title description: Blog post description date: 2024-03-20 tags: [react, nextjs, typescript] ---
The portfolio uses Tailwind CSS for styling. You can customize the theme in:
tailwind.config.ts
- Theme configurationsrc/app/globals.css
- Global styles and CSS variables
The portfolio is configured for deployment on Vercel:
- Push your code to GitHub
- Import your repository on Vercel
- Deploy!
Contributions are welcome! Please feel free to submit a Pull Request.
This project is licensed under the MIT License - see the LICENSE file for details.