ReactJS Logo

Falando um pouco sobre ReactJS

Daniel Laurindo
Daniel Laurindo {{Full Stack Developer}}
ExceedLabs
   
laurindo
@dslaurindo
https://goo.gl/rkmZCT
Tecnologias Exceed Labs

Full-Stack Developer

"É o desenvolvedor que consegue inserir bugs em todas as camadas do software."

PROBLEMA

Gargalos de Performance

AppendChild do Mal
Example DOM

FINALIDADE/PROPÓSITO

VIRTUAL DOM

Virtual DOM x Real DOM

Frameworks que usam Virtual-DOM

Outras libs baseadas no virtual DOM
Empresas que usam ReactJS
Hello World

Hello World

CommonJS CommonJS Tools

DOIS ATRIBUTOS PRINCIPAIS

Props(Propriedades)

State(Estado)

Props(Propriedades)

- É através das props que podemos passar e acessar valores para os nossos componentes

- Props são imutáveis

Props Example

State(Estado)

- O que torna o ReactJS dinâmico são os states

- State são mutáveis

Composição

Thinking in React

Thinking in React

Robots List

Robots List
Dois componentes

Container Title

Componente Container Title

Card Robots List

Componente Card Robots List

Image Robot

Componente Image Robot

TitleRobot

Componente Title Robot

Renderizando Container

Renderizando o compoente Container

Ciclo de Vida

1 - getPropsDefault

2 - getInitialState

3 - componentWillMount

4 - componentDidMount

5 - componentWillUnmount

getPropsDefault

getInitialState

componentWillMount

componentDidMount

componentWillUnmount

Foi isso que quis mostrar a vocês,

OBRIGADO.