eliac7 / portfolio-in-react Goto Github PK

My Portfolio

My portfolio was designed and implemented by me. You can visit the live version here.


· Report Bug · Request Feature

I made my portfolio to show what projects I have already worked on and get my hands dirty on the React.js concept. There is the front-end and the back-end. I used React.js with React-Bootstrap and Axios to get my projects through the Rest API I made for the front-end part. Also, I used Firebase storage to save screenshots of my projects and EmailJS to complete the contact form. Additionally, I used YUP resolver to validate any fields, AOS for animating elements, Styled-Components, data React Data Table Component for showing users, and finally UUID to generate an ID before pushing the image to Firebase storage.

The back-end, wich comprises the REST API, you can find it here.

Except of the main homepage, an Admin dashboard has been made, which can do CRUD (Create, Remove, Update, Delete) operations for my projects and users.

(back to top)

• React.js
• React Bootstrap
• Firebase
• Axios
• EmailJS
• YUP
• AOS
• Styled-Components
• React Data Table Component
• UUID

(back to top)

(back to top)

To get a local copy up and running follow these simple example steps.

You will need npm.

• npm

  npm install npm@latest -g

1. Clone the repo

   git clone https://github.com/eliac7/portfolio-in-react.git

2. Install NPM packages

   npm install

3. Enter API tokens in .env

    REACT_APP_USER_ID = FROM_EMAILJS
    REACT_APP_TEMPLATE_ID = FROM_EMAILJS
    REACT_APP_FIREBASE_API_KEY = GET_IT_FROM_FIREBASE
    REACT_APP_FIREBASE_AUTH_DOMAIN = GET_IT_FROM_FIREBASE
    REACT_APP_FIREBASE_PROJECT_ID = GET_IT_FROM_FIREBASE
    REACT_APP_FIREBASE_STORAGE_BUCKET = GET_IT_FROM_FIREBASE
    REACT_APP_FIREBASE_MESSAGING_SENDER_ID = GET_IT_FROM_FIREBASE
    REACT_APP_FIREBASE_APP_ID = GET_IT_FROM_FIREBASE
    REACT_APP_FIREBASE_MEASUREMENT_ID = GET_IT_FROM_FIREBASE
    REACT_APP_RECAPTCHA_SITE_KEY = GET_IT_FROM_GOOGLE_RECAPTCHA
    REACT_APP_RECAPTCHA_SECRET_KEY = GET_IT_FROM_GOOGLE_RECAPTCHA
   

(back to top)

Distributed under the GNU General Public License v3.0. See LICENSE.txt for more information.

(back to top)

Ilias Thalassochoritis - @ilias_thal - elias_thal[at]hotmail.com

Project Link: https://github.com/eliac7/portfolio-in-react

(back to top)