Steps done during development

[vikramvi]

VS Code

• Extensions ( Bracket Pair Colorizer, Highlight Matching Tag, Indent Rainbow, Live Server, Prettier - Code Formatter, vscode-styled-components )

JS + React

• create dummy react project
• get existing setup files
• get google fonts ( add to index.html ), font awesome ( using npm ), bootstrap ( using npm )
• App.css : clear existing entries and add new styles
• create different components ( navbar, items, cart, item description, default page )
• install react router package
• Do changes as per react router dom logic
• Navbar component add functionality
• install react-style-component package
• create styled component for button in navbar
• context api to pass data from data.js to all the child components
• work on ProductList component ( show all product images )
• work on Product component ( image, cart icon, footer ), styled component to style product, propTypes
• fix context.js to handle object reference issue and not to modify original data accidently
• work on Detail component ( get data from context, link, button styled component )
• add props in ButtonContainer styled component
• code added to show correct product detail page
• code added to update product properties when Add to Cart operation is performed
• Model related code is added
• Cart component ( add placeholder properties, methods inside context component, )
• add child components under Cart ( Cart Columns, Empty Cart , add total, remove all items, remove single item )
• deploy to netlify with github repo
• install paypal package, add paypal button to do sandbox purchase
• add env key in netlify, also create .env.development file locally