GraphQL

A query language for your API

GraphQL

A query language for your API

me

GraphQL

React

React

A JavaScript lib for building cool things

React

A JavaScript lib for building cool things

me

React

Chinese Giant Salamander

what

is

 

react?

react

modern javascript library helping developers quickly build dynamic UI's across platforms

quickly

single page application

declarative

component

 

based

learn once,

write anywhere

Code

class HelloMessage extends React.Component {
  render() {
    return (
      <div>
        Bye {this.props.name}
      </div>
    );
  }
}
<HelloMessage name="Tony" />

bye

tony

<script src="https://unpkg.com/react@16/umd/react.development.js" 
	crossorigin></script>
    
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" 
	crossorigin></script>

jsx

a javascript extension that allows us to write XML in JavaScript

XML in JavaScript

render() {
    return (
      <h1 className='large'>Hello World</h1>
    );
 }
render() {
    return (
      React.createElement(
        'h1',
        {className: 'large'},
        'Hello World'
      )
    );
  }

FIRST

APP

npx create-react-app my-app
cd my-app
npm start

React

vs

Angular

Angular

React

  • framework

  • dom

  • html

  • 2-way binding

  • library

  • virtual dom

  • jsx

  • 1-way binding

sooo why

angular?

rEaCt Is BeTtEr tHaN aNgUlAr

me

me

Enterprise Architecture

Standards

you

your boss

learning new tech

"Hey kid, I've got some front end frameworks down here"

coming back to csx and theres no new tech

me

goin with the flow

learn a new

language!

write an rfc!

open source!

tony

goodbye

Tony Scialo

Lead Front End Engineer

@

Simplifeye

@tony-scialo

tonywritescode.com

QUESTIONS?

React

By arscialo

Made with Slides.com

React

NGRX presentation for ng Meetup

  • 36

More from arscialo