Esse projeto é um pequeno dashboard pessoal inspirado no Momentum Dashboard, uma extensão para Chrome que muda o jeito como você vê novas abas do navegador.
A principal motivação foi estudar ReactJS, então conheci o Momentum Dashboard e me baseei nele para fazer a minha versão com essa tecnologia.
- ReactJS
- Styled Components
- Fetch API
- Exibir hora no formato 24h
- Exibir mensagem dinâmica com base na hora do dia
- Exibir dia do ano
- Exibir clima
- Buscar imagens aleatórias do Unsplash e exibir pequena descrição
- Exibir uma frase aleatória
- Criar interface base
- Grid
- Separar components
- Exibir hora
- Criar state para hora e atualizar a cada segundo
- Formatar hora
- Calcular dia do ano
- Mensagem dinâmica com base na hora do dia
- Criar função para recuperar hora do dia ('morning', 'afternoon', 'night')
- Exibir ícone dinâmico com base na hora do dia
- Criar componente switch para os icones
- Exibir clima usando a API do Open Weather Map com base na geolocalização atual
- Criar função para recuperar latitude e longitude atual
- Fazer requisição e recuperar temperatura e código do ícone
- Exibir ícones dinâmicos com base no clima e hora do dia
- Criar componente switch para os ícones
- Buscar imagens aleatórias usando API do Unsplash e uma descrição da imagem
- Fazer requisição no useEffect e recuperar valor para um state
- Passar URL da imagem via props para componente principal
- Recuperar URL no Styled Compoents e colocar no
background: url() - Exibir descrição da imagem
- Criar função para converter descrição para title case
- Encontrar API para buscar de frases