O Alura MIDI é um instrumento musical de interface digitial (MIDI), que reproduz sons de instrumentos musicais, por enquanto de uma bateria, ao usuário clicar ou pressionar com teclado em seus botões.
O MIDI tem um teclado digitial com 9 botões, cada botão reproduzirá o som de dado instrumento musical. O HTML carregará os arquivos de mídia com o som dos instrumentos através do elemento <audio>, e com o MIDI vamos controlar a reprodução destes arquivos de mídia através do clique em seus elementos <button>. Serão 9 sons diferentes.
HTML: O HTML tem um papel fundamental para a aplicação funcionar corretamente com a inserção dos elementos<audio>que irão prover para o JavaScript os controles de reprodução da mídia carregada. O HTML já virá pronto nos arquivos iniciais do curso;CSS: O CSS tem papel fundamental para indicar a interação do usuário com a interface gráfica, portanto indica quando os botões são pressionados por mouse ou teclado. O CSS já virá pronto nos arquivos iniciais do curso;JavaScript: O JavaScript proporcionará programarmos a dinâmica de controle de reprodução de um som, que a princípio está sendo realizada pelo elemento<audio>, e passarmos este controle para os elementos<button>, com todo o cuidado de fazer um código inteligente, sem repetição, que cuida também os aspectos visuais com CSS dinâmico. Abaixo alguns tópicos abordados no curso:querySelector;document;const;function;while;for;if;else;template string;event handlers;
Veja o projeto final do curso em funcionamento.
Neste repositório você tem acesso a todo o material produzido no curso.
Para abrir e rodar o projeto, basta abrir o aquivo index.html no navegador.
Busque na plataforma da Alura o curso JavaScript para web: crie páginas dinâmicas publicado na Escola Frontend.