React 19 ile gelen yeni bir hook.

👉 Temel amaç: async değerleri (Promise) ve Context’i daha kolay kullanmak.

Eskiden:

• Asenkron işlemleri useEffect + state ile yapıyorduk.
• Context için useContext kullanıyorduk.

Artık use tek başına hem Promise bekleyebiliyor, hem de Context okuyabiliyor.

1️⃣ Promise ile Kullanım

import { use } from "react";

async function getUser() {
  return fetch("<https://jsonplaceholder.typicode.com/users/1>")
    .then(res => res.json());
}

export default function App() {
  const user = use(getUser()); // Promise’i doğrudan bekliyor

  return (
    <div>
      <h1>{user.name}</h1>
      <p>{user.email}</p>
    </div>
  );
}

📌 Burada dikkat:

• use hook’u async function içinde değil, direkt render sırasında kullanılabilir.
• Promise otomatik olarak çözülüyor (await gibi).
• Suspense ile birlikte çok daha anlamlı (yüklenme state’i yönetmek için).

2️⃣ Context ile Kullanım

import { createContext, use } from "react";

const ThemeContext = createContext("light");

function Child() {
  const theme = use(ThemeContext); // useContext yerine
  return <h1>Aktif tema: {theme}</h1>;
}

export default function App() {
  return (
    <ThemeContext.Provider value="dark">
      <Child />
    </ThemeContext.Provider>
  );
}

📌 Yani artık useContext(ThemeContext) yazmaya gerek yok.

use(ThemeContext) ile aynı işi daha kısa yapıyoruz.

3️⃣ Suspense ile En Güçlü Kullanımı