/Personal-Portfolio

React front end application built from scratch using React Styled Components, React Icons, and AOS (animate on scroll) library.

Primary LanguageJavaScript

Netlify Status


Personal Portfolio

Personal Portfolio Gif
Explore the site »

Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Roadmap
  5. Acknowledgements
  6. Contact

About The Project

This is a personal portfolio built to showcase my projects, provide links to their respective repositories and hosted sites, and facilitate contact with me through Netlify forms.

Built With

Getting Started

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

Prerequisites

  • npm
    npm install

Installation

  1. Clone the repo
    git clone https://github.com/samgold2020/Personal-Portfolio
  2. Install NPM packages
    npm install

Usage

The projects carousel displays the next project.id when the arrow is clicked. See the code below for further explination:

//set state for current project, initialize at zero
 const [current, setCurrent] = useState(0);
 const length = slides.length

 //create a function for nextSlide onClick
 const nextSlide = () => {
   //Create a ternary for setting state, if it reaches the end set it back to zero, otherwise add one to the current length
   setCurrent(current === length - 1 ? 0 : current + 1);
 };

//create a function for the previousSlide onClick
 const prevSlide = () => {
   setCurrent(current === 0 ? length - 1 : current - 1);
 };

 //If there is no data or the data is not an array, return null
 if(!Array.isArray(slides) || slides.length <= 0){
   return null;
 }

Roadmap

See the open issues for a list of proposed features (and known issues).

Acknowledgements

Contact

Sam Goldstein - @twitter - sgoldstein312@gmail.com

Visit the deployed site here!