hotell / blogposts Goto Github PK

• how was it done prior to TS 2.9
• showcase class/functional components + why's
• why SFC cannot be used for generic component definition

type Props =
  | { moo: string; children: React.ReactChild }
  | { as: 'button'; foo: number; children: React.ReactChild }

function Button(props: Props) {
  return <React.Fragment>{props.children}</React.Fragment>
}

function App(){
return <>
 <Button as="button" foo={12312}>hello</Button>
 /* NO ERROR */
 <Button moo="what" foo={13333}>world</Button>
</>
}

Let's cover how it can be solved ;)

static ofType

• why types are useful/needed beyond application logic ( for our dev-stack tooling configuration )
• what did we use till now ( ts-node, tsc && node ... )
• showcase by using JSDoc and @ts-check to write simple Webpack config
  • hoisting all types on top of file
  • extracting types to separate files ( pattern )
  • defining ambient types for 3rd party libraries that don't have types ( pattern )
• typing jest and prettier config
• validation npm-script

• long awaited successor of part 1
• using techniques from 1st part combined with new techniques for handling side-effects
• showcased on redux-observable and ngrx/effects