The latest articles on DEV Community by Arthur Miguel (@arthur_miguel_ce45afb4620). https://dev.to/arthur_miguel_ce45afb4620 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3889388%2F78d582be-9f44-4977-96bb-43fe1834ef10.png https://dev.to/arthur_miguel_ce45afb4620 en Arthur Miguel Tue, 21 Apr 2026 14:54:08 +0000 https://dev.to/arthur_miguel_ce45afb4620/como-criei-um-site-lo-fi-com-chuva-e-musica-usando-html-css-e-javascript-4akl https://dev.to/arthur_miguel_ce45afb4620/como-criei-um-site-lo-fi-com-chuva-e-musica-usando-html-css-e-javascript-4akl <p>** Como criei um site lo-fi com chuva e música usando HTML, CSS e JavaScript **</p> <p>Recentemente, terminei um projeto pessoal de estudo: um site lo-fi com chuva animada, música relaxante, relógio e efeitos de relâmpago.</p> <p>Funcionalidades:</p> <p>Chuva que reage ao movimento do mouse</p> <p>Música com playlist (avança automaticamente)</p> <p>Relógio em tempo real</p> <p>Relâmpagos aleatórios</p> <p>Controle de volume</p> <p>Firebase Auth para login anônimo</p> <p>Tecnologias usadas:<br> HTML, CSS, JavaScript puro e Firebase. Nada de frameworks pesados.</p> <p>Desafios que enfrentei:</p> <p>Fazer a chuva se mover com o mouse</p> <p>Implementar o Firebase sem travar o site</p> <p>Criar uma playlist que toca a próxima música automaticamente</p> <p>Deixar o site responsivo e leve</p> <p>Resultado:<br> O site está no ar, indexado no Google e arquivado na Wayback Machine.</p> <p>Link:<br> <a href="https://nahauia.ct.ws" rel="noopener noreferrer">https://nahauia.ct.ws</a></p> <p>Feedback técnico é sempre bem-vindo.</p> webdev html css javascript