madsdev404 - Personal Portfolio

Description

This is a modern, responsive personal portfolio website built with Next.js, React, and Tailwind CSS. It showcases my skills, projects, and services as a full-stack web developer. The site features a clean UI/UX, smooth animations with Framer Motion, and a dark/light theme switcher.

Features

• Responsive Design: Optimized for various screen sizes (desktop, tablet, mobile).
• Dark/Light Theme: Toggle between dark and light modes for a personalized viewing experience.
• Smooth Scrolling: Navigation links provide smooth transitions to different sections.
• Interactive UI: Built with React components and styled with Tailwind CSS for a modern look.
• Framer Motion Animations: Enhances user experience with subtle and engaging animations.
• Modular Structure: Organized into reusable components and sections for easy maintenance and scalability.

Technologies Used

• Next.js 14: React framework for production.
• React 18: JavaScript library for building user interfaces.
• Tailwind CSS 3: A utility-first CSS framework for rapid UI development.
• TypeScript 5: Superset of JavaScript that adds static types.
• Framer Motion 11: A production-ready motion library for React.
• React Icons 5: Popular icon library for React applications.

Installation

To get a local copy up and running, follow these simple steps.

Prerequisites

Make sure you have Node.js and npm (or yarn) installed.

• Node.js (LTS version recommended)
• npm (comes with Node.js) or Yarn

Clone the repository

git clone https://github.com/madsdev404/madsdev404_portfolio.git
cd madsdev404

Install dependencies

npm install
# or
yarn install

Run the development server

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

Project Structure

madsdev404/
├── app/                  # Next.js app directory (root layout, pages)
├── components/           # Reusable React components
├── public/               # Static assets (images, favicons)
├── sections/             # Major sections of the portfolio (Hero, AboutMe, Skills, etc.)
├── .gitignore            # Specifies intentionally untracked files to ignore
├── next.config.ts        # Next.js configuration
├── package.json          # Project dependencies and scripts
├── postcss.config.js     # PostCSS configuration
├── tailwind.config.js    # Tailwind CSS configuration
├── tsconfig.json         # TypeScript configuration
└── README.md             # Project README file

License

This project is licensed under the MIT License - see the LICENSE file for details.