Todos os filmes em um só lugar
Esse projeto faz parte de uma iniciativa da Alura, o #7DaysOfCode, que consiste em propor a construção de uma aplicação usando determinadas ferramentas durante 7 dias, sendo que a cada dia é dada uma tarefa, e há um design a ser seguido. O desafio em questão é sobre manipulação do DOM e consumo de API com JavaScript, podendo não só exercitar o que já aprendeu como conhecer e aplicar novas abordagens.
Para fazer uso da aplicação, será necessário rodá-la localmente em sua máquina e gerar uma chave de API do The Movie Database. Para isso, siga as instruções a seguir:
- Abra o Git Bash, selecione o diretório em que o projeto será clonado e use o comando:
$ git clone (url do repositório)
-
Em seguida, acesse o site do The Movie Database, realize seu cadastro e gere a chave para utilizar a API.
-
Por fim, vá no arquivo
main.js
e exclua a primeira linha (reponsável pelo import estático da key). Em seguida, atribua à váriavelAPI_KEY
a sua chave, entre aspas. O código ficará semelhante ao exemplo abaixo:
export const API_KEY = "sua chave";
Após estes passos, basta abrir o arquivo index.html
em seu navegador e testar o projeto como desejar.
- HTML
- CSS
- JavaScript
- The Movie Database API
- Flexbox
- Responsividade
- Manipulação do DOM
- Consumo de API
- Reação a eventos no DOM (clique, tecla pressionada)
- Armazenamento de dados no localStorage
- Modularização da aplicação
Ao longo dos sete dias de desafios, pude experimentar uma rotina de desenvolvimento mais estruturada, em que havia um projeto com um design a ser seguido e a cada dia eram dadas instruções do que devia ser feito. Comecei estruturando o HTML de forma estática e aplicando as regras de estilo de acordo com o protótipo estabelecido, e em seguida tornei o processo dinâmico por meio do JavaScript.
De longe, os maiores desafios foram lidar com os dados da API e com o localStorage, uma vez que todas as informações necessárias deveriam ser salvas em uma lista, e não podiam haver itens duplicados. Pude aprender a organizar cada passo da operação e tornar todo o processo o mais legível possível.
Para conhecer mais das minhas experiências desenvolvendo aplicações e aprendendo novas tecnologias, conecte-se comigo no LinkedIn, por lá interajo com outros profissionais e me mantenho ativo na comunidade de desenvolvedores.