Project brief: Build a portfolio website with React.
- React
- JavaScript
- HTML
- CSS
In this project I created my own portfolio website using React. I gathered all the data about each project, location of img files, etc. into a json file. This makes it easier to update the website in the future. I started by creating different components for each project (eg. name, image, tags, links) to reuse them for each project. Using .map I could then mount each project onto the website. To display the projects I decided to use a caroussel (React Slick). For each project I created a mockup in Canvas and linked to their GitHub Repo and to where they are deployed. I then created the other sections and also created a reusable component for the skill columns. As I wanted a responsive website, I then styled the page following the mobile first principle and then after that building the tablet and desktop versions. Added hover effect and a favicon.
Project is deployed here: Portfolio
Once cloned, navigate to the project's root directory and this project uses npm (Node Package Manager) to manage its dependencies.
The command below is a combination of installing dependencies, opening up the project on VS Code and it will run a development server on your terminal.
npm i && code . && npm run dev