Para que este anexo encontre um projeto inicial, esse projeto inicial foi criado com o aplicativo Create React,
uma ferramenta criada pela equipe do React.
No final, o que facilita a criação de novos projetos de reação e nos fornece uma estrutura de projeto como essa.
Eu ajustei um pouco, mas geralmente é exatamente o mesmo que você obteria com essa ferramenta.
Agora, por que precisamos dessa ferramenta?
Por que simplesmente não importamos um script em nosso H.
Arquivo HTML e começar?
Porque React é um pouco mais complexo que o JavaScript baunilha.
No final, enviamos código JavaScript de baunilha, mas a maneira como escrevemos no código é um pouco mais conveniente para
nós, como desenvolvedor.
Podemos usar certos recursos que não seriam executados no navegador e, portanto, a configuração do projeto
aqui inclui algumas ferramentas que pegam o código que escrevemos como desenvolvedor e, na verdade, o convertem em
código executado em um navegador.
Então, tivemos o Neuroma, o código que é executado no navegador?
Mas é mais fácil escrever esse código como desenvolvedor.
Além disso, obtemos um servidor de desenvolvimento, que é um servidor simples que atende nosso aplicativo front-end, de
modo que não possui back-back e somente serve esse front-end e que recarrega ou injeta automaticamente
alterações sempre que alteramos e salvamos algo em uma de nossas fontes arquivos de código.
Além disso, aqui com o REACT, estamos construindo um aplicativo de página única.
Isso não é obrigatório, mas é uma escolha comum em um aplicativo de página única.
Você tem apenas um arquivo H Timal, que no final é retornado pelo servidor que atende esse aplicativo.
Nesse caso, esse arquivo Timmo de idade, que em si é relativamente vazio.
Mas esse arquivo incluirá posteriormente as importações de scripts.
Eles serão adicionados automaticamente por essas ferramentas que mencionei anteriormente, que no final hospedam e executam nosso
aplicativo de reação, que por sua vez estamos aqui na pasta de origem com nossos arquivos que
chegamos lá para que, no final, tenhamos um aplicativo da Web de Front-End, que consiste em um arquivo html
em que o Denn JavaScript é usado para renderizar algo na tela e renderiza novamente algo na tela
quando necessário.
E isso nos permite criar interfaces de usuário modernas altamente reativas, onde tudo acontece instantaneamente porque o JavaScript
é executado no navegador, as coisas acontecem instantaneamente.
Não precisamos esperar que um novo arquivo L seja baixado de um servidor.
É que tudo já está lá.
Portanto, quando um usuário clica em um botão e queremos mostrar uma caixa na tela em resposta a essa explosão de
cliques, isso acontece instantaneamente por causa do JavaScript.
Esse é o sentimento que queremos proporcionar.
Podemos fazer isso com reagir agora.
Chega de falar sobre a teoria.
Vamos escrever um código.
Como mencionei, fazemos isso aqui na pasta de origem, onde encontramos um arquivo indexado ao seu
arquivo no aplicativo Chase, ambos arquivos muito simples.
Agora vamos dar uma olhada no telefone de chance indexado.
Lá você vê, temos algumas importações no topo.
A propósito, é assim que você importa código no front-end.
Importe algo de e, em seguida, defina um caminho relativo para o seu próprio arquivo.
Ou, se for um pacote de terceiros, apenas o nome do pacote.
E então aqui temos importações de nossos próprios arquivos com um caminho relativo.
Como mencionei, aqui estamos executando um comando no final.
Reagir Dom render.
Agora, isso vem do objeto React Dom aqui no final, que estamos
importando da biblioteca React Arm, e isso renderiza essa coisa estranha, que não é JavaScript comum.
É você.
Isso joga no nosso H. M. página.
Este é um JavaScript comum.
E aqui estamos selecionando o elemento com uma idéia de raiz.
Se dermos uma olhada no nosso único arquivo HGL, esse é o Dave aqui.
Portanto, os dados estão no final, onde nosso aplicativo de página única de reação será hospedado às duas.
E eles estão prontos para reagir, assumir o controle e renderizar tudo naquele lugar.
Então é isso que estamos fazendo aqui.
Mas o que é isso estranho para o pai?
Precisamos entender o que são componentes e como a reação funciona.