JS Particles not rendering on Webpage

[j-zylstra]

can anybody help me?

I'm attempting to use the Javascript particles feature on my react app. Everything is compiled successfully but I see no change to my app in the live server.

[matteobruni]

Hi, can you share some code or a reproducible sample?

[j-zylstra]

import React, { Component } from 'react';
import Navigation from './components/Navigation/Navigation';
import Logo from './components/Logo/Logo';
import Rank from './components/Rank/Rank';
import ImageLinkForm from './components/ImageLinkForm/ImageLinkForm';
import Particles from './components/Particles/particles';
import './App.css';
  
class App extends Component {
  render() { 
    return (
      <div className="App">
      
        <Particles className='particles'/>
        <Navigation/> 
        <Logo/>
        <Rank />
        <ImageLinkForm />
      </div>
    );
  }
}

export default App;

above is my App.js file
below is my particles.js file

import Particles from 'react-tsparticles';
import { loadSlim } from 'tsparticles-slim';
//import { loadFull } from 'tsparticles';
import { useCallback, useMemo } from 'react';

const ParticlesComponent = () => {
   const options = useMemo(() => {
           return {
              particles: {
                links: {
                    enable: true,
                },
                move: {
                    enable: true,
                }
              }

           };
    }, []);


   const particlesInit = useCallback((engine) => {
       loadSlim(engine);
   }, []);


 return <Particles init={particlesInit} options={options}/>;

};

export default ParticlesComponent;

[matteobruni]

Starting from 2.9.0 the number options must be specified since the default value is 0

[j-zylstra]

well played sir, a thousand thankyous!