Giter Site home page Giter Site logo

mugheesmb / developeridentity Goto Github PK

View Code? Open in Web Editor NEW
23.0 3.0 9.0 2.02 MB

Developers Identity(Portfolio) Template that helps you showcase your work and skills as a software developer.

Home Page: https://mugy.tech/

License: MIT License

HTML 4.98% CSS 37.85% JavaScript 57.16%
portfolio portfolio-website portfolio-template template developers developersidentity portfolio-sites reactjs-template reactjs-portfolio react-js

developeridentity's Introduction

Software Developers Identity(portfolio) ๐Ÿ”ฅ

The most amazing ,beautiful, simple and responsive portfolio template for Software Developers!

Made With React License

##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-js framework of javascript and that's why we need nodejs and npm installed.
  • After the successful installation of nodejs and npm, 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.json and enter your domain name instead of https://developerfolio.js.org/ in homepage variable. For example, if you want your site to be https://<your-username>.github.io/developerIdentity, add the same to the homepage section of package.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 :)

developeridentity's People

Contributors

mugheesmb avatar mugybro avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

developeridentity's Issues

loading problem

There is problem with loading , making cofee text should be under the loading....!!!

Logo problem

Logo is not showing on the left side of navbar....

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.