As a software developer, I know the importance of having a strong portfolio website to showcase our skills and experiences. I have developed a portfolio website using React.JS, MUI, and Email.JS for the software developer. In this article, I will share the GitHub link and setup process step by step with you.
Here is the live preview:
Live preview url
Clone the Repository using GitHub link and change directory to the developer-portfolio.
git clone https://github.com/said7388/developer-portfolio.git cd developer-portfolio
Now install all packages using
npm install or yarn
After installation, all packages, Now change all data on
src/data/* according to you. Here is seven file that contain all section data.
├── aboutData.js ├── contactsData.js data ├── educationData.js ├── experienceData.js ├── headerData.js ├── projectsData.js └── skillsData.js
contactsData.js file contains a
devusername properties replace it with your
username and it will
fetch all blogs from your
Now we will make a
.env file and setup 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:
REACT_APP_YOUR_SERVICE_ID='EmailJS service id' REACT_APP_YOUR_TEMPLATE_ID='EmailJS Template id' REACT_APP_YOUR_PUBLIC_KEY='EmailJS Public key'
First of all, go to Emailjs.com and signup for an account.
Make a email service using
Gmail and take the
Service ID and add it
.env file as
Then make a Email template and take
Template ID from the template setting and use it
Then go to Account and take
Public Key and use it in
Now the portfolio website is ready for the run. You can run it using
npm start or yarn start
If you like the portfolio project Please give it a star on the GitHub Repository.
You can coonect with me on Linkedin: https://www.linkedin.com/in/abu-said-bd/
Top comments (14)
You did a great job!
Pray for me 🥰
wow i love this design
Awesome work dude 💝. Keep it up.
Looks awesome 😃
Good work! Keep it up.
Thank You Bhai 🥰
Nice looking portfolio.
Can we use this as template?
Sure! you can.