Недавно у меня возникло желание перекодировать свой сайт-портфолио с простого HTML, CSS и JavaScript на React.js. Я столкнулся с небольшой проблемой при внедрении Particles.js в реагирующий компонент. Если вы не знаете, что такое Particles.js, это простая библиотека, которая придает веб-сайту крутой эффект, как на фото выше. Если вам нужна дополнительная информация, вот ссылка на его библиотеку. https://vincentgarreau.com/particles.js/. После некоторых исследований я обнаружил, что кто-то любезно создал его компонент на npmjs.com. Это немного отличается от игры с ним в обычном JavaScript и JSON, поэтому давайте посмотрим, что нам нужно сделать.

Установка в наш проект React

После его установки мы можем начать играть с ним внутри компонента.

Компонент для эффекта частиц

Таким образом, после создания компонента мы можем передать ему реквизиты для редактирования его настроек и эффектов для частиц. Обычно с простым JavaScript и JSON библиотека требует, чтобы вы вошли в JSON, изменили его настройки и загрузили свой скрипт в HTML.

Реквизит

Вот список свойств, которые мы можем передать в наш компонент.

Вот фрагмент того, как я редактировал его настройки с некоторыми реквизитами.

Вот конечный результат!