Como o desenvolvimento de aplicações continua a evoluir, a procura de equipas para fornecer rapidamente software que possa escalar e evoluir para satisfazer as necessidades dos clientes nunca foi tão grande. As frameworks de desenvolvimento front-end são fundamentais para que isso aconteça.
Estas frameworks são onde o trabalho para o layout, lógica, e aplicação é executado. Estes sistemas baseados em browser requerem JavaScript, CSS, HTML, e outras tecnologias padrão da web.
Então, como escolher qual é a melhor estrutura para si? Aqui estão as cinco melhores estruturas que as equipas de desenvolvimento estão a utilizar, com base na minha opinião e experiências, e o que precisa de saber sobre elas.
Top front-end frameworks
Web browsers todos competem para ter o melhor suporte para padrões abertos tais como HTML, CSS, e JavaScript. Há muito menos trabalho necessário para testar se as tecnologias funcionam em diferentes navegadores web. As cinco estruturas que deve considerar são:
- Angular
- Reagir
- Vue
- Ember
- Svelte
As revisões que se seguem baseiam-se na minha experiência e na das minhas equipas. (Encorajo-vos a deixar qualquer pensamento baseado nas vossas próprias experiências nos comentários abaixo.)
Angular
Angular tem indiscutivelmente a história mais extensa de todas nesta lista. Desenvolvido inicialmente pelo Google em 2010, foi subsequentemente lançado como um projecto de código aberto. A estrutura recebe consistentemente actualizações com lançamentos significativos normalmente entregues a cada seis a nove meses. A versão principal actual é a versão 9.1.
Pros
Existe um forte apoio do programador para Angular. A documentação no site de apoio ao desenvolvimento Angular é excelente e, como programador, encontrará muitos vídeos de como fazer no YouTube para começar.
Também, Angular continua a evoluir e a satisfazer as necessidades dos programadores web. Para tal, a estrutura suporta a linguagem TypeScript (um super conjunto de JavaScript), uma arquitectura progressiva de aplicação web para soluções multi-formato, e a arquitectura M-V-C (model view controller).
Angular é também um componente crítico da pilha de desenvolvimento MEAN que consiste em MongoDB, ExpressJS, Angular, e NodeJS.
Cons
A idade do Angular pode apresentar um problema. Em 2010, os programadores não estavam a construir aplicações web móveis, por isso, durante vários anos, as adições foram feitas em Angular para as acomodar. Em 2016, Angular foi reescrito com TypeScript e lançado como Angular 4. A versão original, AngularJS, foi renomeada como Angular.
Felizmente, as versões anteriores de Angular não são compatíveis com a nova versão TypeScript em Angular 4. É importante saber se alguma parte das suas organizações utilizou Angular e está a pensar seguir esta direcção por razões de compatibilidade.
Bottom line
Angular cresceu e adaptou-se às modernas necessidades de desenvolvimento. Se seguir este caminho, utilize as versões mais recentes do Angular 4 e posteriores para construir aplicações angulares. E não se esqueça de estar atento ao blog Angular para se manter a par das últimas melhorias da estrutura.
Reagir
Muitos grupos de desenvolvimento escolherão Angular ou Reagir como base para as suas aplicações web. A lógica faz sentido, e ambos estão maduros. Ambos fornecem aplicações que podem executar aplicações web massivas, e ambos têm comunidades fortes onde os programadores podem partilhar informação.
Mas onde a Angular foi com TypeScript, a React aproveita extensivamente o JavaScript. O Facebook, juntamente com colaboradores individuais e outras empresas, mantém o React.
Pros
algumas empresas muito grandes – incluindo Facebook, Netflix, Dropbox, Airbnb, e Reddit-use React como a sua estrutura de front-end. Estes sites recebem milhões de visualizações por dia. React provou ser capaz de escalar e satisfazer as necessidades das aplicações web mais exigentes.
Adicionalmente, as competências aprendidas em React aplicam-se também ao ReactNative, uma estrutura que os programadores podem utilizar para construir aplicações nativas que correm nos sistemas operativos móveis iOS e Android.
Cons
Reagir não é fácil de aprender. Toda a arquitectura é construída em JavaScript, pelo que é necessário ser um programador experiente para começar com React.
Bottom line
A curva de aprendizagem com React é íngreme, mas o resultado é uma arquitectura modular que pode suportar os websites mais exigentes. O Facebook e a comunidade de código aberto continuam a investir no crescimento do React, o que garante que o investimento no React o recompensará durante anos no futuro.
Vue
O ponto de venda do React é o tamanho da estrutura. Com apenas 20KB, esta é uma das estruturas mais leves da lista. A inspiração para a Vue veio do trabalho que o revelador original realizou no Angular. Em 2014, a Vue foi lançada como uma alternativa elegante ao Angular e tem mantido um culto seguindo desde então.
Pros
Muito parecido com o Angular, não é difícil chegar a acordo com a Vue. Pode aproveitar as suas capacidades com HTML, CSS, e JavaScript. Também pode construir modelos e componentes em Vue, tal como faria com o ReactJS.
Cons
Muitos programadores classificam o Vue como uma estrutura de terceira escolha, atrás do Angular e do React. Para este fim, a comunidade que apoia Vue é muito mais pequena, e o desenvolvimento da estrutura não é tão robusta como outras estruturas mais populares.
Bottom line
Vue é uma excelente estrutura alternativa para aprender e alavancar à medida que necessita. É uma estrutura de contenção e pode ser potencialmente uma alternativa inteligente ao Angular.
4. Ember
Ember é uma das estruturas mais jovens desta lista. Lançada em 2011, o seu foco está em ajudá-lo a construir aplicações web complexas. Oferece:
- Mais produtividade logo à partida quando comparado com outros nesta lista
- Estabilidade sem estagnação
- Suporte para HTML5
Com estes princípios e desenvolvimento contínuo, Ember está agora em uso para muitas aplicações grandes e populares, tais como Apple Music, LinkedIn, e Square.
Pros
A arquitectura modular e muitas centenas de plugins fazem da Ember uma estrutura que lhe dá muito logo a partir da porta de partida. Além disso, as soluções construídas com Ember podem ser convertidas em aplicações nativas tais como Apple Music.
Cons
Ember alavanca os módulos para estender a estrutura. O desafio como desenvolvedor é saber quais os módulos que se devem utilizar. Além disso, há uma curva de aprendizagem necessária para começar com Ember.
Bottom line
Ember está a evoluir rapidamente para uma alternativa madura e estável para construir aplicações web e aplicações nativas quando comparadas com React.Native e Angular.
Svelte
Svelte é a estrutura anti-enquadramento. Existem problemas com algumas estruturas, tais como uma grande base de código necessária para executar scripts. Svelte, lançado em 2016, está a impulsionar a campanha para reduzir os desafios de alguns frameworks tradicionais.
Por exemplo, uma simples aplicação para fazer MVP escrita com Svelte terá um peso de 3,6KB, enquanto que a mesma aplicação escrita para React tops 45KB-10 vezes maior.
Svelte pode criar aplicações minúsculas por causa do modelo que utiliza para construir aplicações. Outras estruturas, incluindo as acima listadas, dependem do navegador web para fazer a maior parte do trabalho.
Com Svelte, escreve-se componentes com CSS, HTML, e JavaScript, e depois Svelte compila o código em módulos JavaScript. O resultado é que o browser não tem de fazer tanto trabalho. O que, por sua vez, significa que pode escrever aplicações mais complexas.
Pros
Módulos JavaScript são uma forma eficaz de acelerar qualquer aplicação JavaScript. A abordagem que Svelte traz é aumentar a eficiência das suas aplicações.
Cons
Muitos programadores web não têm trabalhado com módulos JavaScript. Toda a abordagem que Svelte oferece é muito diferente, e, porque Svelte é a nova criança do bloco, a comunidade de desenvolvedores ainda está a crescer.
Bottom line
Svelte oferece uma abordagem interessante ao desenvolvimento de aplicações Web. Há mérito em trabalhar com módulos JavaScript, e o modelo que a Svelte oferece é um modelo que os programadores devem experimentar. Dito isto, Svelte é fino em documentação. Assim, num futuro previsível, tratar Svelte como experimental.
Vá além das aplicações web
O foco destas estruturas são aplicações web, mas esse já não é o mundo em que vivemos. As estruturas de retaguarda e aceleradores desempenham também um papel enorme no desenvolvimento de aplicações nos dias de hoje. (Estes são tópicos que vão além do âmbito deste artigo, mas precisam de ser mencionados.)
Aceleradores de importação incluem nuvem, ferramentas de código aberto, metodologias DevOps e segurança. Mas em muitos aspectos, o acelerador mais crítico é a sua mentalidade. Como programador moderno, deve adoptar uma mentalidade de aprendizagem constante para melhorar continuamente o modelo de entrega para satisfazer as exigências sempre crescentes dos seus clientes.
Deve ser capaz de entregar eficazmente soluções que possam ser dimensionadas em todas as plataformas que os seus clientes utilizam. O poder combinado de front-end, back-end, e aceleradores dar-lhe-á a vantagem de que necessita.