Shop Page 1 / Step 1

Summary

Starting with create-react-app template

Notes

• Created the app using npx
• Took screenshot of the image
• Added CSS classes for image and alignment

Shop Page 2 / Step 2

Summary

Adding products list

Notes

• Downloaded multiple pictures from the internet for cookies
• Added additional CSS classes for products and listing
• Created products_data.js

Shop Page 3 / Step 3

Summary

Mapping products list

Notes

• Already did in Step 2
• Fixed error message: babel-preset-react-app by adding this to devDependencies: @babel/plugin-proposal-private-property-in-object

Shop Page 4 / Step 4

Summary

Improvements for the development experience

notes

• Added developer tools to Google Chrome
• Installed new plugin for VS Code: ES7 React/Redux/GraphQL/React-Native snippets

Shop Page 5 / Step 5

Summary

Refactoring and organization

Notes

• Created components folder and moved ProductItem into it
• Created images folder and moved all images into it
• Created new Component ProductList

Shop Page 6 / Step 6

Summary

More Refactoring

Notes

• Created Header component
• Created Home component
• Moved everything into home
• Cleaned up App.js

React Filtering Pets

Summary

Added pets page and made some changes

Notes

• Created PetsList
• Created PetsHome
• Created PetsItem
• fixed class to className in PetItem
• Added adopt props
• Added filterPets function