Aprenda Programação JavaScript e Uso do Webpack através da Criação de 5 Aplicativos e Agrupamento de Arquivos

Crie Aplicativos de Jogos em um Formato Prático!

Aprenda habilidades de codificação JavaScript, estrutura de aplicativos e processo de desenvolvimento. Domine a manipulação do DOM para alcançar vários efeitos dinâmicos. Além disso, receba explicações concisas e compreensíveis sobre o Webpack essencial. Classificação: 4.4 de 524 avaliações. 7.5 horas totais. 69 palestras. Todos os níveis.

Crie Aplicativos de Jogos em um Formato Prático!

Aprenda habilidades de codificação JavaScript, estrutura de aplicativos e processo de desenvolvimento. Domine a manipulação do DOM para alcançar vários efeitos dinâmicos. Além disso, receba explicações concisas e compreensíveis sobre o Webpack essencial.

Este curso é projetado para aqueles que aprenderam o básico do JavaScript e estão procurando o próximo passo, bem como aqueles que estão interessados em começar com React ou Vuejs (mencionados posteriormente). Se você já se perguntou: Eu entendo Array, Object, forEach, etc., mas quando devo usá-los na prática? ou Eu quero manipular sites livremente manipulando o DOM ou Eu posso manipular o DOM até certo ponto, mas o que devo fazer para melhorar ainda mais minhas habilidades? então este curso é para você. Embora não cubramos componentes frequentemente usados em sites, como menus suspensos, acordeões e sliders, você aprenderá as habilidades e procedimentos necessários para criá-los de acordo com suas próprias ideias. Vamos criar os movimentos desejados dentro do site do zero com base em suas próprias ideias. Neste curso, você criará 5 aplicativos: Lista de Tarefas, Jogo de Digitação, Jogo de Quebra-Cabeça de Deslizar, Jogo de Cartas de Memória e Jogo da Vida de Conway. O desenvolvimento de aplicativos em si é uma tarefa muito prazerosa, mas você deve ser capaz de continuar aproveitando-o fazendo alterações no design e adicionando novos recursos. Embora a aparência seja simples, há profundidade na montagem do aplicativo e sua lógica. Ao aprender isso, a porta para criar por si mesmo certamente se abrirá. Além disso, para aqueles que estão desafiando o React, Vuejs e outras bibliotecas e frameworks pela primeira vez, a estrutura de diretórios e os arquivos que eles encontram pela primeira vez, como node_module e package.json, podem ser confusos. Mesmo sem entender esses arquivos, é possível continuar aprendendo a sintaxe, mas você pode continuar se sentindo inseguro sobre a natureza da caixa preta desses arquivos. Portanto, neste curso, também nos aprofundaremos nas áreas desafiadoras de agrupamento e compilação de arquivos. O que você aprenderá é o Webpack, que atualmente é a figura central nesse campo. Resumimos o conteúdo em um formato compacto que lhe dará tranquilidade, dizendo que se você entender isso, ficará bem. Embora o React e o Vuejs tenham suas próprias configurações exclusivas, você será capaz de compreender firmemente sua essência comum. Com essa compreensão, você poderá incorporar bibliotecas npm em seu site e introduzi-las. Embora esse campo de programação esteja em constante evolução, queremos transmitir os conceitos subjacentes e a diversão de criar neste curso. Por favor, encare este curso como um desafio.

O que você aprenderá

• Como usar import/export com ES Modules
• Uso de atalhos do Visual Studio Code
• Técnicas para dar vida às ideias com base na criação de jogos (digitação, quebra-cabeça de deslizar, jogo de cartas de memória, jogo da vida e lista de tarefas)
• Manipulação do DOM (Recuperação de elementos usando getElementById / querySelector / createElement, Manipulação de elementos usando classList / textContent / setAttribute)
• Execução de ações com base em eventos como clique / mouseover / change usando addEventListener / removeEventListener
• Manipulação de propriedades de eventos como event_target / event_key / event_offsetX
• Uso de operadores lógicos (or / and / not) e operador ternário
• Salvando e recuperando dados usando o Local Storage do navegador
• Uso de atributos de dados
• Manipulação de valores inseridos em input / textarea
• Manipulação de temporizadores usando setTimeout / setInterval / clearInterval
• Utilização de fetch para uso de API (requisição / resposta, manipulação de arquivos JSON)
• Compreensão de Promises (pendente, cumprida, rejeitada)
• Uso de async / await
• Alternância de exibição usando display none / flex / block
• Controle do progresso do jogo usando flags como isPlaying
• Lógica de troca de grade e elemento HTML usando eventos de clique
• Recuperação de tamanho e proporção de imagens originais usando naturalWidth / naturalHeight
• Embaralhamento e lógica de troca de elementos de Array
• Compreensão de funções recursivas
• Criação e manipulação de coordenadas X-Y da grade
• Uso da API Canvas
• Uso de requestAnimationFrame / cancelAnimationFrame para animação de canvas
• Compreensão do conjunto inicial de arquivos fornecidos no React e Vuejs
• Compreensão e escrita das partes principais do package_json
• Uso principal do webpack (agrupamento de módulos, minificação, saída)
• Criação do arquivo de configuração do webpack
• Uso do webpack-dev-server
• Saída e otimização de arquivos usando loaders e plugins
• Compilação de arquivos JS usando babel e core-js