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.
STEP 01:
Clone the Repository using GitHub link and change the directory to the developer-portfolio.
git clone https://github.com/Sadekul-me/developer-portfolio
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:
name: "Sadekul Islam",
profile: '/profile.png',
designation: "Software Engineering",
description: "I am Sadekul Islam...
๐จโ๐ป My Belief: Technology is not just code; itโs an infinite world of creativity. ๐",
email: 'programersadekul@gmail.com',
phone: '+8801887271417',
address: "Sonaroy, Domar, Nilphamari - 5340",
github: 'https://github.com/Sadekul-me',
facebook: 'https://www.facebook.com/ProgramerSadekulIslam',
linkedIn: 'https://www.linkedin.com/',
twitter: 'https://x.com/SadekulIslam_me',
stackOverflow: 'https://stackoverflow.com/',
leetcode: "https://leetcode.com/u/sadekul_me/",
devUsername: "Sadekul_me",
resume: "https://drive.google.com/drive/folders/1KSL6LM6koIp1fMnRIa7pPscfVrdkWiD3"
}
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 Facebook: https://www.facebook.com/ProgramerSadekulIslam
Top comments (0)
Some comments may only be visible to logged-in visitors. Sign in to view all comments.