DEV Community

André Rodrigues (Xor)
André Rodrigues (Xor)

Posted on

O que aprender no CSS e o que aplicar no desenvolvimento?

Alt Text

(Imagem retirada do Google)

Muitas desenvolvedores que estão no início da jornada dev fazem essa pergunta, afinal quem nunca passou por isso, não é mesmo?! Pode parecer uma pergunta tosca para os mais experientes, mas para quem está começando, isso pode fazer toda uma diferença.

O CSS é simples de aprender, mas não se engane essa simplicidade de aprender com a forma de escrever um bom CSS, por ser muito fácil de aprender, o CSS se torna custoso de trabalhar, pois, folgamos de certa forma e acabamos não projetamos a arquitetura de nosso CSS. Essa falta de planejamento faz com que o resultado final seja algo poluído e um crescimento de código sem controle que ao chegar no seu fim de ciclo de vida não será reaproveitado sendo completamente descartado. Então o que podemos fazer para trabalhar de forma produtiva e ter aquele CSS lindão? Responderei isso dentro das perguntas feitas no título.

O que aprender no CSS?

Antes de concluirmos o que de fato ajuda no nosso CSS para mantê-lo saudável, vamos entender que temos diferentes cenários e não adianta pensar que um navegador de x usuário vai se manter 100% atualizado, o ideal é sempre usar soluções que sejam compatíveis aos navegadores dos usuários de seu sistema, para isso o recomendável é uma pesquisa de experiência de navegação, faça algumas pesquisas e veja a porcentagem de pessoas que usam determinada versão de navegador, com esse resultado é possível saber qual tecnologia deve ser aplicada para obter melhor resultado. Ok, até aí tudo bem, temos a questão final respondida, mas ficou em aberto a primeira. Calma! A nossa solução é simples. Aprenda todos os recursos que o CSS oferece, isso porque cada versão do navegador se adapta a um novo recurso, exemplo: o Flexbox não oferecia uma compatibilidade para versões antigas do Internet Explorer do 9 para baixo, logo na versão 10 já temos a possibilidade de uso desse valor. Se formos ver em um exemplo ainda mais simples, imagine você dev, tendo que desenvolver um sistema de delivery de comida, e nesse sistema você tem um público de diferentes conhecimento sobre tecnologia que vão desde pessoas leigas ao público que tenha formação na área. Claro que uma pessoa já estudada ou conhecimento digamos que meio caminho, terá total noção sobre a atualização de um navegador, só que nem todos sabem dessa importância e ficam com medo de fazer algo que prejudique a máquina. Então temos aí um caso que o uso de flex não sejam recomendável, pois, precisamos pensar em formas dessa informação ser vista bonitinha por todos, então quem sabe um display inline não resolva, né?! O display inline roda normalmente em navegadores antigos, claro que nem sempre será essa luta de adotar soluções antigas que sejam em partes complicadas de trabalhar, mas tudo é uma questão de entender seu alvo ou seja quem é seu usuário, agora você como desenvolvedor tem que está ciente sobre como usar cada propriedade e seu valor nos diferentes cenários como já vimos antes.

Extras

Lembra quando falamos sobre a organização de seu CSS? Para mantê-lo organizado estude bastante sobre as metodologias, existem algumas bem legais como Atomic Design, BEM, OOCSS e SMACSS, além dessas citadas pode usar o GLC(Global, Local Class). Para fechar o post devemos estudar o CSS por um todo, se você está no começo da jornada evite pular as etapas e só vá para um framework CSS quando realmente tiver total domínio do que faz, pois, nem sempre usar um Bootstrap da vida será a melhor decisão a ser tomada, isso devido a grande quantidade de coisas que o framework carrega em seu core e que pode se tornar um peso ao seu site. Espero que tenha curtido esse post e até o próximo :) .

Top comments (0)