1. Falta de Conhecimento em Redes e Protocolos:
Importância da compreensão básica de redes e protocolos.
Exploração da arquitetura cliente-servidor e sua relevância.
Necessidade de entender o protocolo HTTP para requisições
eficientes.
2. Dependência Excessiva de Bibliotecas Externas:
A importância do equilíbrio entre dependências e resolução
de problemas.
Riscos associados à terceirização completa para bibliotecas
externas.
Problemas de versionamento e falta de preocupação com a
própria versão do projeto.
3. Descuido com a Segurança:
Reconhecimento das vulnerabilidades em aplicações web.
Necessidade de estudar fragilidades de segurança,
especialmente no front-end.
Abordagem de temas como validação de dados, injeção SQL,
XSS, e controle de sessão.
4. Negligência em SEO:
Ampliação do conceito de SEO além do conteúdo e tempo de
resposta.
Considerações sobre experiência do usuário, usabilidade e
fatores técnicos.
A importância de pensar em SEO desde o início da construção
da aplicação.
5. Falha em Desenvolver para Múltiplos Dispositivos:
Ênfase na responsividade da aplicação para diferentes
dispositivos.
Evolução da abordagem, superando a necessidade de versões
específicas.
Relevância de entender frameworks como React, Angular e
Vue.js para desenvolvimento responsivo.
Cada tópico aborda um erro comum dos programadores
iniciantes, fornecendo insights e dicas para evitar essas
armadilhas no desenvolvimento de aplicações web.
1. Falta de Conhecimento em Redes e Protocolos:
Os anos vão passando e, por mais que as tecnologias para
desenvolver aplicações web evoluam, tem algumas coisas que
sempre vemos acontecer aos novatos que atrapalham no seu
desenvolvimento. Nós escolhemos cinco erros mais comuns que os
devs iniciantes cometem demais e que podem acabar atrapalhando
a sua evolução. Na verdade, muitos desses erros podem até fechar a
porta para novas oportunidades. Então vamos ao primeiro erro, não
estudar o suficiente sobre redes e protocolos.
Já se foi o tempo que desenvolver software envolvia somente um único dispositivo rodando um software. Isso ainda existe, mas quando se trata de desenvolvimento para a web, é essencial conhecer sobre o funcionamento, ao menos o básico, de redes e protocolos.
A arquitetura cliente-servidor é incrivelmente poderosa e foi a que
possibilitou termos sistemas tão integrados como vemos hoje em
dia. Na área web, o uso de navegadores para fazer essa comunicação
foi outra revolução. Então entender o principal protocolo, que é o
HTTP, vai te ajudar a entender como e quando realizar as requisições da aplicação. Isso garante estabilidade e escalabilidade.
Se você trabalha, por exemplo, com aplicações baseadas em APIs REST, é necessário conhecer bem os tipos de resposta HTTP possíveis e como tratá-las adequadamente. Outra preocupação importante é em
relação ao tipo de conteúdo e ao tamanho dele quando se faz
requisições de muitos dados.
A largura de banda e também a forma como os dados são apresentados interfere demais na performance das aplicações. Por exemplo, se você gera uma imagem dinamicamente a partir do servidor e para isso é necessário acesso ao banco de dados, é importante limitar essas chamadas ou mudar essa estratégia de geração para que a aplicação não seja sobrecarregada.
Ou se o banco de dados ficar indisponível por algum tempo, essa geração não pode ser comprometida caso ela já tenha sido gerada. Você mesmo já deve ter usado aplicações que geram QR codes ou códigos em imagens a partir de informações vindas do banco de dados.
Isso é algo que envolve um conhecimento importante sobre rede e arquitetura cliente-servidor. Outro ponto importante nesse tópico se refere à otimização de arquivos, como HTML, CSS, JavaScript e outros assets, como imagens.
Existem muitas ferramentas e técnicas que podem ser usadas para esse tipo de situação.
2. Dependência Excessiva de Bibliotecas Externas:
O segundo erro é aquele que acaba voltando contra você. Terceirizar
todas as soluções para bibliotecas externas. Nada contra ter
dependências nos projetos. Isso é comum e até aconselhável, mas
tem muito dev web que se acostumou a importar libs para resolver
qualquer problema. É aquele tipo de dev que recebe um problema e
se não tiver uma lib que resolva, ele simplesmente não consegue
resolver ou nem tenta resolver.
Exatamente da mesma forma quando se usa o chat GPT ou alguma inteligência artificial para resolver uma situação e você não consegue sequer adaptar para o seu caso. E isso mostra muitas vezes uma preguiça em entender o problema. É fácil ficar só na tentativa e erro até que algo saia minimamente funcional. O efeito colateral disso é que depois de um tempo, normalmente, os problemas de versionamento começam a aparecer, principalmente se as dependências dos projetos não são atualizadas com certa frequência. Pior ainda é quando o dev sequer tem a preocupação de versionar o próprio projeto. Isso sim é a porta de entrada para o caos tomar conta do projeto, no curto prazo, inclusive.
3. Descuido com a Segurança:
O terceiro erro é um dos mais comuns. Não se preocupar ou
simplesmente não ligar para a segurança. Quando se trata de
aplicações web que rodam em navegadores, a possibilidade de
injetar e até alterar código no lado cliente não tem limites. Por isso o programador, principalmente o front-end, precisa estudar bastante sobre essas fragilidades de segurança e as possibilidades que podem acontecer se tentarem, por exemplo, alterar os códigos da aplicação.
Só para começar a falar sobre segurança no front-end nós
levaríamos bastante tempo. Inclusive isso valeria um vídeo próprio
sobre o tema, pois a quantidade de formas de abrir brechas são
numerosas. Cabe a nós desenvolvedores estarmos preparados para
todas elas. O mais explorado é a falta de validação em dados de
entrada em formulários, utilizados para enviar as requisições ao
servidor. Capriche e sempre faça validação de tudo que os usuários
entram de dados na sua aplicação, para barrar justamente os dados
maliciosos. É o que chamamos de sanitizar os dados.
Isso evita vários tipos de ataques, como injeção SQL e XSS, que é o Cross Site Scripting, que é uma forma de injetar código malicioso que muitas vezes não está nem hospedado no seu servidor, para dentro da sua aplicação. Isso vale inclusive para quando é necessário fazer upload de arquivos pela aplicação. É necessário verificar no servidor onde esses arquivos ficarão e as permissões para que os mesmos não vão parar justamente na pasta onde o código do back-end está guardado.
Já vi isso acontecer e é um estrago inimaginável. Você já
ouviu falar em CSP ou Política de Segurança de Conteúdo? Use os
headers de Política de Segurança de Conteúdo para definir quais
recursos podem ser carregados no seu site. Isso ajuda a prevenir
execução de scripts não autorizados. Aliás, headers é extremamente
importante, principalmente quando se faz requisições fora do
domínio original da aplicação. Isso envolve configuração de
cabeçalhos CORS e isso é uma tremenda dor de cabeça para os devs
front-end. Isso diminui os ataques de Cross Origin Request
Forgery, o CSRF, e o Cross Site Scripting Inclusion, o XSSI.
Ainda sobre segurança, é preciso pensar muito sobre autenticação e
autorização. Isso quer dizer que todo ciclo de autenticação deve ser feito em ambiente seguro, utilizando as mais avançadas técnicas de criptografia e nada de armazenar dados sensíveis abertos em
cookies. Então você, desenvolvedora, é responsável por garantir que
apenas usuários autorizados podem acessar determinadas partes da
sua aplicação, incluindo o front-end. Isso inclui também tokens de
segurança utilizados, por exemplo, em acesso a APIs e tokens de
sessão.
Aliás, controle de sessão é uma das maiores brechas de
segurança que os devs deixam abertas. Tenha certeza de adotar
práticas seguras de gerenciamento de sessão, incluindo timeouts,
cookies seguros e o uso de cookies HTTP only, justamente para evitar o roubo de sessão. Daria pra ficar mais tempo aqui explicando as brechas de segurança no front-end, como seguranças de headers, checagem de bibliotecas de terceiros, tratamento de erros e por aí vai.
4. Negligência em SEO:
Agora, o quarto erro mais cometido, e geralmente se deixa para
outras pessoas, outro time, a responsabilidade é de negligenciar
SEO. Quem estuda SEO a sério sabe que não se trata só de tempo de
resposta da aplicação e conteúdo relevante. Nos últimos anos, o
Google, principalmente, evoluiu demais seu algoritmo de
ranqueamento de páginas, então técnicas que eram usadas para
hackear o Google atualmente não são mais eficazes. Quando
falamos de SEO, estamos falando em grande peso de experiência do
usuário. O algoritmo do Google leva em consideração, além de
rapidez e conteúdo relevante, algo que só nós, humanos,
perceberíamos, a usabilidade.
SEO não está apenas relacionado a definir um bom conteúdo, tags, palavras-chave, metadados, tags de altos nas imagens, mapas de sites, etc. Inclui também eliminar conteúdo duplicado, ter uma arquitetura de site rastreável, tempo de carregamento eficiente, backlink inteligente, etc. Então a implantação eficiente requer conhecimentos multidisciplinar, tanto para quem desenvolve, quanto para quem será responsável pelo conteúdo propriamente dito. É preciso pensar em SEO desde o momento em que a construção da aplicação web começa. Eu não estou dizendo que todo dev web precisa ser especialista em SEO. Na verdade, não precisa. Porém, os aspectos técnicos de como implementar essas técnicas é, sim, importante. Aí sim, precisa saber.
5. Falha em Desenvolver para Múltiplos Dispositivos:
O quinto erro que vemos de forma recorrente é o de não
desenvolver corretamente para múltiplos dispositivos. Hum, esse é,
hein? Estamos falando aqui de computadores, desktop, laptops,
smartphones e também TVs. É o que se chama de responsividade. A
capacidade da aplicação em se adaptar automaticamente a vários
tamanhos de telas, sem precisar necessariamente desenvolver uma
versão específica para isso. Antigamente, no início da era mobile, se costumava muito criar versões próprias para a navegação desses
dispositivos, até porque os navegadores de celulares e smartphones
eram extremamente limitados e lentos por conta da pouca
capacidade de processamento e memória. Isso mudou completamente e hoje algumas iniciativas como o AMP já não fazem mais sentido.
Só para você ter uma noção, o Google foi o responsável
pela criação do AMP, que significa Accelerated Mobile Pages, e era
justamente uma versão lite da página, cheia de regras para
carregamento mais rápido. A tecnologia foi criada em 2015 e
altamente incentivada pelo Google, inclusive era uma das técnicas de SEO ter versões AMP das páginas. Agora, em 2021, isso praticamente morreu e o próprio Google não incentiva mais o seu uso. Para você ver como é que o SEO sempre está intimamente ligado ao momento que nós vivemos. Existem muitos padrões e práticas para construir aplicações webs responsivas. Cada plataforma de desenvolvimento tem suas próprias dicas e truques, mas existem alguns frameworks que já são independentes da plataforma. Com certeza você já deve ter ouvido falar em ter o índice SS ou mesmo no Bootstrap. Essas são algumas tecnologias que se utilizam para a estilização de componente e já suportam responsividade. Podemos citar o próprio React, Angular e o Vue.js como ferramentas que se complementam nesse desenvolvimento.
Outro aspecto importante que ainda tem relevância é entender as
SPIs ou as Single Page Applications. Quando falamos em aplicações
web, não necessariamente estamos falando de sites institucionais e
blogs, mas sim em aplicações completas. Por exemplo, Gmail, Trello,
Office 365, WhatsApp para web, o Chat GPT e por aí vai. Essas são
aplicações na qual o uso do conceito de reatividade é muito utilizado.
Então é preciso entender bem sobre otimização de requisições e
limitação ou não de recursos externos e a banda utilizada. Aplicações com centenas de milhares de visitas diárias rapidamente se mostram frágeis quando não são devidamente planejadas.
Então não negligencie os estudos sobre cache, cookies, local storage, requisições e gerenciamento de seção, pois todos são aliados quando utilizados corretamente no seu projeto. Não podemos deixar de destacar o quanto o uso de TVs para navegação em aplicações tem crescido nos últimos anos. As TVs atuais são praticamente computadores, onde é possível instalar aplicativos de loja, jogar jogos, assistir os filmes via aplicação de streaming e muito mais. Se você deve web e acha que faltou algo de importante que nós não falamos, fique à vontade para complementar aqui nos comentários. Tentamos fazer um resumão, mas sabemos que tem muitos detalhes que não podem ser esquecidos.
Apoie Meu Trabalho: Contribua para Manter o Conhecimento Livre
Caros leitores e entusiastas da programação,
É com grande entusiasmo que compartilho meu conhecimento e insights sobre programação com vocês por meio dos artigos publicados aqui. A jornada de criar conteúdo educativo e informativo tem sido incrivelmente gratificante, mas também desafiadora.
Manter uma fonte regular de artigos requer tempo, esforço e dedicação. Para garantir que eu possa continuar oferecendo conteúdo valioso e atualizado, estou buscando o apoio da comunidade.
Se você tem se beneficiado de meus artigos e acredita na importância de compartilhar conhecimento livremente, considere fazer uma doação. Sua contribuição ajudará a cobrir os custos operacionais, incentivando-me a dedicar mais tempo à pesquisa e criação de conteúdo de alta qualidade.
Como Contribuir:
O Que Seu Apoio Proporciona:
Manutenção do Site: Garante a estabilidade e funcionamento contínuo da plataforma.
Tempo de Pesquisa: Permite que eu me aprofunde em tópicos complexos para fornecer insights valiosos.
Melhoria da Qualidade: Investimento em ferramentas e recursos para aprimorar a qualidade dos artigos.
Outras Formas de Apoiar:
Se as doações não são uma opção para você, compartilhar meus artigos nas redes sociais, deixar comentários construtivos ou sugerir temas para futuros artigos são maneiras igualmente valiosas de apoiar o projeto.
Agradeço a todos que tornam possível a continuidade deste trabalho. Juntos, podemos promover o compartilhamento de conhecimento e fortalecer nossa comunidade.
Com gratidão,
Mateus M. Pereira
CodeVerso
Top comments (0)