Projeto de Animação React SCSS

Neste curso, começaremos criando um componente de tela de abertura, seguido por um componente de elemento animado. Neste curso, começaremos criando um componente de tela de abertura, seguido por um componente de elemento animado. Definiremos nosso primeiro conjunto de animações usando SCSS. Nos esforçaremos para torná-lo altamente modular para que possamos importar todas as animações que criamos ou apenas as poucas que queremos usar. Depois de definir as animações, as importaremos para nosso projeto e modificaremos nossa tela de abertura e elemento animado para desaparecer após um certo tempo. Vamos começar escrevendo as opções de configuração e criando um novo arquivo que podemos importar em todas as nossas diferentes animações. Este arquivo conterá os parâmetros comuns que geralmente aplicamos. Definiremos nossas opções de animação e adicionaremos nossa primeira animação, que cuidará do desaparecimento e/ou aparecimento suave do elemento. Escreveremos tudo como mixins separados para que possamos importar facilmente partes individuais, se necessário. Em seguida, criaremos o componente de tela de abertura e chamaremos a animação desejada definida na lógica do AnimatableItem. É claro que precisaremos começar criando um novo projeto para nosso trabalho. Para isso, usei o create-react-app e adicionei uma simples utilidade JavaScript para concatenação condicional de nomes de classe. React é a biblioteca mais popular para o desenvolvimento de aplicações web e uma das habilidades mais procuradas para desenvolvedores JavaScript em 2018. O foco deste curso é o desenvolvimento prático de aplicações React. Isso significa que não abordaremos apenas o uso eficiente do React em si, mas também todo o ecossistema de ferramentas e bibliotecas necessárias para criar uma aplicação de interface de usuário completa. Ao desenvolver aplicações reais, aprenderemos as ferramentas mais importantes no ecossistema React: React API Context, Animation SCSS, Clean Architecture SCSS e Best Practices SCSS & React. O que você aprenderá: - Como usar elementos animados, modularidade, etc. - React API Context, Animation SCSS - Clean Architecture SCSS - Melhores Práticas SCSS & React