Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/manthanank/react-portfolio
React Resume Portfolio
https://github.com/manthanank/react-portfolio
css javascript portfolio react reactjs
Last synced: about 7 hours ago
JSON representation
React Resume Portfolio
- Host: GitHub
- URL: https://github.com/manthanank/react-portfolio
- Owner: manthanank
- Created: 2022-07-31T07:29:45.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-04-21T17:44:21.000Z (7 months ago)
- Last Synced: 2024-04-21T23:20:41.672Z (7 months ago)
- Topics: css, javascript, portfolio, react, reactjs
- Language: JavaScript
- Homepage: https://react-portfolio-manthanank.netlify.app/
- Size: 22.1 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# React JS Portfolio
![Screenshot](screenshot.png?raw=true "React JS Portfolio Stater Pack ")
## [LIVE DEMO](https://react-portfolio-manthanank.netlify.app/)
## Portfolio Description
This portfolio is made using React. The data on the portfolio is directly linked to a JSON file. Any changes to the portfolio can be made in the JSON file. The changes will then be reflected on to the portfolio. This allows you to customize your own personal portfolio that can be used for applying to jobs or other personal uses.
## 1. Make sure you have NODE installed
Firstly, you will need to download the latest version of Node by [CLICKING HERE](https://nodejs.org/en/download/) and following the installation instructions.
## 2. Clone the repo
Next, you will need to run the following command in the Terminal to clone the repo onto your machine.
```git clone https://github.com/sonnysangha/Resume-Portfolio-Starter-pack.git```
## 3. Install Dependancies
Next, you need to install all the dependancies using:
```npm install```
Once this is done, you can start the app with:
```npm start```
## 4. Fill in your personal info
To populate the website with all of your own data, open the public/resumeData.json file and simply replace the data in there with your own. Images for the porfolio section are to be put in the public/images/portfolio folder.
## 5. (OPTIONAL) Replacing images and/or fonts
If you want to display your own pictures then you have to replace the files at these locations: public/images/header-background.webp and public/favicon.ico. FILE NAMES MUST NOT BE CHANGED else the code referencing these images will no longer work.
## 7. Finalising Resume
Once all the formatting and data input is finalised, run `npm run build`. This will create a dedicated build folder.
## 8. Host Resume Online
1) Open the build folder in the finder screen
2) Go to [Netlify](https://www.netlify.com/) and set up a profile
3) Go to the 'Sites Tab'
4) Simply Drag and drop the 'Build' Folder into the designated upload space
5) The app will begin deploying & the deployment URL will be presented!🚀 BOOM, you are now LIVE!!!
## Credits
### Original Idea
[Inspiration from Tim Baker (tbakerx)](https://github.com/tbakerx/react-resume-template/blob/master/README.md)
[Tim Baker](https://github.com/tbakerx)
Repo Link: [URL](https://github.com/tbakerx/react-resume-template)
[Sonny Sangha](https://github.com/sonnysangha)
Repo Link: [URL](https://github.com/sonnysangha/Resume-Portfolio-Starter-pack)
[PapaReact](https://github.com/PapaReact)