It's completely valid — and sometimes a very good idea — to use plain JavaScript classes (like your GlobalParam) in a React project, especially for:

• Managing global/shared logic or constants

• Storing utility/helper functions

• Caching data or encapsulating complex non-UI logic

✅ When a Class is Fine

React components are used for rendering UI and handling UI-driven logic (with lifecycle/hooks). But not everything in a React app needs to be a component.

Your example:

export default class GlobalParam {     
static totalItems = 2;    
static getTotalData() {      
    return this.totalItems;    
    } 
} 

This is totally fine. It's essentially a singleton object with static properties/methods — perfect for shared config or utility logic that doesn’t involve React’s state/rendering lifecycle.

🤔 But Be Cautious

If the data inside GlobalParam is meant to be reactive (i.e., when it changes, your components should update), then a plain class won’t be sufficient, because React won’t know when to re-render.

Instead, you should use:

• React Context + useState/useReducer (for global state)

• Redux / Zustand / Recoil (for scalable global state)

• Signals (e.g., in newer meta-frameworks like Preact or React Canary)

❓“How can I make a React data component without return?”

You don’t need to. If your component doesn’t render anything, it probably shouldn’t be a component.

But if you do want a component just for side effects (e.g., fetching, subscriptions), a common pattern is:

const DataLoader = () => {
   useEffect(() => {     
// Fetch data, subscribe, etc.  
 }, []);    
return null; // No UI 
}; 

Or make it a custom hook:

js

CopyEdit

function useGlobalData() { 
  const [data, setData] = useState(null);  
 useEffect(() => {    
 // fetch and set data 
  }, []);   
return data; 
} 

🔑 Summary

• ✅ It's OK to use plain JS classes for non-reactive logic

• 🚫 Don’t put everything in components — only UI or hook-driven logic

• 🔁 If data needs to trigger UI updates, use React state/context/hooks

• 🧩 Consider libraries like Zustand if your global state gets bigger

Let React handle the UI — let plain JavaScript handle logic when React isn't needed.