Страница личного портфолио www.fdaviz.com встроенное в React.
Установлено новое приложение React с использованием Node JS.
Мигрировал мою версию портфеля Vanillajs и перенес ее в новое приложение React.
Первым подходом было использование библиотек для создания анимации, потому что создание моего собственного занимало много времени. По этой причине я решил использовать библиотеки WOW.JS и Animate.css.
Используемые React Reps для управления компонентами ссылок в приложении и обмена деталями компонентов для создания SmoothScroll USIGN мой собственный код.
Большая часть страницы использует Bootstrap, за исключением модальной галереи, в которой есть мой собственный код Flex-Box CSS3.
Создал разные модалы для проекта галереи и используя обработчики событий React Я мог бы показать каждый модал проекта.
Форма использует FormsFree.io для подчинения бэкэнд.
Я использовал изображения из Unsplash, которые могут бесплатно использовать, и значки из Flaticon, которые также могут бесплатно использовать.
Я хотел создать удивительный анимированный фон в верхней части страницы, поэтому я использовал некоторую помощь от codepen.io и адаптировал код на свой веб -сайт.
Реализация wow.js + animate.css была сложной в начале, но того стоила. Требуется время, чтобы заставить его работать с вашим приложением, но требуется меньше времени, чем создание собственных библиотек.
Распределение деталей компонента DOM, таких как высота, смещение и т. Д., Между другими компонентами было немного сложно, поскольку React Refs должна была соответствовать идентификаторам родительских контейнеров. Это потребовалось много времени, чтобы выяснить.
После некоторого использования начальной загрузки мне пришлось изучить некоторые уловки CSS3, такие как Flex-Box и как использовать @KeyFrames + анимацию.
Спасибо за посещение моего React-Portfolio-Website и за то, что уделили время, чтобы прочитать это!