🌐 My Portfolio Website

Welcome to my personal portfolio website! 🚀

This is where I showcase my work, projects, achievements, and share my knowledge through blogs. The website features smooth animations, interactive sections, and much more. Below you'll find all the details on how to navigate and contribute to the site.

🌐 Click here to view the website LIVE:

https://portfolio-gamma-wine-56.vercel.app/

🗂️ Website Sections Structure

The website is organized into the following main sections, each designed to provide a seamless and interactive user experience:

1. Home

• A welcoming homepage with smooth animations that provide an engaging first impression.

2. Projects

A showcase of my recent work, including detailed descriptions and technologies used. Each project is displayed with relevant information and links to live demos or GitHub repositories.

• ClassQuery: React, OpenAI API, JS, HTML, CSS, Java, SpringBoot, H2, Docker, Cypress, JMeter
• Spark: React, Axios, AWS S3 bucket, OpenAI API, Java, SpringBoot, H2, EC2 instance
• Tech-Reads: React, Vite, JS, HTML, Tailwind CSS
• Dictionary_AI_APP: React, OPENAI API, TypeScript, JS, HTML, CSS (Dictionary API)
• Arcade Simulation:Java: Dependency Injection, Abstract classes, Interfaces, Inheritance, Polymorphism, Exception Handling, Randomization, Collections, File I/O, and UI Design.
• Cypress Automation E2E/API Testing: React, Cypress

📸 Screenshot of the Project Section

3. Certifications

• A collection of professional certifications earned, displayed in a clean, organized format.
• Certifications: ZipCode Wilmington Certification, Tech Elevator Certification, AWS Cloud Practioner Certification, React Developer HackerRank Certification, Curriculeon Full Stack Web Developer Certification, React Tutorial Certification

📸 Screenshot of the Certification Section

4. Blog

• A section dedicated to my personal insights and technical blogs on various topics.

• Includes tips, tutorials, and updates from my development journey.

  📸 Screenshot of the Blogs Section

🔧 Technologies Used

• Frontend: Built with React for dynamic components and Next.js for server-side rendering and SEO optimization.
• Styling: Styled using Styled Components for a modular and maintainable approach.
• Animations: Integrated animations using Framer Motion create smooth transitions.
• Hosting: Deployed on Vercel (Next.js's official deployment platform).

📂 Project Structure

• pages/ - Contains all the pages of the website, including index.js (homepage).
• components/ - React components that are reusable throughout the site.
• styles/ - Contains styles (CSS or styled components) for various sections of the site.
• public/ - Static files such as images, fonts, etc.
• blog/ - Blog posts and articles are stored here.

🚀 How to View

1. Clone the repository:

   git clone https://github.com/mnaser/portfolio-website.git

2. Navigate into the project directory:

   cd portfolio-website

3. Install the required dependencies:

   npm install

4. Start the development server:

   npm run dev

5. Open http://localhost:3000 in your browser to view the website locally.

🛠️ How to Contribute

I am always open to improvements and suggestions! If you'd like to contribute:

1. Fork the repository.
2. Create a new branch (git checkout -b feature/your-feature).
3. Commit your changes (git commit -m 'Add your feature').
4. Push to your branch (git push origin feature/your-feature).
5. Open a pull request.

---

Thank you for visiting my portfolio! 😊 I hope you enjoy browsing through my work. Don't hesitate to connect with me on LinkedIn or shoot me an email if you'd like to discuss potential opportunities or collaborations!

🚀 Let's Build Something Amazing Together!