Skip to content

Latest commit

 

History

History
62 lines (42 loc) · 2.34 KB

README.md

File metadata and controls

62 lines (42 loc) · 2.34 KB
Raw

Portfolio

Welcome to my portfolio project built with React, Next.js, TailwindCSS, and other modern web technologies. This project showcases my skills in frontend development, animation, and email integration. It is designed to be visually appealing, responsive, and interactive.

Watch the demo on YouTube:

Watch the demo video

Technologies Used

This project is built using the following technologies and libraries:

  • React: For building the user interface.
  • Next.js: For server-side rendering and static site generation.
  • TailwindCSS: For utility-first CSS styling.
  • Framer Motion: For smooth animations and page transitions.
  • React-Email: For integrating the email system.
  • Resend: To handle email delivery functionality.
  • React-Observer-Intersection-API: For detecting element visibility in the viewport.
  • React-Hot-Toast: For showing toast notifications.
  • React-Icons: For adding icons throughout the project.

Features

  • Responsive Design: Fully optimized for all screen sizes using TailwindCSS.
  • Smooth Animations: All page transitions and interactions use Framer Motion to provide a delightful user experience.
  • Contact Form: A contact form integrated with React-Email and Resend to send messages directly to my inbox.
  • Interactive Elements: Using React-Observer-Intersection-API to trigger animations and effects as users scroll through the site.
  • Toast Notifications: Using React-Hot-Toast to show interactive notifications (e.g., form submission success).
  • Iconography: React-Icons used throughout the project for visual appeal.

Installation

This is a Next.js project bootstrapped with create-next-app.

To run this project locally on your machine, follow these steps:

  1. Clone the repository:

    git clone git@github.com:mksonkar/portfolio-react-nextjs.git

  2. Navigate to the project directory:

    cd portfolio-react-nextjs

  3. Install the required dependencies:

    npm install

  4. Start the development server:

    npm run dev

  5. Open your browser and visit http://localhost:3000.