Página de portfólio pessoal www.fdaviz.com construído em React.
Instalou o novo aplicativo React usando o nó JS.
Migrou minha versão do portfólio de baunilas e migrou para um novo aplicativo React.
A primeira abordagem foi usar bibliotecas para criar animações porque criar o meu próprio era demorado. Por esse motivo, decidi usar bibliotecas wow.js e Animate.css.
Utilizou os adereços do React para gerenciar referências de componentes no aplicativo e compartilhar detalhes dos componentes para criar o SmoothScroll Usign meu próprio código.
A maior parte da página usa o Bootstrap, exceto a galeria modal que possui meu próprio código de caixa flexível CSS3.
Criou modais diferentes para o projeto da galeria e usando os manipuladores de eventos do React, eu poderia mostrar a cada projeto modal.
O formulário usa o formsfree.io para o envio de back -end.
Usei imagens da UNSPLASH, que são gratuitas e ícones da Flaticon, que também são livres para usar.
Eu queria criar um fundo animado incrível na parte superior da página, então usei alguma ajuda do codepen.io e adaptei o código ao meu site.
A implementação do wow.js + animate.css foi difícil no começo, mas vale a pena. Leva tempo para fazê -lo funcionar com seu aplicativo, mas leva menos tempo do que construir suas próprias bibliotecas.
O compartilhamento de detalhes do componente DOM, como altura, sossettops, etc., entre outros componentes foi um pouco difícil, porque os refs do React tinham que corresponder aos IDs dos contêineres dos pais. Isso levou muito tempo para descobrir.
Depois de usar o Bootstrap por um tempo, tive que aprender alguns truques CSS3, como Flex-Box e como usar @keyframes + animação.
Obrigado por visitar meu site de portfolio react e por ter tempo para ler isso!