FlexboxFroggy – Como aprender CSS Flexbox, jogando

Froggy - O sapinho que você tem que posicionar usando CSS Flexbox no FlexboxFroggyQuando a internet começou, tínhamos recursos muito básicos implementados nos navegadores, e por isso os sites normalmente eram feitos sem muita estrutura, apenas contendo textos e sem muitos estilos aplicados. Depois de algum tempo, a internet evoluiu um pouquinho, e os sites começarem a ser mais estruturados, com barras laterais, menus, cabeçalho e rodapé melhor definidos, através do uso de tags <table>. Depois de mais algum tempo, começou a surgir a prática do tableless, que usava CSS para criar sites estruturados sem o uso de tags <table>. E, a partir dessa prática do tableless, surgiu incontáveis bibliotecas de grid, normalmente (mas não necessariamente) integrada a frameworks CSS, como o Bootstrap e o Foundation, que facilitam e muito a criação de sites tableless com o uso de grids pré-definidas (normalmente de 12 colunas). Com a evolução do HTML5 e do CSS3, entretanto, novas técnicas de organizar conteúdo na tela estão surgindo, e hoje vou falar sobre um jeito prático de aprender uma dessas novas técnicas, chamada Flexbox, jogando.

Continuar lendo FlexboxFroggy – Como aprender CSS Flexbox, jogando

BounceJS – Gere animações com CSS3 facilmente

Quando um projeto novo está sendo criado, é comum animações ficarem em segundo plano: normalmente, cria-las exige um esforço significativo, ou então elas podem vir a ser lentas demais e assim acabam atrapalhando a experiência do usuário em vez de ajudá-lo. Por isso recentemente começaram a ser popularizar animações feitas com CSS3: normalmente, elas são fáceis de fazer e muito otimizadas pelo navegador, pois normalmente são executadas na GPU do dispositivo do usuário. Entretanto, quando ficam complexas, podem se tornar um pouco mais chatas de serem criadas (como sempre), e é para facilitar isso que o BounceJS foi criado.
Continuar lendo BounceJS – Gere animações com CSS3 facilmente

Foundation – Uma alternativa interessante ao Bootstrap

Recentemente, falamos aqui do Bootstrap, um framework criado pelo Twitter para facilitar a implementação de layouts para páginas web. Mesmo o Bootstrap sendo uma boa opção, ele não é a única, e pode vir a não agradar a todos. Portanto, a indicação de hoje é do Foundation.
Continuar lendo Foundation – Uma alternativa interessante ao Bootstrap

Bootstrap – Um framework HTML/CSS/JS para você começar bem o seu projeto

Normalmente, quando é iniciado a criação do backend de uma aplicação, é normal recorrermos à frameworks para agilizar o trabalho. Tais frameworks normalmente implementam coisas um tanto quanto tediosas, como ORM's, cache, dependency injection e outras coisas do tipo. No frontend, quando iniciamos o desenvolvimento de um layout, a história normalmente é diferente: Tudo é iniciado do ZERO. Mas o Bootstrap surgiu para acabar com essa reescrita de código, ao menos parcialmente. =)

Continuar lendo Bootstrap – Um framework HTML/CSS/JS para você começar bem o seu projeto