These are my reading notes for Code Fellows
React is great for constructing user interfaces and is made up of things called “components”
Components made up of props or properties
the render method returns a description, or a React element
Seems to be much more efficient at displaying HTML than what we learned in 201 with createElement and similar code. More intuitive and neater
“Passing props is how information flows in React apps, from parents to children” (source for quote here)
Arrow function syntax: make sure to remember the () =>! It’s a common mistake to forget, and leads to errors (or at least unintended results)
Get code to “remember” things by using states
You can view a React component tree by using a browser’s console. Should come in super handy! Just have to install React dev tools
I thought this following line of code (taken from this.state.squares) beautifully summarizes how visually pleasing and intuitive React seems to be:
[
'X', null, 'X',
'null', 'O', 'O',
'X', null, null,
]
null wherever an X or O has not yet been placed. So awesome!In React, it’s conventional to use on[Event] names for props which represent events and handle[Event] for the methods which handle the events.
Controlled components - this seems important but wasn’t expanded upon in the article
.slice() is mentioned in the article. We used this in our 201 final project and JB explained it to us.
By not mutating data (or using immutability), we can relatively easily add undo/redo functionality to our games/apps. It keeps “previous versions… intact” (source for quote here)
JSX allows us to write code that looks like this:
const hello = <h1>hello!</h1>