Veja como criar uma interface interativa com a temática do aranhaverso do Spider-Man. Vamos utilizar as principais stacks front-end: React, Next.js 13, a biblioteca Framer Motion, Sass e TypeScript para criar um projeto visual incrível e de alta performance.

Além disso, você vai aprender sobre desenvolvimento de animações de alta performance em projetos front-end, como ter maior controle sobre os componentes dos projetos front-end com Next e boas práticas de desenvolvimento front-end.

Esses são alguns dos projetos que você poderá desenvolver com conhecimento obtido a partir desse evento👇

✅ Páginas web animadas e com alta performance; ✅ Aplicações e-commerce como um menu de seleção de produtos; ✅ Aplicações de streaming como a Twitch.

Materiais

• Link da live no Youtube
• Assets (arquivos de imagens e efeitos sonoros)
• Protótipo no Figma
• Github do projeto
  • Branches do projeto (leia o README.md no Github)
    • main projeto finalizado com todas as features implementadas durante a live;
    • template estrutura inicial para que você possa iniciar o projeto, contendo todos os assets, bibliotecas, estrutura de pastas e configurações de ESLint;
    • live parte do projeto já iniciado para o code-review em live, pronto para implementar as interações e animações do usuário com o projeto.

Protótipo e demonstração do projeto

Clique aqui para ir ao protótipo do projeto no Figma.

Tecnologias utilizadas no projeto

• React.js (v18)
• Next.js (v13)