🔗Projeto CineDev: Interface simples de uma plataforma streaming, com objetivo de oferecer ao usuário uma experiência de cinema com filmes de diferentes categorias. Esse projeto contém o mesmo padrão de outras plataformas de filme com pequeno menu de navegação no cabeçalho, uma barra de pesquisa no menu e a exibição dos filmes disponiveis no conteúdo principal da página. Neste projeto é possível selecionar o filme por gênero ou fazer a pesquisa do filme por nome.
| Marcação | Estilização | Programção |
|---|---|---|
| Html | Css | JavaScript |
| 5 | 3 | ECMAScript 2018 |
📚 Através desse projeto foi possível exercitar o uso da linguegem JavaScript em específico as funcionalidades das variáveis compostas para tornar a página dinâmica, e fazer a filtragem dos filmes por categoria, também pesquisando por nome. Usando as informações do array sobre os filmes e manipulando esses dados para conseguir o resultado final na apresentação da página.
Além disso, foi interessante usar o JS para apresentar os filmes sem necessariamente ter o contéudo na marcação HTML, pois com o próprio JS foi possível fazer a listagem dos filmes com loop e a criação de elementos HTML. Usando DOM, e os dados do array e funções para executar tarefas como filtrar e separar os filmes por gênero e criar o template para exibir o resultado.
Foram usados nesse programa estrutura de repetição (forEach) para percorrer o array listando os filmes, comandos de interação de arrays como (filter) para filtrar os filmes por categoria e (find) para realizar pesquisa dos filmes por nome, estrutura condicional (if, else)...
🔗 Esse desenvolvimento foi realizado em uma maratona de aula da escola Kenzie Academy Brasil e apresentado no canal do YouTube da Kenzie.
- README.md
- index.html
- /assets
- /css
- style.css
- /img
- /js
- filmes.js
- script.js
- /css
Concluído ✔️ Objetivo principal do projeto está finalizado. Mas outras funcionalidades poderão ser adicionadas ao CineDev.
🎥📷 Selecionando filme por gênero
🎥📷 Pesquisando filme por nome
Navegador web: Chrome/Edge
Para ver o funcionamento é só clicar aqui
Para extrair o arquivo e trabalhar com o código é bom ter um editor como VSCode por exemplo.