title: ReferenceError: React is not defined for context
body: <pre><code>import './App.css';
  import ComponentC from './components/ComponentC';
  
  export const UserContext = React.createContext()
  function App() {
    return (
      &lt;div className=&quot;App&quot;&gt;
        
        &lt;UserContext.Provider value={&quot;deneme&quot;}&gt;
          &lt;ComponentC /&gt;
        &lt;/UserContext.Provider&gt;
  
      &lt;/div&gt;
    );
  }
  
  export default App;
  
  
  import React from 'react'
  import ComponentE from './ComponentE'
  
  function ComponentC() {
      return (
          &lt;div&gt;
              &lt;ComponentE /&gt;
          &lt;/div&gt;
      )
  }
  
  export default ComponentC
  
  import React from 'react'
  import ComponentF from './ComponentF'
  
  
  function ComponentE() {
      return (
          &lt;div&gt;
              &lt;ComponentF /&gt;
          &lt;/div&gt;
      )
  }
  
  export default ComponentE
  
  import React from 'react'
  import { UserContext } from &quot;../App&quot;
  
  
  function ComponentF() {
      return (
          &lt;div&gt;
              &lt;UserContext.Consumer&gt;
                  {
                      user =&gt; {
                          return &lt;div&gt;User Context value {user}&lt;/div&gt;
                      }
                  }
              &lt;/UserContext.Consumer&gt;
  
          &lt;/div&gt;
      )
  }
  
  export default ComponentF
  </code></pre>
  <p>I have error ReferenceError: React is not defined, I don't understand why I am so new in react.js
  so i need some help.
  Thanks.</p>