React + typescript = bliss

we can have nice things again! 

With Mark Dewey

Core Instructor @ Suncoast Developers Guild

 

Welcome!

I'm Mark, nice to meet you!

We are gathered here tonight to talk

REACT, Hooks and TYPESCRIPT

follow along here: https://sdg.codes/hooks-and-typescript

what is react?

- React is a JavaScript library that makes writing front-end applications easy. 

- React has a declarative, component-based, stateful philosophy that helps organize code in a clean manner

 

LET's see some code!

hooks!

- Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class.

- Hooks are functions that let you “hook into” React state and lifecycle features from function components. 

coding time!

what is typescript?

- typed superset of JavaScript that compiles to Pure JavaScript

 

- brings static type checking to the JavaScript

 

What happens when we bring it all together?

A DECLARATIVE COMPONENT BASED FRAMEWORK THAT ALLOWS US TO CONTROL NOT ONLY THE FLOW BUT ALSO THE SHAPE OF OUR DATA.  

ALL while Establishing rules and guidelines around our data.

Creating a better experience for developers while using a modern ideas to produce better code. 

time for some code!

...

What did we learn?

The Good!

- hooks help control the complexity of React

- type safety eliminates an entire class of bugs

- code is more verbose and expressive

- features can be easier to add 

- developer experience feels good

The Bad.

- re-think React applications, sort of

- type systems can be annoying at times

- Code can get noisy 

- Rules can make trying simple ideas harder than it should be

In closing.

I would recommend using Hooks and TypeScript only where you need it.

 

Which is everywhere

Thanks for coming!

Any questions?

 

Stay in touch

mark@suncoast.io

Want to be developer? Apply today @ suncoast.io/apply

Want us to train your team? Let us know!