Build an awesome developer portfolio website.

As a software developer, it's important to have a robust portfolio website that can display our abilities and experiences. To assist other developers, I have designed a portfolio website using Next, Tailwind CSS, and EmailJS. In this article, I will provide a step-by-step guide on the setup process, along with the GitHub link.

Here is the live preview:
Live preview url

STEP 01:
Clone the Repository using GitHub link and change the directory to the developer-portfolio.

git clone https://github.com/itzmesalamu/who-is-salamu.git cd developer-portfolio 

STEP 02:
Now install all packages using npm or yarn.

npm install # or yarn 

After installation, all packages, Now change all data on utils/data/* according to you. For example:

export const personalData = { name: "Salamu", profile: "/profile.png", designation: "Full-Stack Software Developer", description: "My name is Salamu....", email: 'itzmesalamu123@gmail.com', phone: '8709611320', address: 'Chennai,TamilNadu,India ', github: 'https://github.com/itzmesalamu', facebook: 'https://www.facebook.com/itzmesalamu/', linkedIn: 'https://www.linkedin.com/in/itzmesalamu/', twitter: 'https://twitter.com/itzmesalamu', stackOverflow: 'https://stackoverflow.com/users/itzmesalamu', leetcode: "https://leetcode.com/itzmesalamu/", devUsername: "itzmesalamu", resume: "https://itzmesalamu.netlify.app" }; 

The devusername properties replace it with your dev.to username and it will fetch all blogs from your dev.to website.

STEP 03:
Now we will make a .env file and set up our Email.JS credential in a .env file. I am using EmailJs in this project for the user to send mail to me and It's free. The .env file will be the following:

NEXT_PUBLIC_EMAILJS_SERVICE_ID = NEXT_PUBLIC_EMAILJS_TEMPLATE_ID = NEXT_PUBLIC_EMAILJS_PUBLIC_KEY = 

First of all, go to Emailjs.com and sign up for an account.

Make a email service using Gmail and take the Service ID and add it .env file as REACT_APP_YOUR_SERVICE_ID value.

Then make a Email template and take Template ID from the template setting and use it .env.

Then go to Account and take Public Key and use it in .env.

STEP 04:
Now the portfolio website is ready for the run. You can run it using npm or yarn.

npm run dev # or yarn dev 

If you like the portfolio project Please give it a star on the GitHub Repository.
You can connect with me on Linkedin: https://www.linkedin.com/in/itzmesalamu/