holtzmann-training.md

Holtzmann Training

Overview

Install Holtzmann

• nvm/node
• run project

Explain overall reasoning

• where we came from (jade, meteor)
• learned a lot
• show mess
• why lint, type, test, refactor?
• goal for this is understanding. gonna be slow. please stop me. please ask questions.

Action Buttons

• demo
• 2 files that make this up
• data vs presentation

import/export

• named vs default
• draw example
• prefer default
• packages vs app files
• aliases

graphql

• query
• template literal tag
• graphiql app
• client token
• demo saved query

redux

• client side global store

• subscribe

• dispatches

• show how it's built

• creation of store

• actions

• types

• reducers

  • spread
  • object syntax

• sagas

ES6 Class Syntax

• vs createClass
• a lot nicer to write
• same at end of the day

PropTypes

• declare props and types passed to component
• will be replaced by flow types

State

• declared as variable on class
• vs constructor
• state change = re render
• action buttons index state not used

Class methods

• functions
• could be static if no this
• refs
• passed to stateless components
• can write jsx in methods

Lifecycle functions

• used to manage life of component
• can optimize performance of components

Render

• jsx markup
• can do some logic outside of return
• we want these to be small
• no if statements
• i don't think we need try/catch anymore?
• render re-run when state or props updated, can be forced or prevented

Props

• blah blah

Stateless Components

• best practice whenever possible
• should be the standard for our view layers going forward

CSS

• style objects
• classes