58 / 68
58
DICAS PARA PROGRAMAR DE UMA
MANEIRA FÁCIL E DESCOMPLICADA
CODE/
REACT
120
MINUTOS
CONHECI-
MENTOS DE
JAVASCRIPT
INTER-
MEDIÁRIO
ais uma biblioteca
javascript? Quem
precisa de mais
uma biblioteca
javascript? Como justificar
o esforço para vencer a
curva de aprendizado, se
já há tantas mais antigas e
mais conhecidas?
A novidade é: a biblioteca
React não é apenas mais uma.
Tem características próprias e
foi criado pelo Facebook para
conceber interfaces. Isso faz toda
GLIHUHQ©D H MXVWLíFD R HVIRU©R GH
aprendizado e migração.
Seu foco é na interface
de aplicativos, baseada em
componentes. É possível usar
bibliotecas complementares de
terceiros sem problema. Boa parte
do desenvolvimento do Facebook
é feito com React. O Instagram
é totalmente construído a partir
dessa biblioteca.
O React usa um conceito
chamado “virtual DOM”
(Document Object Model) que
processa “nós” de árvores e
“subárvores” (nodes, childs,
trees) dependendo de seu
estado. Isso permite a menor
extras para auxiliar na
finalização. O próprio Facebook
fornece algumas (veja link no
final deste tutorial).
JSX
React pode usar uma
extensão chamada JSX que
simplesmente permite inserir
sintaxe HTML no código
JavaScript, de forma a utilizá-lo
como um template. Este é um
exemplo:
<script type="text/jsx">
/** @jsx React.DOM */
ReactDOM.render(<h1>Hello,
world!</h1>,
document.
getElementById('myDiv')
);
</script>
Mas não é necessário usar
JSX. É possível escrever em
JavaScript puro sem problema:
React.render(
M
Página inicial do
Instagram: rede
social de fotos é
baseada em React
Produzamais com
React
Use biblioteca javascript para criação de interfaces
Por Homero Ottoni
quantidade de manipulação
DOM possível para manter os
componentes atualizados.
Quando se altera um
componente ou elemento com
React, ele aplica um algoritmo
de detecção de mudanças e
renderiza apenas os pontos
alterados – e não todo
componente, do zero, como
geralmente seria necessário.
Um aspecto que é preciso
considerar é que a biblioteca
React não é um framework
completo. Podem ser precisos
componentes e ferramentas
REVISTA LOCAWEB