Recurs√£o de cauda ‚ÄĒ ou como n√£o estourar a pilha

Publicado em 13 nov 2020. Uns 10 minutos de leitura.

Quando precisamos realizar uma opera√ß√£o v√°rias vezes, geralmente existem duas maneiras: iterativa e recursiva. Iterativa √© quando utilizamos alguma estrutura de la√ßo, como um for ou while, com uma vari√°vel de controle para saber quando parar. Recursiva √© quando uma fun√ß√£o decide executar a si mesma por entender que ainda precisa continuar processando. Toda itera√ß√£o pode ser escrita como uma recurs√£o e vice-versa. Recurs√Ķes por√©m tem um risco associado: o estouro da pilha. Vamos entender o que isso significa e como escrever c√≥digo recursivo evitando esse problema!

Continuar lendo ‚Üí


Casamento de padr√Ķes em Elixir

Publicado em 16 out 2020. Uns 11 minutos de leitura.

Um desafio de programa√ß√£o √© conseguir escrever c√≥digo de maneira mais sucinta sem sacrificar a facilidade de compreens√£o. √Č comum ver solu√ß√Ķes de uma linha que resolvem o problema e ningu√©m entende como elas funcionam. Pensando nisso, algumas linguagens trazem sintaxe que permite escrever, de maneira idiom√°tica, c√≥digo mais expressivo. Um exemplo disso √© casamento de padr√Ķes. Recentemente, comecei a estudar Elixir, e fiquei feliz em descobrir que pattern matching √© uma parte importante da linguagem e resolvi trazer um pouco disso pra c√°!

Continuar lendo ‚Üí


Texto com degradê em CSS (igual a esse título)

Publicado em 16 set 2020. Uns 4 minutos de leitura.

A cor do texto em CSS é definida usando a propriedade color. Mas há maneiras de usar algo mais complexo do que apenas uma cor? Dá sim, é só olhar para o título deste post. O texto nele, ao invés de ter uma cor apenas, é preenchido por um degradê (ou gradiente). Vamos fazer isso só com CSS!

Continuar lendo ‚Üí


De zero a heroi: Hero animations em Flutter

Publicado em 31 ago 2020. Uns 17 minutos de leitura.

Anima√ß√Ķes s√£o uma excelente maneira de tornar um app mais interativo e engajar os usu√°rios. Flutter tem v√°rias op√ß√Ķes para criar anima√ß√Ķes, com diferentes n√≠veis de complexididade. Uma das (se n√£o a) mais simples s√£o as Hero animations, que, com apenas um widget, permitem animar um componente durante a transi√ß√£o entre duas telas. Vamos ver como fazer uma anima√ß√£o super r√°pida e explorar possibilidades mais avan√ßadas para criar anima√ß√Ķes mais complexas com essa ferramenta.

Continuar lendo ‚Üí


Montando 5 gráficos com uma métrica do Prometheus

Publicado em 20 ago 2020. Uns 10 minutos de leitura.

A linguagem de consultas do Prometheus, a PromQL, permite fazer transforma√ß√Ķes e agrega√ß√Ķes das m√©tricas para extrair dados que n√£o haviam sido reportados diretamente pela aplica√ß√£o mas podem ser deduzidos. Nesse post, trago 5 consultas diferentes que podemos fazer para monitorar nossas aplica√ß√Ķes usando apenas (tecnicamente) uma m√©trica! Vamos us√°-las para montar gr√°ficos no Grafana.

Continuar lendo ‚Üí


Navegação por rotas em Flutter usando o Nuvigator

Publicado em 12 ago 2020. Uns 12 minutos de leitura.

Um dos aspectos mais importantes de um app √© a navega√ß√£o entre telas. Na web, isso √© feito atrav√©s de links (e, com a alta dos frameworks de front-end JavaScript, reimplementando esta navega√ß√£o no cliente). Num app em Flutter, existem fun√ß√Ķes de navega√ß√£o para transicionar de uma tela para outra. Com elas √© poss√≠vel empilhar, substituir e remover telas criando o pr√≥prio widget da tela seguinte nestas fun√ß√Ķes.

O Nuvigator surgiu como uma abstra√ß√£o em cima desse roteamento do Flutter para facilitar a declara√ß√£o e reutiliza√ß√£o destas rotas, o que √© bem √ļtil conforme o app cresce e tem mais partes que interagem. Trouxe uma introdu√ß√£o a como ele funciona neste post!

Continuar lendo ‚Üí


Desmistificando o margin collapsing do CSS

Publicado em 3 ago 2020. Uns 11 minutos de leitura.

Um comportamento que de vez em quando me pega desprevinido de CSS √© o margin collapsing (literalmente, "desmoronamento das margens", na falta de uma tradu√ß√£o melhor), que √© a combina√ß√£o de duas margens adjacentes em uma s√≥. √Č algo que faz parte da especifica√ß√£o mas muitas vezes passa despercebido. Agora, quando isso interfere no que queremos fazer, se voc√™ n√£o souber o que √© e como funciona, vai quebrar a cabe√ßa para desvendar por que suas margens desaparecem. Trouxe a defini√ß√£o de em quais casos suas margens podem sumir e alguns exemplos para ajudar a visualizar cada um!

Continuar lendo ‚Üí


Melhorando acessibilidade de linhas e colunas em Flutter

Publicado em 27 jul 2020. Uns 7 minutos de leitura.

Flutter parte do princp√≠pio de "tudo √© um widget!", e isso inclui as primitivas de layout, como Row e Column. Com essas ferramentas bem simples, conseguimos criar v√°rios tipos de layout. Por√©m, nem sempre a maneira com que algo √© visualmente disposto bate com a ordem e agrupamento sem√Ęntico. Estava fazendo um app em Flutter e, ao tentar us√°-lo com o VoiceOver (leitor de tela do iPhone, usado normalmente por pessoas com defici√™ncia visual), percebi que ele lia alguns conte√ļdos numa ordem ruim. Vamos ver o que precisei fazer para consertar isso ‚ÄĒ √© mais f√°cil do que parece!

Continuar lendo ‚Üí