O kit do desenvolvedor Front-end

Quantas vezes você iniciou algum projeto e desistiu no meio do caminho? Ou entregou algo que não era o esperado?

A quem diga que projeto bom, é projeto entregue. Mas aqui entre nós programadores, quem não gosta de um código bonito e bem estruturado. A Google possui um “kit” de desenvolvimento front-end, podemos deixar esse processo de desenvolvimento um pouco mais simples. A finalidade deste artigo é lhe dar um caminho para estudos com links interessantes para cada item do Web Starter Kit. OBS: Lembrando que cada projeto é diferente, cabe a você e sua equipe definir o que é melhor.

Você pode reproduzir o Web Starter Kit seguindo esse artigo.

Vamos aos tópicos e os links:

1. Responsividade

   • Framework Material Design
   • Design Responsivo na prática 2: do layout ao HTML
   • Princípios básicos do Web design responsivo: https
   • Web para dispositivos móveis
   • Responsive Web Design – Media Queries
   • 9 basic principles of responsive web design

2. Compatibilidade com Sass

   • Site Sass
   • Working with Gulp (2)
   • Getting Started with SASS (with Interactive Examples)
   • Getting Started with Sass

3. Otimização de desempenho

   • Introduction to Gulp
   • An Introduction to Gulp.js
   • GulpJS – Um gole de otimização no seu workflow

4. Inspeção de código

   • Site Eslint
   • Evitando erros com ESLint
   • Detectando problemas automaticamente no JavaScript com ESLint

5. Servidor http

   • Web Server for Chrome
   • Introdução ao HTTP/2

6. Recarregamento de navegador em tempo real e sincronização entre dispositivos

   • Browser-sync, indispensável para desenvolver sites em vários dispositivos
   • How to Use BrowserSync for Faster Development
   • BrowserSync: browsers sincronizados

7. Compatibilidade com modo off-line

   • Service Workers: uma Introdução
   • Getting started with Progressive Web Apps
   • Your First Progressive Web App

8. Métricas de desempenho

   • PageSpeed Tools

Esse kit não é um padrão que você deve seguir. Mas vale verificar e quem sabe adotar.

Esqueci de algum link importante? Deixa nos comentários :)