Muito difícil encontrar alguém que se satisfaça com o visual nativo de checkboxes e radio buttons definidos pelo navegador. Enquanto diversos outros elementos evoluíram suas APIs para permitirem a total personalização de seus estilos, checkboxes e radio buttons parecem ter estacionado na idade média da programação. Ou será que eles evoluíram e a gente apenas não se deu conta?
O momento de dar um nome ao projeto é mágico, mas algumas pessoas podem se deparar com uma folha em branco que insiste em não imprimir nome algum, seja por um bloqueio criativo, ou por qualquer outra dificuldade. Neste post eu compartilho três estratégias que certamente vão ajudar a fertilizar sua mente até que, como num passe de mágica, um bom nome brote dela.
Uma vez ouvi um programador chamar o Github de cemitério de projetos paralelos. Achei uma injustiça com o pessoal que dia sim e dia também está evoluindo seus projetos. Mas reconheço que para tirar um projeto do papel é necessário ter a habilidade de seguir em frente com algo que nunca parece caber no nosso tempo livre. Em pouquíssimos parágrafos, compartilho neste posts a estratégia que eu tenho adotado para manter meus projetos paralelos sempre em movimento e impedir que a falta de disposição matem algumas boas ideias no meio do caminho.
Seja exportando um gráfico, ou gerando imagens com textos dinâmicos, o processo de transformação de HTML em imagem pode vir a calhar para diversas situações do dia a dia. Este post explica como fazer esta tranformação tanto no servidor (NodeJS), quanto no próprio browser.
Ao conectar um repositório do GitHub ao Vercel, cada novo commit na branch principal significa automaticamente um novo deploy em produção. Se essa experiência remove bastante configuração por um lado, por outro acaba ignorando a integração contínua e libera novas versões da aplicação mesmo com testes quebrando. Aprenda como desfazer essa 'facilidade' e condicionar os deploys de produção ao sucesso da integração contínua.
Ao longo dos últimos anos, experimentei algumas bibliotecas que prometiam simplificar o trabalho de validação de um formulário React. Minha conclusão é que elas são desagradavelmente invasivas e tornam o código desnecessariamente complexo. Neste post, compartilho uma abordagem livre de código terceiro que tem resolvido de maneira estupidamente simples a validação dos meus formulários.
Depois de tentar me familiarizar com a pseudo classe :has lendo diversos artigos que utilizavam casos de uso não tão comuns ao dia a dia de um programador frontend, me deparei com um caso real no meu próprio site em que o uso do :has caiu como uma luva. Neste post, eu detalho como o :has pode eliminar o que, há não muito tempo atrás, era feito com auxílio de JavaScript.
Ao apresentar um vídeo ao invés de uma animação gif, é possível manter a mesma qualidade visual pagando um preço muito menor no tamanho do arquivo. Mas se você já fez uma captura em vídeo da tela do seu Mac para demonstrar algum passo-a-passo, já percebeu que o formato do arquivo gerado é mov. Descubra como converter mov em mp4 usando uma ferramenta de linha de comando gratuita.
Quando comparada com a estratégia baseada em media queries, a função clamp tem a vantagem de tornar o tamanho do texto responsivo exigindo para isso pouquíssimo código. Porém, embora dois dos parâmetros recebidos por esta função sejam bastante intuitivos, um terceiro parâmetro pode deixar qualquer programador confuso. Este post explica de maneira fácil o que este terceiro parâmetro significa e como ele funciona.
Redirecionamentos são bastante comuns em qualquer aplicação web. Mas quando o destino é uma página externa, você pode acabar enfrentando alguns desafios ao escrever testes automatizados para esse comportamento. Aprenda como definir uma fronteira entre o comportamento da sua aplicação e o comportamento do browser para facilitar o desenvolvimento dos testes.