Skip to content

A clean, responsive personal portfolio website built with Next.js, TypeScript, Tailwind CSS, and AOS animations. Showcasing my projects, skills, and experience in web development.

Notifications You must be signed in to change notification settings

codewithshabbir/Portfolio-Next-Js

Repository files navigation

Personal Portfolio - Code with Shabbir 🌐

Welcome to the repository for my personal portfolio website, live at codewithshabbir.vercel.app. This project showcases my skills, projects, and professional experience in web development.

Note: This is a personal project and is not intended for public or commercial use.


CodeWithShabbir Portfolio

🔒 Usage Restrictions

This project is solely for my personal portfolio. Unauthorized use, copying, or redistribution of any part of this project is strictly prohibited.

🚀 Features

  • Responsive Design: Built to deliver a seamless experience across all devices.
  • Interactive Animations: Utilizes AOS (Animate on Scroll) to enhance user engagement with smooth animations.
  • Organized Projects Section: Projects are neatly categorized, allowing visitors to navigate through my work easily.
  • Modern UI/UX: A focus on clean design and intuitive navigation.

🛠️ Technology Stack

  • Frontend: HTML, CSS, TypeScript
  • Framework: Next.js
  • Styling: Tailwind CSS and custom CSS
  • Animation Library: AOS (Animate on Scroll)
  • Hosting: Vercel
  • Fonts: 'Lufga' font family

📂 Project Structure

├── components    # Reusable components used across pages
├── public        # Static assets (images, fonts, etc.)
├── styles        # Global and modular CSS files
└── pages         # All Next.js pages (homepage, projects, contact)

🔧 Setup Instructions

  1. Clone the Repository:

    git clone https://github.com/yourusername/portfolio.git
    cd portfolio
  2. Install Dependencies:

    npm install
  3. Run the Development Server:

    npm run dev

    Visit http://localhost:3000 to view the site.

  4. Build the Project:

    npm run build
  5. Start the Production Server:

    npm start

📁 Folder & Code Organization

  • Components Folder: Contains reusable components such as header, footer, project cards, etc.
  • Pages Folder: Organized for different sections of the portfolio (home, projects, about, contact).
  • Styles Folder: Uses Tailwind CSS alongside modular CSS for specific styling needs.

📝 License

This project is not licensed for public use. All rights reserved by the author, Muhammad Shabbir . Unauthorized use or redistribution of this project is prohibited.

About

A clean, responsive personal portfolio website built with Next.js, TypeScript, Tailwind CSS, and AOS animations. Showcasing my projects, skills, and experience in web development.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published