Blog
Life moves fast, luckily I took notes.
I forget things quickly
I constantly find myself perplexed, discussing with colleagues how quickly I forget things. It seems my mind randomly selects certain information to retain for a decade, while it throws other details away.
Not everything needs refactoring
As the code becomes legacy and your production environment starts to experince more incidents due to your code's lack of quality, there are a few steps I like to reproduce in order to revamp the project and establish a good environment for engineers and the end user.
Grid columns animation using CSS
CSS grids are perfect to strcuture complex layouts, but we can also leverage its capabilities do deliver nice animations on the front-end.
Simple notes app using NextJS, Supabase, and Shadcn/UI
This is a simple experiment made to explore the usage of Supabase and Shadcn/UI on a NextJS application using the pages router.
Converting PDF to HTML from the command line
This week I was working on a personal project and at some point I wanted to covert a PDF file to HTML. After doing some research, I found Apache Tika, a toolkit that can detect and extract text and metadata from different file types, such as PDF, PPT, XLS.
Mocking data for Front-end developers
Instead of creating mock objects directly on your front-end, and adding timeouts to ‘fake’ a loading layer that a network request would add, you can simply create a mock server using `json-server`.
ADRs: Not just for Architectural decisions
This post is a suggestion that can be implemented during the decision making process of software development. This method ensures that the information remains publicly available, even for non-technical people.
2023 review: 4 Books I read last year
After finishing the book The Manager's Path, I wanted to pick a few options that made me find a good balance between engineering and tech management skills.
Brag Documents
O intuito de um brag document é manter um histórico de suas conquistas profissionais. Neste post vou compartilhar um modelo que eu tenho utilizado desde o começo do ano para documentar as conquistas da minha carreira.
Incidentes em produção - Como realizar um bom troubleshooting?
Não importa o quão bom seu time seja, incidentes e bugs em produção sempre irão acontecer, e isso é um fato. Estar on-call, ajuda você ganhar experiência, ao mesmo tempo que te ajuda a conhecer melhor o seu projeto.
E-mails & React
Como já mencionei aqui no blog, criar templates de e-mail é como voltar aos anos 90. Bom, estamos em 2023 e é hora de repaginar a criação de emails.
`for await...of` vs `Promise.all` no JavaScript
Duas funcionalidades muito úteis para realizar tarefas assíncronas são o `for await...of` e o `Promise.all`. Vamos entender como eles funcionam e como podem ser aplicados.
Fechando o aplicativo GlobalProtect no macOS
Se você já usa o aplicativo GlobalProtect no macOS, deve ter notato que não é possivel fechá-lo, no post de hoje vamos aprender um comando para fazer isso quando necessário.
NPM Scripts mais inteligentes
Este post é sobre a utilização da biblioteca Wireit em conjunto com scripts NPM.
Bons Pull Requests para Code reviews ainda melhores
Esse é um post sobre como criar Pull Requests melhores. Nele, pontuo algumas estratégias relativamente simples, que ajudam muito o seu time a colaborar de forma mais efetiva.
Novo blog
Mudando o design deste site para comemorar meus 28 anos. 🎉
Palestra sobre front-end no Github Community Fortaleza, na Digital College
Palestra que ministrei sobre front-end no Github Community Fortaleza, na Digital College Brasil. Falei sobre uma stack front-end simples e moderna utilizando Next.js, TailwindCSS e Typescript.
TIL: CSS multiple backgrounds
Today I learned that we can use multiple backgrounds on a single element with CSS. It is possible because the background property is specified as one or more background layers, separated by commas.
Data fetching: SSR e SSG no Next.js
Em aplicações web modernas, podemos lidar com requisições de dados de algumas formas diferentes, mas hoje vamos focar em duas específicas: SSR e SSG.
Go: Múltiplos Valores de Retorno
Há alguns anos eu comecei a estudar Go, uma linguagem open-source, focada em alto desempenho, desenvolvida pelo Google e que tem uma syntaxe bem próxima da linguagem C.
Git: O que é e como usar o Git Cherry Pick?
O cherry-pick é um dos comandos do git que nos permite levar partes específicas da nossa árvore de commits para uma branch desejada.
Definindo valores padrão para propriedades - Desestruturando Objetos Javascript
Existem diversas formas de fazer bom uso dessa feature tão versátil. Porém, é bom tomar um certo cuidado para não abusar das possibilidades e acabar deixando o código mais complexo e difícil de ler do que deveria.
List your git authors via command line
If you are working on a project and need to release often, you might need some automated scripts and commands to help you with the day-to-day tasks. This tiny article is about one of these commands: List your git project contributors.
Utilizando o System Manager para armazenar variáveis de ambiente dos seus Containers na AWS
Além de conectar diretamente com a sua aplicação utilizando o Software Development Kit (SDK), você também pode capturar parâmetros dentro de outros serviços da AWS como o Elastic Container Service ou ECS.
"In use? No" - Domínios não reconhecidos pelo ACM em conjunto com Elastic Load Balancer.
Após solicitar o certificado no AWS Certificate Manager e registrar os Record Sets no Route 53 - tudo que deve ser feito para adicionar um novo domínio com SSL na AWS, algo parecia não estar certo: na lista de domínios, o novo estava sempre como "In use? No"
Capturando parâmetros da URL com JavaScript
Atualmente, navegadores modernos dispõem de uma API, exposta através do construtor URLSearchParams, que nos ajuda a trabalhar com o que chamamos de search params. Hoje, vamos utilizar esta ferramenta para entender como capturar parâmetros da URL de forma simples utilizando Vanilla JS.
Este é o "update sem where" dos dias atuais
Infelizmente, ainda é muito comum acontecer certos problemas com os ambientes mais importantes de um projeto (leia-se beta, prod), pois mesmo que a equipe tenha boas intenções, de manter o fluxo de desenvolvimento mais dinâmico e otimizado, acaba pecando em alguns detalhes que fazem bastante diferença.
Latência ao utilizar o AWS Elastic File System (EFS)
O EFS EFS é um dos serviços que a AWS nos oferece, e se destaca por ser, basicamente, um File System NFS na nuvem de baixíssimo custo. Ele foi criado com o intuito de fornecer acesso compartilhado e paralelo para até milhares de instâncias EC2, permitindo que sua aplicação forneça alto nível em taxa de transferência com baixa latência.
Ubuntu: How To Solve "The Update Information Is Outdated" error alert?
"The update information is outdated. This may be caused by network problems or by a repository that is no longer available. Please update manually by selecting ‘Show updates’ from indicator menu, and watching for any failing repositories."
EFS error: Failed to resolve - server name or service not known
Caso você esteja construindo uma infraestrutura na AWS e precisa montar um sistema de arquivos nas suas instâncias EC2 privadas, você pode ter algumas dificuldades. Vamos ver um dos problemas mais comuns em detalhes.
A pseudo-classe :focus-within do CSS
`:focus-within` é uma pseudo-classe do CSS que representa um elemento em que um dos seus elementos filho recebe uma correspondência da pseudo-classe `:focus`.
Acessando seu projeto Laravel em todos os seus dispositivos
Acessar o seu projeto em diversos dispositivos, muitas vezes pode ser necessário, mesmo que você esteja testando em ambiente local. O comando artisan , do Laravel, disponibiliza várias possibilidades, e uma delas é de criar um host na sua rede local.
Utilizando variáveis do SASS em um componente VueJS, no Laravel
Isso é possível por quê, ao setar o atributo lang="scss", o VueJS considera como SCSS tudo que está dentro da tag style, por isso podemos usufruir de todos os recursos do pré-processador dentro do no nosso componente.
Reminder: force with lease
This is just a reminder to myself in the future. ¯\\_(ツ)_/¯
Como fazer um e-mail responsivo + template de exemplo
Mesmo com todas as tecnologias que conseguimos usufruir no front-end atualmente, nossos clientes de e-mails são muito limitados em relação a interpretação de código. Por isso, veja algumas dicas para construir um bom template de e-mail marketing.
Hi there 👋
Welcome to my new blog