DEV Community

Cover image for Como criei um site lo-fi com chuva e música usando HTML, CSS e JavaScript
Arthur Miguel
Arthur Miguel

Posted on

Como criei um site lo-fi com chuva e música usando HTML, CSS e JavaScript

** Como criei um site lo-fi com chuva e música usando HTML, CSS e JavaScript **

Recentemente, terminei um projeto pessoal de estudo: um site lo-fi com chuva animada, música relaxante, relógio e efeitos de relâmpago.

Funcionalidades:

Chuva que reage ao movimento do mouse

Música com playlist (avança automaticamente)

Relógio em tempo real

Relâmpagos aleatórios

Controle de volume

Firebase Auth para login anônimo

Tecnologias usadas:
HTML, CSS, JavaScript puro e Firebase. Nada de frameworks pesados.

Desafios que enfrentei:

Fazer a chuva se mover com o mouse

Implementar o Firebase sem travar o site

Criar uma playlist que toca a próxima música automaticamente

Deixar o site responsivo e leve

Resultado:
O site está no ar, indexado no Google e arquivado na Wayback Machine.

Link:
https://nahauia.ct.ws

Feedback técnico é sempre bem-vindo.

Top comments (0)