SCC0219 - Introdução ao Desenvolvimento Web (2023)

Documento da discussao: link do notion no grupo do telegram!!

Slides: https://www.canva.com/design/DAFkewNnQJI/dl_iyp8zWQ1TcOkOdzwbLA/edit?utm_content=DAFkewNnQJI&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton

----------------------------------------------------------------------------------------------------------

"Lista de alunos"

Adalton de Sena Almeida Filho - 12542435

Bernardo Rodrigues Tameirão Santos - 12733212

Gabriel dos Santos Brito - 10284250

Felipi Yuri Santos - 11917292

Igor Cardozo Martins - 10387515

Vinicus Carneiro Macedo - 11915752

Yuri Fernandes Pereira - 1373012

Editor: Vinicius

Coordenador: Yuri

Apresentadores: Adalton, Gabriel, Igor

Principais atributos do Framework

• Components: O React permite a criação e utilização de componentes independentes que permite a reutilização do mesmo componente em diversas partes do projeto. Para se ter uma boa funcionalidade desses componentes é necessário seguir algumas diretrizes do próprio React com o uso de Hooks e Props.
• Interface independente do Servidor: Com React a Interface se torna independente do Servidor e utiliza somente o navegador para gerar a interface, além disso possui um DOM Virtual que é quem recebe as mudanças que ocorrem através do usuário. A partir disso compara-se o DOM Virtual com o Real e somente as diferenças entre os dois são modificadas no Real.
• JSX: Permite a mistura entre HTML e JavaScript, isso faz com que a codificação se torne de certa forma simples e escalonável.
• Renderização Condicional: Com React é possível condicionalizar através do JSX o que será exibido para o usuário, isso facilita na criação de componentes que possam ser diferentes dependendo das informações que recebe.
• Typescript: React permite a utilização de Typescript para codificação diminuindo a quantidade de erros possíveis por falta de tipagem em um grande projeto, não há restrições em utilizar somente JavaScript
• Fluxo Unidirecional de Dados: O React é projetado de forma que pode suportar apenas uma direção de fluxo de informação. Caso necessite de fluir em outra direção, será necessário extensões adicionais.

Vantagens do Framework

• Fácil de ler e de ser usado: Qualquer desenvolvedor que possui um background em JavaScript pode rapidamente entender a framework e começar a criar aplicações dentro de poucos dias, pois o React conta com uma grande quantidade de conteúdos disponíveis na web, além de muitos pacotes prontos. Além disso, ainda possui a vantagem de a biblioteca JavaScript User Interface(UI) library ser de código aberto, o que facilita na execução de alguma tarefa.
• Componentes reutilizáveis: Uma aplicação React é feita de múltiplos componentes, e cada componente tem sua própria lógica. Estes componentes são responsáveis pelo output de um pequeno trecho de código HTML que pode ser reutilizado onde for necessário. Os códigos reutilizáveis facilitam o desenvolvimento e a manutenção das aplicações.
• Aprimoramento de perfomance: Muitos desenvolvedores enfrentavam problemas quando a árvore DOM era atualizada, pois atualizar a árvore toda diminuía a perfomance da aplicação. O React resolveu esse problema introduzindo o virtual DOM. O virtual DOM existe inteiramente na memória e é uma representação do DOM no browser. Quando escrevemos um componente React, nós não estamos escrevemos diretamente no DOM, mas sim em componentes virtuais que o React transformará em DOM posteriormente, atualizando somente os elementos necessários e possibilitando uma perfomance suave e mais rápida.
• Suporte de ferramentas úteis: O React adquiriu muita popularidade devido à presença de um amplo conjunto de ferramentas úteis. Estas ferramentas tornam as tarefas dos desenvolvedores mais compreensíveis e fáceis. O React Developer Tools foi projetado como uma extensão Chrome e Firefox e permite inspecionar a hierarquia de componentes React no virtual DOM. Também permite selecionar componentes específicos e examinar e editar suas props e o state.

Desvantagens do Framework

• Alta taxa de Atualizações: React sofre muitas atualizações seguidas, isso por um lado é bom pois mostra comprometimento da empresa com a sua manutenção mas por outro lado dificulta a adaptação de programadores com os atualizações.
• Documentação pobre: Pelo fato de React sofrer muitas atualizações seguidas acaba ficando muitas vezes sem a documentação necessária para cada atualização, complicando para quem programa.
• UI Part: React se preocupa somente com UI e nada mais, então é necessário fazer o uso de extensões para se conseguir uma aplicação mais completa.
• JSX é uma barreira: Alguns membros da comunidade de desenvolvedores consideram o JSX uma barreira, especialmente para desenvolvedores novatos, pois apesar de a abordagem de misturar HTML com JavaScript trazer alguns benefícios, ela também dificulta a curva de aprendizado devido à sua complexidade.

Principais Nichos de Aplicação

Perspectivas Futuras

• O React permite a utilização de componentes Vue e vice-versa, entretanto é necessário que o main container desses componentes sejam iguais.
• Migração de muitas aplicações para React Native para progrmaçaõ Mobile.
• Framework mais utilizado do mundo em pesquisa realizada pela JetBrains e StackOverflow
• Suporte Oferecido pela empresa META, não se sabe ao certo como se dará a continuação do react.