I have recently developed my personal portfolio website using a stack of modern technologies and libraries. This website is designed to showcase my skills, projects, experiences, and provide a platform for easy contact. Here's a breakdown of the key components and technologies I used:
- Frontend Framework: Next.js 13
- JavaScript Library: React.js
- CSS Framework: Tailwind CSS
I used Framer Motion to create smooth and eye-catching animations throughout the website, providing an engaging user experience.
For sending styled emails from the contact form, I integrated the react-email library, which helped in crafting visually appealing email responses to user inquiries.
I leveraged the latest server actions introduced in Next.js 13 to send emails without the need for a separate API endpoint. This ensures a streamlined and efficient email communication process.
For email communication, I integrated the resend and Nodemailer library, allowing for efficient and secure email sending and handling of inquiries.
To validate and parse the data received from the contact form, I utilized Zod, a TypeScript-first data validation library, ensuring data consistency and security.
For displaying styled toasts and alerts throughout the website, I integrated react-hot-toast, enhancing the user experience by providing feedback on various interactions.
To accommodate user preferences, I implemented a dark and light theme toggle, allowing visitors to switch between different color schemes for improved readability and accessibility.
The website is deployed on Vercel, ensuring public availability and scalability. You can check out the live version of my portfolio website here.
This portfolio website showcases my skills, projects, and experiences while incorporating modern technologies and practices to provide a smooth and engaging user experience. It also facilitates easy communication with me through the contact form.