Blog
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