<UserContext.Provider value ={user}>

import './App.css';
import {createContext, useContext, useState} from "react";

export const UserContext = createContext({username:'unknown', age:0});

export default function App() {
    const [user, setUser] = useState({username:'scmoon',age:19})
    const [count, setCount] = useState(0);
    console.log('app render')
  return (
      <div>
          <UserContext.Provider value ={user}>
              <Profile/>
              <button onClick={()=>{setCount(count+1)}}> 증가 </button>
          </UserContext.Provider>

      </div>
  );
}

function Profile(){
    console.log('profile render..')

    return (
        <div>
            <Greeting/>
        </div>
    );
}

function Greeting(){
    console.log('greeting render..');
    const {username} = useContext(UserContext);
    return `${username} 님 안녕하세요. `
}