Implemente Designs de Alta Fidelidade com Material-UI e ReactJS

Reduza a lacuna entre Design e Desenvolvimento!

Desmembre designs detalhados e dê vida a eles com Material-UI/React.

Bem-vindo ao recurso pago de documentação número 1 recomendado para aprender Material-UI!

Ao longo de 35 horas e mais de 200 palestras, John Smith vai te ensinar absolutamente tudo o que você precisa saber sobre como construir aplicativos finamente projetados usando a ferramenta mais útil que ele aprendeu desde o próprio React - Material-UI! Leve suas habilidades de desenvolvimento web para um novo nível e destaque-se dos desenvolvedores React médios, ganhando confiança para construir aplicativos com design profissional! Depois de aprender React, muitos desenvolvedores enfrentam um problema comum - quais são as melhores práticas para realmente construir seu próprio projeto!? Você pode ter uma ideia na cabeça para um aplicativo ou site realmente legal, mas sentir que não saberia exatamente como criá-lo com React. Você deve construir cada pequeno componente e funcionalidade do zero? Definitivamente não! Aprenda a deixar o Material-UI fazer o trabalho pesado para você, com sua biblioteca de componentes personalizáveis e abrangentes, com estilização integrada, temas, grid e sistemas de design responsivo.

A maioria dos cursos que você faz ao aprender React se concentra em ensinar os conceitos principais e a sintaxe/estruturas fundamentais necessárias para entender e construir aplicativos React. Isso geralmente é feito construindo um punhado de pequenos projetos, cada um focado em um determinado conceito, ou construindo um grande projeto e incorporando cada conceito conforme você avança. Aprender dessa forma é ótimo e absolutamente essencial para entender o assunto. No entanto, John Smith percebeu que, devido ao foco nos conceitos e funcionalidades subjacentes, a maioria dos designs e layouts não são particularmente interessantes! Nenhum dos designs é ruim, de forma alguma - e esse não é o foco dos cursos de React puro, então isso não é um problema - mas geralmente não são algo que você daria a um cliente pagante, então isso deixa uma lacuna quando você começa a trabalhar por conta própria. É exatamente por isso que ele fez este curso!

Vamos construir dois projetos completos do zero com base apenas em arquivos de design - incluindo seu próprio site de produção real! John Smith vai te guiar pelo processo de aprendizado que ele passou quando construiu seu primeiro aplicativo de produção - desde o início do projeto com uma tela em branco até a implantação de um site totalmente responsivo. O que ele realmente tenta enfatizar é a maneira de pensar sobre a estruturação de layouts no Material-UI. Primeiro, vamos analisar capturas de tela do design que estamos prestes a construir e desmembrar visualmente a configuração da grade necessária para alcançar cada aparência, juntamente com trechos de código correspondentes! Em seguida, vamos para o editor de código para colocá-lo em ação. Também vamos revisar a documentação de cada componente do Material-UI antes de usá-lo em nosso projeto, para que você esteja familiarizado com todas as diferentes capacidades, não apenas os recursos que usamos! Cada componente é extremamente flexível e um dos objetivos de John Smith para este curso foi dar a você conhecimento suficiente sobre todo o ecossistema atual para estar pronto para entender quaisquer atualizações futuras.

Uma parte fundamental da construção de aplicativos de produção é garantir que seus estilos e funcionalidades não funcionem apenas no seu sistema, mas sejam flexíveis e responsivos a qualquer ambiente. É por isso que John Smith enfatiza as práticas de design responsivo, para que você entenda não apenas os conceitos a serem considerados, mas também como implementá-los com o Material-UI e obter estilos perfeitos nas telas maiores, menores e em todas as telas intermediárias. Isso se tornará algo natural e todos nós desfrutaremos de experiências de usuário mais otimizadas na web. Também abordaremos tópicos extras, como SEO em React, mudando nosso projeto para o Next.js e os benefícios disso, conectando o Google Analytics para começar a tomar decisões baseadas em dados, integrando animações do After Effects e muito mais!

O conteúdo do curso inclui:

• Configurando um novo projeto com create-react-app, React Router e Material-UI
• Explicações guiadas da documentação para quase todos os componentes do Material-UI, seguidas de sua implementação em nosso projeto
• Diferentes estratégias de otimização de imagens
• Criando um tema para sua aplicação dominando o sistema de estilização centralizado do Material-UI
• Aprendendo a usar design responsivo para garantir que suas aplicações fiquem perfeitas em qualquer tamanho e orientação de tela!
• Usando o sistema de grid do Material-UI para alinhar layouts complexos perfeitamente
• Exportando animações do Adobe After Effects e integrando-as de forma eficiente em um aplicativo React com react-lottie
• Aproveitando a funcionalidade serverless com as Funções do Google Firebase Cloud
• Enviando e-mails por meio do Node.js
• Fazendo solicitações de rede no React enquanto exibe feedback como indicadores de carregamento com o Material-UI
• Otimização para mecanismos de busca (SEO) em aplicações React
• Migrando um projeto do create-react-app para o Next.js e por que fazer isso
• Teste e suporte em vários navegadores
• Implantando um projeto Next.js e adicionando um nome de domínio personalizado - para duas plataformas de hospedagem diferentes
• Incorporando o Google Analytics para coletar dados sobre quem está interagindo com sua aplicação e o que eles estão fazendo
• Construindo funcionalidades organizacionais personalizadas para controlar os dados exibidos em tabelas, incluindo pesquisa, filtragem, exclusão e desfazer

Junto com acesso vitalício a mais de 35 HORAS de conteúdo, você também encontrará fácil acesso ao suporte por meio de perguntas e respostas ativas. Você não tem nada a perder - este curso vem com uma garantia de reembolso de 30 dias caso você não esteja completamente satisfeito! Enfrente o desafio, borre a linha entre design e desenvolvimento e aprenda a criar os projetos que você imaginou.

O que você vai aprender

• Criar aplicativos de produção lindamente projetados do zero com Material-UI
• Construir aplicativos que fiquem perfeitos em todas as telas com o sistema de design responsivo do Material-UI
• Aprimorar a intuição de design UX/UI e ver conceitos em ação
• Otimização para mecanismos de busca em React JS
• Migrar do create-react-app para o Next JS
• Usar funções serverless com o Firebase
• Exportar e integrar animações de forma eficiente com react-lottie
• Colete dados e rastreie eventos com o Google Analytics em React JS
• Garantir suporte em vários navegadores com seus estilos no Material-UI
• Implantar aplicativos de produção Material-UI/React JS