Skip to content

Commit

Permalink
Resolve merge conflicts
Browse files Browse the repository at this point in the history
  • Loading branch information
jakubdrozdek committed Jul 14, 2024
1 parent 74b9c5d commit e6e607e
Show file tree
Hide file tree
Showing 6 changed files with 10 additions and 61 deletions.
4 changes: 0 additions & 4 deletions src/components/SocialBanner.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,7 @@ import {useRef, useEffect} from 'react';
import cn from 'classnames';
import {ExternalLink} from './ExternalLink';

<<<<<<< HEAD
const bannerText = 'Dołącz do nas na React Conf 15-16 maja.';
=======
const bannerText = 'Stream React Conf on May 15-16.';
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0
const bannerLink = 'https://conf.react.dev/';
const bannerLinkText = 'Dowiedz się więcej.';

Expand Down
4 changes: 0 additions & 4 deletions src/content/learn/editor-setup.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,11 +40,7 @@ Lintery kodu znajdują problemy w kodzie podczas jego pisania i pomagają je zaw

### Formatowanie {/*formatting*/}

<<<<<<< HEAD
Ostatnia rzecz, jaka powinna się wydarzyć po udostępnieniu twojego kodu współtwórcom projektu, jest dyskusja pt. [tabulatory vs spacje](https://www.google.com/search?q=tabulatory+vs+spacje)! Na szczęście jest [Prettier](https://prettier.io/), który posprząta w twoim kodzie, formatując go według ustalonych reguł. Uruchom Prettiera, a wszystkie tabulatory w kodzie zamienią się na spacje; wszelkie wcięcia, cudzysłowy i apostrofy itp. również zostaną podmienione na podstawie ustawień. Idealnie by było, gdyby Prettier był uruchamiany przy każdym zapisaniu pliku, automatycznie aplikując te reguły za ciebie.
=======
The last thing you want to do when sharing your code with another contributor is get into a discussion about [tabs vs spaces](https://www.google.com/search?q=tabs+vs+spaces)! Fortunately, [Prettier](https://prettier.io/) will clean up your code by reformatting it to conform to preset, configurable rules. Run Prettier, and all your tabs will be converted to spaces—and your indentation, quotes, etc will also all be changed to conform to the configuration. In the ideal setup, Prettier will run when you save your file, quickly making these edits for you.
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0

Aby zainstalować [rozszerzenie Prettier dla VSCode](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode), musisz:

Expand Down
6 changes: 1 addition & 5 deletions src/content/learn/installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -37,11 +37,7 @@ export default function App() {

Możesz edytować kod bezpośrednio lub otworzyć go w nowej zakładce, klikając na przycisk "Forkuj" w prawym górnym rogu.

<<<<<<< HEAD
W całej dokumentacji natkniesz się na wiele takich sandboxów. Poza samą dokumentacją, w sieci istnieje także wiele niezależnych sandboxów, które posiadają wsparcie dla Reacta, na przykład: [CodeSandbox](https://codesandbox.io/s/new), [Stackblitz](https://stackblitz.com/fork/react) czy [CodePen](https://codepen.io/pen?&editors=0010&layout=left&prefill_data_id=3f4569d1-1b11-4bce-bd46-89090eed5ddb).
=======
Most pages in the React documentation contain sandboxes like this. Outside of the React documentation, there are many online sandboxes that support React: for example, [CodeSandbox](https://codesandbox.io/s/new), [StackBlitz](https://stackblitz.com/fork/react), or [CodePen.](https://codepen.io/pen?template=QWYVwWN)
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0
W całej dokumentacji natkniesz się na wiele takich sandboxów. Poza samą dokumentacją, w sieci istnieje także wiele niezależnych sandboxów, które posiadają wsparcie dla Reacta, na przykład: [CodeSandbox](https://codesandbox.io/s/new), [Stackblitz](https://stackblitz.com/fork/react) czy [CodePen](https://codepen.io/pen?template=QWYVwWN).

### Wypróbuj Reacta lokalnie {/*try-react-locally*/}

Expand Down
19 changes: 6 additions & 13 deletions src/content/reference/react/apis.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,34 +10,27 @@ Poza [hookami](/reference/react) i [komponentami](/reference/react/components),

---

<<<<<<< HEAD
* [`createContext`](/reference/react/createContext) pozwala zdefiniować i przekazać kontekst do komponentów potomnych. Używane w parze z [`useContext`.](/reference/react/useContext)
* [`forwardRef`](/reference/react/forwardRef) umożliwia komponentowi na wystawienie do rodzica jakiegoś węzła DOM, służącego za referencję. Używane w parze z [`useRef`.](/reference/react/useRef)
* [`lazy`](/reference/react/lazy) pozwala opóźnić załadowanie kodu komponentu do czasu jego pierwszego wyrenderowania.
* [`memo`](/reference/react/memo) pozwala pominąć renderowanie komponentu, jeśli jego właściwości się nie zmieniły. Używane w parze z [`useMemo`](/reference/react/useMemo) i [`useCallback`.](/reference/react/useCallback)
* [`startTransition`](/reference/react/startTransition) pozwala oznaczyć zmianę stanu jako mało pilną. Podobne do [`useTransition`.](/reference/react/useTransition)
=======
* [`createContext`](/reference/react/createContext) lets you define and provide context to the child components. Used with [`useContext`.](/reference/react/useContext)
* [`forwardRef`](/reference/react/forwardRef) lets your component expose a DOM node as a ref to the parent. Used with [`useRef`.](/reference/react/useRef)
* [`lazy`](/reference/react/lazy) lets you defer loading a component's code until it's rendered for the first time.
* [`memo`](/reference/react/memo) lets your component skip re-renders with same props. Used with [`useMemo`](/reference/react/useMemo) and [`useCallback`.](/reference/react/useCallback)
* [`startTransition`](/reference/react/startTransition) lets you mark a state update as non-urgent. Similar to [`useTransition`.](/reference/react/useTransition)
* [`act`](/reference/react/act) lets you wrap renders and interactions in tests to ensure updates have processed before making assertions.
* [`act`](/reference/react/act) pozwala upewnić się, że wszystkie aktualizacje podczas renderowania i interakcji w testach zostały przetworzone, zanim uruchomione zostaną asercje.

---

## Resource APIs {/*resource-apis*/}
## API zasobów {/*resource-apis*/}

*Resources* can be accessed by a component without having them as part of their state. For example, a component can read a message from a Promise or read styling information from a context.
Do *zasobów* można dostać się z poziomu komponentu bez konieczności tworzenia dla nich stanu lokalnego. Na przykład, komponent może odczytywać wiadomość z Obietnicy (*ang.* Promise) albo informacje o stylu z kontekstu.

To read a value from a resource, use this API:
Aby odczytać wartość z zasobu, użyj tego Hooka:

- [`use`](/reference/react/use) pozwala na odczytanie wartości zasobu, takiego jak [Obietnica (*ang.* Promise)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) lub [kontekst](/learn/passing-data-deeply-with-context).

* [`use`](/reference/react/use) lets you read the value of a resource like a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) or [context](/learn/passing-data-deeply-with-context).
```js
function MessageComponent({ messagePromise }) {
const message = use(messagePromise);
const theme = use(ThemeContext);
// ...
}
```
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0
30 changes: 1 addition & 29 deletions src/content/reference/react/hooks.md
Original file line number Diff line number Diff line change
Expand Up @@ -106,42 +106,14 @@ Aby spriorytetyzować renderowanie, użyj jednego z tych hooków.
---
<<<<<<< HEAD
## Hooki zasobów {/*resource-hooks*/}
Do *zasobów* można dostać się z poziomu komponentu bez konieczności tworzenia dla nich stanu lokalnego. Na przykład, komponent może odczytywać wiadomość z Obietnicy (*ang.* Promise) albo informacje o stylu z kontekstu.
Aby odczytać wartość z zasobu, użyj tego Hooka:
- [`use`](/reference/react/use) pozwala na odczytanie wartości zasobu, takiego jak [Obietnica (*ang.* Promise)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) lub [kontekst](/learn/passing-data-deeply-with-context).
```js
function MessageComponent({ messagePromise }) {
const message = use(messagePromise);
const theme = use(ThemeContext);
// ...
}
```
---
## Inne hooki {/*other-hooks*/}
=======
## Other Hooks {/*other-hooks*/}
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0
Te hooki przydają się zwykle tylko autorom bibliotek i nieczęsto spotyka się je w kodzie aplikacyjnym.
<<<<<<< HEAD
- [`useDebugValue`](/reference/react/useDebugValue) pozwala zmienić etykietę twojego własnego hooka, którą wyświetlają React DevTools.
- [`useId`](/reference/react/useId) pozwala komponentowi przypisać do siebie unikalny identyfikator. Zwykle używane w połączeniu z API dostępności (*ang.* accessibility).
- [`useSyncExternalStore`](/reference/react/useSyncExternalStore) pozwala komponentowi na zasubskrybowanie się do magazynu zewnętrznego.
=======
- [`useDebugValue`](/reference/react/useDebugValue) lets you customize the label React DevTools displays for your custom Hook.
- [`useId`](/reference/react/useId) lets a component associate a unique ID with itself. Typically used with accessibility APIs.
- [`useSyncExternalStore`](/reference/react/useSyncExternalStore) lets a component subscribe to an external store.
* [`useActionState`](/reference/react/useActionState) allows you to manage state of actions.
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0
* [`useActionState`](/reference/react/useActionState) pozwala zarządzać stanem akcji.
---
Expand Down
8 changes: 2 additions & 6 deletions src/content/reference/react/useEffect.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,13 +62,9 @@ function ChatRoom({ roomId }) {
* Jeśli niektóre z twoich zależności to obiekty lub funkcje zdefiniowane wewnątrz komponentu, istnieje ryzyko, że **spowodują, że efekt będzie wykonywał się częściej niż jest to potrzebne.** Aby to naprawić, usuń zbędne zależności od [obiektów](#removing-unnecessary-object-dependencies) i [funkcji](#removing-unnecessary-function-dependencies). Możesz również [wydzielić aktualizacje stanu](#updating-state-based-on-previous-state-from-an-effect) oraz [logikę niereaktywną](#reading-the-latest-props-and-state-from-an-effect) poza efekt.
<<<<<<< HEAD
* Jeśli twój efekt nie został wywołany przez interakcję (np. kliknięcie), React zazwyczaj pozwoli przeglądarce **najpierw odświeżyć ekran przed uruchomieniem twojego efektu.** Jeśli efekt ten wykonuje jakieś operacje związane z wyświetlaniem (np. ustawianie pozycji dymka (ang. *tooltip*)) i opóźnienie jest zauważalne (np. występuje migotanie), zastąp `useEffect` przez [`useLayoutEffect`.](/reference/react/useLayoutEffect)
=======
* If your Effect is caused by an interaction (like a click), **React may run your Effect before the browser paints the updated screen**. This ensures that the result of the Effect can be observed by the event system. Usually, this works as expected. However, if you must defer the work until after paint, such as an `alert()`, you can use `setTimeout`. See [reactwg/react-18/128](https://github.com/reactwg/react-18/discussions/128) for more information.
* Jeśli twój efekt został wywołany przez interakcję (np. kliknięcie), **React może uruchomić go zanim przeglądarka narysuje zaktualizowany ekran**. Dzięki temu wynik efektu może zostać zaobserwowany przez system zdarzeń. Zwykle działa to w oczekiwany sposób. Jeśli jednak koniecznie potrzebujesz opóźnić zadanie do momentu po rysowaniu, np. wyświetlenie `alert()`, możesz skorzystać z `setTimeout`. Po więcej informacji zajrzyj na [reactwg/react-18/128](https://github.com/reactwg/react-18/discussions/128).
* Even if your Effect was caused by an interaction (like a click), **React may allow the browser to repaint the screen before processing the state updates inside your Effect.** Usually, this works as expected. However, if you must block the browser from repainting the screen, you need to replace `useEffect` with [`useLayoutEffect`.](/reference/react/useLayoutEffect)
>>>>>>> 2a2e02f1d88f4d2828728ce352626e84ed8abda0
* Jeśli twój efekt nie został wywołany przez interakcję (np. kliknięcie), React zazwyczaj pozwoli przeglądarce **najpierw odświeżyć ekran przed uruchomieniem twojego efektu.** Jeśli efekt ten wykonuje jakieś operacje związane z wyświetlaniem (np. ustawianie pozycji dymka (ang. *tooltip*)) i opóźnienie jest zauważalne (np. występuje migotanie), zastąp `useEffect` przez [`useLayoutEffect`.](/reference/react/useLayoutEffect)
* Nawet jeśli twój efekt został wywołany przez interakcję (np. kliknięcie), **przeglądarka może odświeżyć ekran przed przetworzeniem aktualizacji stanu wewnątrz twojego efektu.** Zazwyczaj jest to pożądane zachowanie. Niemniej jednak, jeśli chcesz zablokować przeglądarkę przed odświeżaniem ekranu, musisz zastąpić `useEffect` przez [`useLayoutEffect`.](/reference/react/useLayoutEffect)
Expand Down

0 comments on commit e6e607e

Please sign in to comment.