Homework #2

Instructions

---

1. Feynman Writing Prompts - Write out explanations of the following concepts like you are explaining it to a 12 year old. Doing this will help you quickly discover any holes in your understanding. Ask your questions on Slack.

   • arrow functions - a shorter way to write a function that has only a simple return statement
   • state - a variable accessed and updated by a react component to tell how to interpret information
   • constructor - used for creating objects of a standard type, can edit prototype to add methods
   • setState with a callback function - after setState is completed, it will run the callback function
   • setState with an object passed in - includes keys that will be updated
   • .bind - used so that a function will be able to reference "this" as called by the react component
   • functional components vs class components - functional is used for simple rendering of props; class is used for more advanced components requiring state and functions
   • onClick - an html value that calls a react function

2. Fork and clone this repo. When you need to commit use the following commands.

   • Run: npm install -g create-react-app
   • Create a boilerplate React app called clock. create-react-app clock
   • Navigate into /clock and run the command: npm start
   • Your <App /> component will render a <NavBar /> and a <Clock /> component.
   • Create a file called NavBar.js and a file called Clock.js
   • <NavBar /> and <Clock /> will both be React components. <NavBar /> should display the title of your page in a larger font.
   • <Clock /> will display a clock that updates every second. (You will need to use the Date object.)
   • Date example: const now = new Date(); now.getHours(); now.getDay(); now.getMinutes(); now.getSeconds(); etc.
   • Create a clock that updates every second. JavaScript's setInterval(cb, miliseconds) function allows you to specify code that runs after a set time.
   • Style <Clock /> and try to make it look nice.

Congratulations on finishing Homework #2!

For more information about our other courses visit: https://www.lambdaschool.com