Wtricks • Tutoriais e Dicas do Mundo Digital

O checklist completo para um desenvolvimento Front-End de qualidade

Por Carlos Sabo Cantanzaro • 19/03 - 23:49 pm | Em Font-end, Web Design

Um checklist completo, que vai te ajudar a nunca mais esquecer nenhuma funcionalidade importante durante o desenvolvimento das suas aplicações

Criar um novo projeto Front-End é uma tarefa que sempre exige muito da nossa atenção. E não é raro esquecer alguns elementos importantes ao longo do caminho. Mas como saber se você realmente implementou todas as funcionalidades importantes do seu projeto?

Pensando nessa dificuldade, David Dias, um desenvolvedor Front-End apaixonado, criou uma ferramenta chamada “The Front-End Checklist”. A aplicação é basicamente um TO-DO List interativo, onde estão listados as tarefas obrigatórias de um novo projeto web.

Como usar o “The Front-End Checklist”

O primeiro passo é acessar a ferramenta, e você pode fazer isso clicando aqui.

Logo de início, podemos ver que a ferramenta é muito intuitiva, no começo da ferramenta, você vai ver alguns campos para configurar o nome do projeto, o titulo da página ou a URL e o nome do desenvolvedor. Essa informações são bem úteis pois, a ferramenta te permite gerar um relatório das tarefas, que pode ser impresso, com tudo o que foi feito e tudo o que falta fazer no projeto.

The Front-end checklist

Ainda no inicio da ferramenta, você consegue visualizar o que falta ser feito no projeto, por ordem de prioridade, o que ajuda muito a focar no que é mais importante primeiro.

Ao todo, a ferramenta possui oito categorias principais, sendo elas: HEAD, HTML, WEBFONTS, CSS, JAVASCRIPT, IMAGES, ACCESSIBILITY, PERFORMANCE E SEO. E dentro de cada categoria você encontra a respectiva lista de tarefas e uma barra de progresso, que é preenchida automaticamente a cada vez que você marca uma tarefa como feita, indicando quanto falta para você finalizar as tarefas daquela categoria.

The Front-End Checklist

Além disso, você pode usar o filtro por TAGs e focar em funções especificas como a implementação das ‘meta tags’ do seu projeto. Porém, testei o filtro por tags e ele não funcionou como deveria! Não sei se isso é um bug da ferramenta ou simplesmente uma falha momentânea.

Uma das coisas que eu mais gostei da ferramenta é que dentro da maioria dos itens, existe uma seta no lado direito, para expandir o conteúdo. Ao fazer isso, você encontra artigos de referência explicando como implementar a função, caso você não sabia como fazer, ou não conheça aquele item em específico. 

The front-end checklist

Vale a pena usar o “The Front-End Checklist”?

No meu ponto de vista, a ferramenta funciona muito bem se você está trabalhando sozinho em um projeto. No entanto, se você estiver trabalhando com uma equipe, pode ser mais complicado usar o checklist, visto que a ferramenta ainda não permite que mais de uma pessoa trabalhe simultaneamente.

Porém, a ferramenta é um bom guia, até mesmo para estudar um pouco mais das necessidades e estruturas de um projeto real de Front-End, principalmente se você for iniciante na área.

Por fim, vale lembrar que a ferramenta é gratuita e que o projeto é Open Source, então qualquer pessoa interessada e com conhecimento necessário, pode dar um “Fork” no repositório do GitHub e aprimorar a ferramenta de acordo com suas necessidades.

E você, vai testar a ferramenta? Não deixe de comentar o que achou!

PARTICIPE DA DISCUSSÃO