Conceitos do React (Fundamentos), Manuais, Projetos, Pesquisas de Tecnologia de Informação e de Computadores

Baixe Conceitos do React (Fundamentos) e outras Manuais, Projetos, Pesquisas em PDF para Tecnologia de Informação e de Computadores, somente na Docsity!

React

O que é React?

• Biblioteca para construção de interfaces;
• Utilizado para construção de Single-Page

Applications;

• Podemos chamar de framework?
• Tudo fica dentro do Javascript;
• React / ReactJS / React Native;

import React from 'react';

import './button.css';

import icon from './button.png';

function Button() {

return (

<img src={icon} !/>

!

JSX

• Escrever HTML dentro do JavaScript;
• Com React podemos criar nossos próprios

elementos;

!// Antes function Button() { return React.createElement( 'button', { type: button }, React.createElement( 'span', { class: 'icon' } ) ) }

! ! !// Com JSX function Button() { return ( ! ! ) } !// Nossos próprios elementos !// (componentes) function Header() { return }

Imperativo vs declarativo

const notificacoes = 0 ; function montaBadge(num) { if (notificacoes !!=== 0 !&& num > 0 ) { !// Adiciona badge !// container.appendChild(badge)!!... } if (notificacoes !!!== 0 !&& num > 0 ) { !// Apenas muda o número !// badge.innerHTML = num!!... } if (notificacoes !!!== 0 !&& num !!=== 0 ) { !// Remove badge !// container.removeChild(badge) } } !// Não comparamos com o estado anterior function Badge({ num }) { return (

{ num > 0 !&&

{num}!

} ! !

); }

BORA CODAR!