Context API with React Hooks. error "Cannot read property '' of null" I'm stuck :(

I would like to make app which you can write your username of GitHub Acount and show your repositories on next page. But I have problem with GlobalStore (Context API).

I can’t read property of state “data” or “user” in children.

I’ve got a error

TypeError: Cannot read property ‘data’ of null

export const Context = React.createContext(null);

function GlobalContext(props) {
  const [user, setUser] = useState(0);
  const [data, setData] = useState(0);
  let inputValue = null;

  const valueHandler = (event) => {
    inputValue =;

  const submitHandler = (e) => {

  useEffect(() => {
    const fetchData = async () => {
      const respUser = await axios(`${user}`);
      const respRepos = await axios(`${user}/repos`);

      setData({user:, repos:})



  }, [user]);

  return (
    <Context.Provider value={{data: data, user: user, valueHandler, submitHandler}}>

There is my App function:

function App() {
  const context = useContext(Context);

  // console.log(;
  if ( == null) {

  return (

I tried to change value of useState to string/number and it’s doesn’t work… How to fix it? How to make it will works??

I think you have it backwards. You’re trying to useContext outside of Context.Provider, that’s why it never changes.

From the structure I see, useContext should be inside either <Home /> or <GlobalStyles />

Have you imported the context into the file containing App?

import { Context } from './GlobalStore.js'