Eu criei uma versão web (Tailwind + React) do meu MIDI Keyboard para estudar música e aprendi algumas coisas interessantes
:point_right: Você pode visualizar e interagir com o projeto aqui
Contexto
Eu estou estudando Music Theory, estava procurando na web que faciitasse a visualização de escalas musicais e achei que seria interessante fazer um projeto em torno disso.
Recentemente eu comprei um MIDI Keyboard (Arturia MiniLab 3) e decidi recriá-lo com React e CSS.
Alguns takeaways depois de finalizar o projeto
Esses pontos são completamente opinionated
- TailwindCSS é provavelmente a melhor forma de prototipar algo com CSS no momento.
- Muita gente (eu incluso) já teve algum pé atrás com tailwind
- Mas se você conseguir passar dessa barreira inicial vai conseguir acessar um valor muito grande.
- Zero configuração com Next.js e uma Developer Experience excelente.
- ChatGPT também tem dificuldades com CSS
- Estava tentando fazer algo um pouquinho mais complexo com flexbox e tentei pedir ajuda para o ChatGPT, porém as respostas foram bem aquém, dando respostas repetidas de coisas que não estavam funcionando
- Acho que fez falta para o ChatGPT a prática de escrever uma linha de CSS e ver como o browser renderiza
¯\_(ツ)_/¯
- React ainda tem muito boilerplate para fazer coisas básicas (como gerenciar estado global)
- É curioso como o DHH está errado sobre typings
- Mesmo num projeto simples, os benefícios de tipagem superam muito overhead que possa vir junto
Eita que dahora, ficou realmente incrível. Comecei fazer um drumpad, mas parei (tem uma demo aqui https://djbrunomonteiro.com.br), agora você me inspirou a rever esse projeto.
Wow, simlpesmente sensacional a qualidade da execução. Até tirei um print para quem não tenha entrado ainda no link e está decidindo entrar, olha isso:
Ta sensacional cara, entra em contato com a empresa do instrumento e tenta vender o projeto, ficaria muito foda na pagina de venda deles.
Cara, ficou incrível demais! Muito bem feito, tanto o visual quanto o código. Parabéns!
Eu curto tailwind, mas para mim pelo própria duplicação de estilo seria melhor aplica-lo como template de um site web
Ai sim em. Curti bastante. Inclusive gostei das "teclas de referências". Digo, as que fazem referência as notas do teclado, correspondente ao teclado do PC. Segura meu Tabcoin meu garoto !!!
Meu amigo, que projeto incrível. Parabéns. Recentemente fiz algumas "brincadeiras" com a AudioContext API nativa, mesmo. A web é maravilhosa.
Sensacional man!!!! Ficou top!