Skip to content

Repository files navigation

🌟 SPA - Personal Portfolio

A sleek, high-performance Single Page Application (SPA) portfolio built with Next.js to showcase my skills, projects, and professional journey. This site is designed with a modern developer experience in mind and optimized for speed, SEO, and accessibility.

image

Live Demo GitHub


✨ Features

  • ⚡ Blazing Fast: Built on the Next.js framework for optimal performance and server-side rendering (SSR).
  • 🎨 Modern UI/UX: A clean, responsive, and interactive design that works flawlessly on all devices.
  • 🔍 SEO Optimized: Meta tags, Open Graph, and semantic HTML for better search engine visibility.
  • 🌙 Dark Mode: Toggle between light and dark themes for comfortable viewing.
  • 📱 PWA Ready: Can be installed on your device for an app-like experience.
  • 💯 Accessible: Built with accessibility best practices to ensure everyone can use my portfolio.

🛠️ Tech Stack & Tools

Here's a breakdown of the technologies and tools that power this project:

Frontend & Framework

  • Next.js - The React framework for production.
  • React - A JavaScript library for building user interfaces.
  • TypeScript - For type-safe JavaScript.

Styling & UI

  • Tailwind CSS - A utility-first CSS framework for rapid UI development.

Deployment & Hosting

  • Vercel - The optimal platform for hosting Next.js applications.

Version Control & Package Management

  • Git
  • GitHub
  • NPM

Other Libraries & Tools

  • Framer Motion - For smooth animations and page transitions.
  • React Hook Form - For efficient form handling and validation.
  • React Icons - For a beautiful and consistent icon set.
  • EmailJS - For handling contact form submissions without a backend.

🚀 Getting Started

Follow these steps to run this project locally on your machine.

Prerequisites

Make sure you have the following installed:

  • Node.js (version 18 or higher recommended)
  • npm, yarn, or pnpm

Installation

  1. Clone the repository:
    git clone https://github.com/your-username/your-repo-name.git
    cd your-repo-name

  1. Install dependencies:
    npm install
    # or
    yarn install
    # or
    pnpm install

  1. Run the development server:
    npm run dev
    # or
    yarn dev
    # or
    pnpm dev

  1. Open your browser: Navigate to http://localhost:3000. The site will auto-reload as you edit the files.

🤝 Contributing This is a personal portfolio project, so contributions are not expected. However, if you have any suggestions or spot a bug, feel free to fork the repo and create a pull request or open an issue. 📞 Let's Connect! ehsanyaqoob07@gmail.com ⭐ Don't forget to star this repo if you found it interesting!.

About

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages