Slide 1

Slide 1 text

Rails & ReactJS Use case e estratégias Daniel Vinciguerra

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

React JS

Slide 4

Slide 4 text

Biblioteca criada pelo 
 Facebook para a criação de UI

Slide 5

Slide 5 text

Biblioteca criada pelo 
 Facebook para a criação de UI

Slide 6

Slide 6 text

Components criados de forma declarativa que reagem a estado

Slide 7

Slide 7 text

Otimizado para soluções que alteram demais o conteúdo das paginas

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

Vantagens

Slide 10

Slide 10 text

Simplifica o teste 
 e depuração de problemas

Slide 11

Slide 11 text

Favorece e a manutenção
 e o reaproveitamento do código

Slide 12

Slide 12 text

Com foco na solução de 
 um problema de forma otimizada

Slide 13

Slide 13 text

Components

Slide 14

Slide 14 text

Syntax sugar que auxilia criar
 componentes baseada no HTML

Slide 15

Slide 15 text

JSX não é obrigatório 
 mas facilita demais o trabalho

Slide 16

Slide 16 text

Um exemplo de implementação
 mais antiga que vemos em projetos

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

Agora a mesma forma 
 utilizando o componentes do ReactJS

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

E uma mesma implementação utilizando apenas funções

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

E uma mesma implementação utilizando apenas funções

Slide 23

Slide 23 text

Use cases

Slide 24

Slide 24 text

Utilizar o ReactJS 
 em um projeto legado é fácil

Slide 25

Slide 25 text

https://reactjs.org/docs/try-react.html

Slide 26

Slide 26 text

https://reactjs.org/docs/add-react-to-an-existing-app.html

Slide 27

Slide 27 text

Existem excelentes alternativa mais integradas ao Rails

Slide 28

Slide 28 text

https://rubygems.org/gems/react-rails

Slide 29

Slide 29 text

https://github.com/reactjs/react-rails

Slide 30

Slide 30 text

E formas mais modernas
 de se utilizar dependências JS

Slide 31

Slide 31 text

https://webpack.js.org/

Slide 32

Slide 32 text

https://github.com/rails/webpacker

Slide 33

Slide 33 text

Começando?

Slide 34

Slide 34 text

Pensar em isolar sempre 
 que possível seus componentes

Slide 35

Slide 35 text

Buscar uma referência
 e discutir soluções costuma ajudar

Slide 36

Slide 36 text

Comece simples e evolua organicamente conforme a necessidade

Slide 37

Slide 37 text

Obrigado!