React by Example, Part 5 of 7: Cart Page
Interactive

React by Example, Part 5 of 7: Cart Page

LearnNow Online
Updated Jul 20, 2020

Course description

React is a Javascript library for building user interfaces. This course covers the Cart page, setup functionality for item addition and subtraction or clear the car completely.

Each LearnNowOnline training course is made up of Modules (typically an hour in length). Within each module there are Topics (typically 15-30 minutes each) and Subtopics (typically 2-5 minutes each). There is a Post Exam for each Module that must be passed with a score of 70% or higher to successfully and fully complete the course.


Prerequisites

This course is a continuation of the React Series. React, Part 1 of 7: React Basics React, Part 2 of 7: Intermediate React React, Part 3 of 7: City Tours Project React, Part 4 of 7: Advanced React React, Part 5 of 7: TODO Project React, Part 6 of 7: Food2Fork Project React, Part 7 of 7: Tech Store Intro Part 7 of 7 will be very helpful as the Tech store buildout is continued


Meet the expert

John Smilga

John Smilga is a Front-End Web Developer in the Los Angeles Area. John has a Bachelor’s Degree in Software Development. He spends most of his time working with Javascript, CSS3, and HTML5, and he is passionate about everything related to web development. He learns from the community and loves to share with the community what he has learned. He strives to explain very complex topics in a simple manner that everyone can understand.

Video Runtime

88 Minutes

Time to complete

152 Minutes

Course Outline

Cart Page

Initial Setup (15:20)

  • Introduction (00:13)
  • Initial Setup (05:02)
  • Cart Page (06:06)
  • Cart Page.JS (03:50)
  • Summary (00:08)

Cart Columns Component (09:47)

  • Introduction (00:08)
  • Cart Columns Component (04:29)
  • Create Container (05:01)
  • Summary (00:08)

Cart Totals Component (08:15)

  • Introduction (00:08)
  • Cart Totals Component (05:04)
  • Clear Cart (02:54)
  • Summary (00:08)

Cart List Component (10:20)

  • Introduction (00:08)
  • Cart List Component (05:35)
  • Empty Cart (04:28)
  • Summary (00:08)

Cart Item Component (24:22)

  • Introduction (00:08)
  • Cart Item Component (11:10)
  • Price (12:55)
  • Summary (00:08)

Cart Functionality (20:13)

  • Introduction (00:08)
  • Cart Functionality (09:46)
  • Remove Item (03:43)
  • Clear Cart (06:26)
  • Summary (00:08)