Co oznacza "single source of truth"?

Question

Accepted Answer

**Single source of truth** oznacza, że każdy element danych jest przechowywany **w dokładnie jednym miejscu**, a wszystko, co go potrzebuje, czyta stamtąd — zamiast przechowywać wiele kopii, które mogą się desynchronizować.

## Dlaczego to ważne: zduplikowany, rozbieżny stan

```jsx
// ❌ the same data stored in two places → they can disagree
function Profile() {
  const [user, setUser] = useState({ name: "Ann" });
  const [displayName, setDisplayName] = useState("Ann"); // a COPY of user.name

function rename(newName) {
    setUser({ ...user, name: newName }); // updated user...
    // ...but forgot to update displayName → now they're out of sync! 🐛
  }
}
```

Kiedy ten sam fakt istnieje w dwóch stanach, każda aktualizacja musi pamiętać o zmianie obu — i niechybnie jedna zostanie pominięta, powodując błędy, w których interfejs użytkownika wyświetla niespójne wartości.

## Rozwiązanie: jedno źródło, resztę wyprowadź

```jsx
// ✅ user.name is the single source; displayName is DERIVED, not stored
function Profile() {
  const [user, setUser] = useState({ name: "Ann" });
  const displayName = user.name.toUpperCase(); // computed on render — always in sync

function rename(newName) {
    setUser({ ...user, name: newName }); // one update, everything stays consistent
  }
}
```

Zachowaj wartość kanoniczną raz; oblicz wszystko, co można z niej wyprowadzić na bieżąco. Nie ma nic do synchronizowania.

## Gdzie stosuje się ta zasada

```text
✓ Don't copy props into state (the prop is the source)
✓ Don't store derived values (compute them: totals, filtered lists, formatted text)
✓ Global stores (Redux/Pinia): one store is the source for shared data
✓ Server data: cache it once (React Query) rather than copying into many components
✓ URL as source: filters/page in the URL, read from there
```

## Dlaczego to ważne

Single source of truth jest fundamentalną zasadą niezawodnego zarządzania stanem — eliminuje całą klasę błędów spowodowanych zduplikowanymi danymi, które się rozbiegają.

Dlatego *wyprowadzasz* wartości zamiast je przechowywać, *unikasz* kopiowania props do state'u i *centralizujesz* wspólne dane w globalnych magazynach.

Kiedy dane mają jeden autorytatywny dom i wszystko z niego czyta, interfejs użytkownika pozostaje spójny z konstrukcji.