/react-frontend-dev-portfolio

Easy to adapt and deploy React portfolio inspired with solutions found at GitHub.

Primary LanguageSCSSMIT LicenseMIT

portfolio template mockup
portfolio mobile demo gif

react icon

Portfolio Template

⭐ Easy to adapt and deploy portfolio project covering most important 
sections(about, exp, skills, projects), inspired with solutions found 
at GitHub. Check live preview(link below).

👑 advantages

multilingual   mobile friendly   light/dark mode   json fetched data   minimalistic   expandable


👁️‍🗨️ Live demo

Check live demonstration here

react frontend dev portfolio preview

📚 Getting started

  1. Clone or fork project.
  2. Install required dependencies with npm install.
  3. Remove or set homepage in package.json to single dot.
  4. npm start project and customize it.
  5. Deploy on github-pages using npm run deploy command.
⚠️ Note that if you have portfolio on different repository than `{username}.github.io`, 
set `homepage` in `package.json` to `https://{username}.github.io/{repository}/` 
before deploying portfolio.

⭐ Inspirations

React Vertical Timeline
React Awesome Slider
React Switch
React Typical
Iconify Design
Polaroid effect
GitHub Ref Corner

📝 Changelog

[ 26.05.2021, contributor: @DavidMatalik ]
- removed nonexisting logos references: logo192 and logo512.  
[ 17.01.2021, contributor: @igorperic17 ]
- wrapped the Typical component into a fixed height div due to the bad transitions for a brief moment between two titles when the string is empty (the content bellow jumps up-down very quickly).
- removed the title from the page document.title due to the increased title length.
[ 30.11.2020, contributor: @dorota1997 ]
- updated readme section
- fixed problem of json files not being read
[ 29/30.11.2020, contributor: @trolit ]
- changed resume files names to more "universal"
- moved languages names to global variables
- moved section names to json files
- added target="_blank" for footer links
- added startDate property for projects
- excluded common json data to portfolio_shared_data file
- added header section height calculation based on formula: window.innerHeight - 140
- small changes to vertical timeline item (color/font-size)
- project link in modal is not shown if empty
- changed slider preloader bar color
- wrapped each skill into tile
- footer fullname is fetched from json now
- added mising "px" for avatar in About.js component
- updated json files content
- page title is fetched from json data
- added GitHub reference corner "label"
- edited page meta
- added margin, padding 0 for html tag
- excluded light theme ref from theme-dark file
- slightly changed Header.js section look
- made some changes to App.js to apply global variables/shared json etc.
- centered fullname/pos/theme toggler in Header section

⚙️ Contribution

If you have any suggestions on what to improve in react-frontend-dev-portfolio and would like to share them, feel free to leave an issue or fork project to implement your own ideas 🙂

📷 Credits(images)

Images used in portfolio template come from Pixabay, references:

p1, p2, p3, p4, p5, p6