Calculator Project: JavaScript

Calculator: JavaScript

• 
  00:00:00 - 00:04:24

  Adding JavaScript to the Calculator

  Brian Holt introduces the next project, which is to add JavaScript to the calculator that was previously coded with HTML and CSS.
• 
  00:04:25 - 00:09:22

  Calculator HTML & CSS Setup

  Brian demonstrates how to get the HTML & CSS to use for building the second part of the calculator project.
• 
  00:09:23 - 00:18:23

  Writing the JavaScript

  Brian jumps into coding the inner workings of the calculator, and analyzes the planning process for each piece.
• 
  00:18:24 - 00:19:53

  Examining Events in the Browser

  Brian demonstrates what an event looks like in the browser, and also how to test the calculator by logging to the console.
• 
  00:19:54 - 00:26:14

  Handling Symbols & Numbers

  Brian breaks down the structure of the calculator functionality by planning how best to handle numbers and symbols.
• 
  00:26:15 - 00:30:18

  Displaying to the Screen

  Brian codes the part of the program to display the running total to the calculator screen.
• 
  00:30:19 - 00:34:43

  Inserting Symbols

  Brian begins coding the section of the program that handles mathematical and other symbols.
• 
  00:34:44 - 00:36:20

  Rerendering

  Brian demonstrates how to display changes to the calculator screen when the calculator state changes.
• 
  00:36:21 - 00:40:44

  Handling Back Arrow

  Brian discusses different ways the back arrow functionality can be implemented.
• 
  00:40:45 - 00:47:19

  Handling Math

  Brian codes the first part of the functionality that handles mathematical symbols on the calculator.
• 
  00:47:20 - 00:53:48

  Flush Operation

  Brian implements the code that performs math and then demonstrates how to debug code by logging to the console.
• 
  00:53:49 - 00:59:07

  Equals

  Brian adds the functionality for the equals button to the calculator.
• 
  00:59:08 - 01:09:27

  Review and Q&A

  Brian summarizes the logic of the calculator's JavaScript code and then adds functionality for the back arrow.
• 
  01:09:28 - 01:14:01

  Debugging

  Brian demonstrates some of the capabilities of the debugger tool within the developer console.