testShortCircuitSyntaxInJSX.jsx

import { StrictMode } from "react";
import ReactDOM from "react-dom";

const rootElement = document.getElementById("root");
const isTure = true;
const isFalse = false;
const isUndefined = undefined;
const isNull = null;

function App(props) {
  return <div className="App">{props.children}</div>;
}

ReactDOM.render(
  <StrictMode>
    <App>
      <h1>Hello, I am a child</h1>
      <h2>I am also a child</h2>
      {isTure && <div>I will be rendered when the first statement is true</div>}
      {isFalse && <h2>I will be rendered when the first statement is true</h2>}
      {isUndefined && <h2>I will be rendered when the first statement is true</h2>}
      {isNull && <h2>I will be rendered when the first statement is true</h2>}
    </App>
  </StrictMode>,
  rootElement
);