![Personal Portfolio](/projects/Portfolio/Portfolio.png)
Project Description
It is built using Next.js, a React framework that enables server-side rendering and other powerful features. The website is designed to showcase my skills, projects, and other relevant information.
Tech Stack Skills
Technologies used in the development of the project.
Next.js
Vercel
TypeScript
React
Screenshot Project
Details
Name: Personal Portfolio
Status: Completed
Year: October 2023
Preview
Home Page
The home page features a brief introduction about me, my skills, and my projects. It also features a link contact form and to my resume. The home page also features a music toggle button that allows the user to play a bgm while viewing my portfolio.
![Home Page](/_next/image?url=%2Fprojects%2FPortfolio%2FHome.png&w=1920&q=75)
Top Skills
The top skills section features my top skills with a stunning. The top skills is animated using Framer Motion. It is also responsive and changes its width and number of skills to be displayed in single row according to the screen size.
![Top Skills](/_next/image?url=%2Fprojects%2FPortfolio%2FSkills.png&w=1920&q=75)
Instagram Feed
The Instagram feed section features my latest Instagram posts. It is built using the Instagram Widgets by Behold.so (third-part provider).
![Instagram Feed](/_next/image?url=%2Fprojects%2FPortfolio%2FIG.png&w=1920&q=75)
Github Contributions
Integration with GitHub allows dynamic fetching and display of GitHub-related data, such as followers, following, total stars and contributions.
![Github Contributions](/_next/image?url=%2Fprojects%2FPortfolio%2Fgithub.png&w=1920&q=75)
Contact Page
The contact page features a contact form that allows the user to send me a message. The contact form is built using Emailjs, a third-party provider.
![Contact Page](/_next/image?url=%2Fprojects%2FPortfolio%2Fcontact.png&w=1920&q=75)
Calendly Integration
Integration with Calendly allows the user to schedule a meeting with me. The Calendly widget is embedded in the website.
![Calendly Integration](/_next/image?url=%2Fprojects%2FPortfolio%2Fcalendy.png&w=1920&q=75)
![Personal Portfolio](/projects/Background.png)