💱 Currency Converter
| 🇺🇸 English |
| 🇧🇷 Português |
💱 Currency Converter Project
Vídeo | Tecnologias | Sobre | Destaques | Clone | Contato
📹 Apresentação em Vídeo do Projeto
Caso o vídeo apresente algum erro, recarregue a página!
Acesse o projeto online AQUI
🚀 Tecnologias Utilizadas
📝 Sobre
Assistir o vídeo acima e/ou acessar o projeto online ajudará na compreensão da explicação!
O Currency Converter é uma aplicação web de conversão de moedas inspirada no desafio DevClub Convert Money, e me rendeu bastante aprendizado.
Seguindo o conceito de Mobile-First, me aprofundei mais em HTML, CSS e Javascript para obter tal resultado, que tanto em layout quanto em funcionalidades, se distanciou bastante do modelo original.
Consumindo a API de moedas e obtendo os valores em tempo real, ele converte de R$-Real para $-Dollar, €-Euro e ￥-Yen.
📌 Alguns Destaques
- Utilização de variáveis CSS e manipulação das mesmas via Javascript;
- Consumo de API via Javascript FetchAPI;
- Estilização completa da rígida tag HTML Select;
- Utilização de MediaQueries para o desenvolvimento da responsividade;
- Utilização de KeyFrames para animações mais aparentes e complexas e CSS Transition pra as mais simples;
- Caso o Dollar fique abaixo de R$5,00, aparecerá um meme do Thanos;
- Pequeno mapeamento da tecla
Enterpara realizar a conversão; - Utilização do método
Intl.NumberFormat()para a formatação dos números;
📖 Clonando o Projeto
Para clonar e executar este projeto em seu computador, você precisará apenas que o Git esteja previamente instalado.
Feito isso, no terminal:
# Clone esse repositório com:
> git clone https://github.com/Luk4x/devClub-convert-money.git
# Entre no repositório com:
> cd devClub-convert-money
# Execute o projeto com:
> start index.html # Para usuários de Windows
> open index.html # Para usuários de Linux/Mac
🤝 Contato dos Contribuintes
Vitrine.Dev 🪟
|
Lucas Maciel
|