What is JSX

Do not let the name fool you. It is basically JSX is a HTML-like language for React component to return it UI. It is a syntactic sugar for React.createElement(). The following React functional component return a JSX within the ().

One thing to note that for HTML class name, JSX does not support the name class, and we need to use className instead. Otherwise, it just like write HTML with binding supported.

function App() {
  return (
      <div className={"my-class-name, btn"}>
          Work times fun!
      </div>
  );
}

You need to put your JSX code inside one container, like putting everything inside a div block like

return (
   <div> 
      <Your_Component_1 />
      <Your_Component_2 />
      <Your_Component_3 />
      <Your_Component 4 />            
   </div>
);