developerIdentity
developerIdentity copied to clipboard
Developers Identity(Portfolio) Template that helps you showcase your work and skills as a software developer.
Software Developers Identity(portfolio) 🔥
The most amazing ,beautiful, simple and responsive portfolio template for Software Developers!
##Sections 📚
✔️ Summary and About me
✔️ Skills
✔️ Github Profile
✔️ Projects
✔️ Contact me
To view a live example, click here
Getting Started....
- The website is completely built on
react-jsframework ofjavascriptand that's why we neednodejsandnpminstalled. - After the successful installation of
nodejsandnpm, clone the repository into your local system using below command:
# Clone this repository
$ git clone https://github.com/MugheesMb/developerIdentity.git
# Go into the repository
$ cd developerIdentity
# Install dependencies
$ npm install
#Start's development server
$ npm start
Customize it to make your own portfolio ✏️
package.json
Open this file, which is in the main cloned directory, choose any "name" and change "homepage " to https://<your-github-username>.github.io. Do not forget the https://, otherwise fonts will not load.
Personal Information
First of all go to src/components/main/Main and go to line number 17
I' m Your name.</span> change this with your name
Skills
Now go to src/component/data/skillsData and change this with your skills..
{
id: '1',
title: 'HTML5 / CSS3', // change this with your skill name
icon: 'fab fa-html5', // go to fontawsome and find your desire icon and paste it here
percent: 99, // change this to how much percent you are good at this skills
barloading: 98 // barloading show on display
},
{
id: '2',
title: 'SASS / SCSS / Responsive web', // change this with your skill name
icon: 'fab fa-sass', // go to fontawsome and find your desire icon and paste it here
percent: 90, // change this to how much percent you are good at this skills
barloading: 90 // barloading show on display
},
Do same with rest of skills and if you want to add more skills then , just copy this and paste and change its id to next number ...
{
id: '2',
title: '',
icon: '',
percent: ,
barloading:
},
Projects
Now go to src/component/project/Projectdata and change this with your project data...
{
info: 'write your app little info here',
linkUrl: 'deployment link',
title: ' your app name',
imageUrl: df ,
id: 1,
},
{
info: 'write your app little info here',
linkUrl: 'deployment link',
title: ' your app name',
imageUrl: df,
id: 2,
},
if you want to add more projects then , just copy this and paste and change its id to next number ...
info: 'write your app little info here',
linkUrl: 'deployment link',
title: ' your app name',
imageUrl: df ,
id: 1,
if you want to do changing in about me , then you do by going to src/component/about/About and line number 15
Contact Me
Now go to src/component/footer/footer and change this with your information
<span > write your email here </span> // On line number 16
<span > write your number here </span> // on line number 22
<span > put your linkdin link here</span> on line number 24
Deployment 📦
When you are done with the setup, you should host your website online. We highly recommend to read through the Deploying on Github Pages docs for React.
Deploying to Github Pages
This section guides you to deploy your portfolio on Github pages.
-
Navigate to
package.jsonand enter your domain name instead ofhttps://developerfolio.js.org/inhomepagevariable. For example, if you want your site to behttps://<your-username>.github.io/developerIdentity, add the same to the homepage section ofpackage.json. -
Follow through the guide to setup GitHub pages from the official CRA docs here.
Contributing 💡
If you can help us with these. Please don't hesitate to open a pull request.
plz give star on github :)