Skip to content

Commit e827878

Browse files
author
Jakub Drozdek
committed
Update already translated files
1 parent 36a11e0 commit e827878

File tree

3 files changed

+11
-55
lines changed

3 files changed

+11
-55
lines changed

content/docs/handling-events.md

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -91,11 +91,7 @@ ReactDOM.render(
9191
);
9292
```
9393

94-
<<<<<<< HEAD
95-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/xEmzGg?editors=0010)
96-
=======
97-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/xEmzGg?editors=0010)
98-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
94+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/xEmzGg?editors=0010)
9995

10096
Należy zwrócić szczególną uwagę na znaczenie `this` funkcjach zwrotnych (ang. *callbacks*) używanych w JSX. W JavaScripcie metody klasy nie są domyślnie [dowiązane](https://developer.mozilla.org/pl/docs/Web/JavaScript/Reference/Functions/Funkcje_strzalkowe) do instancji. Jeśli zapomnisz dowiązać metodę `this.handleClick` i przekażesz ją jako atrybut `onClick`, to `this` przy wywołaniu będzie miało wartość `undefined`.
10197

content/docs/state-and-lifecycle.md

Lines changed: 7 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -29,11 +29,7 @@ function tick() {
2929
setInterval(tick, 1000);
3030
```
3131

32-
<<<<<<< HEAD
33-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/gwoJZk?editors=0010)
34-
=======
35-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/gwoJZk?editors=0010)
36-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
32+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/gwoJZk?editors=0010)
3733

3834
W tym rozdziale dowiemy się, jak sprawić, by komponent `Clock` był w pełni hermetyczny i zdatny do wielokrotnego użytku. Wyposażymy go we własny timer, który będzie aktualizował się co sekundę.
3935

@@ -59,11 +55,7 @@ function tick() {
5955
setInterval(tick, 1000);
6056
```
6157

62-
<<<<<<< HEAD
63-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/dpdoYR?editors=0010)
64-
=======
65-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/dpdoYR?editors=0010)
66-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
58+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/dpdoYR?editors=0010)
6759

6860
Brakuje jeszcze fragmentu, który spełniałby kluczowe założenie: inicjalizacja timera i aktualizowanie UI co sekundę powinny być zaimplementowane w komponencie `Clock`.
6961

@@ -109,11 +101,7 @@ class Clock extends React.Component {
109101
}
110102
```
111103

112-
<<<<<<< HEAD
113-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/zKRGpo?editors=0010)
114-
=======
115-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/zKRGpo?editors=0010)
116-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
104+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/zKRGpo?editors=0010)
117105

118106
Komponent `Clock` przestał już być funkcją i od teraz jest klasą.
119107

@@ -205,11 +193,7 @@ ReactDOM.render(
205193
);
206194
```
207195

208-
<<<<<<< HEAD
209-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/KgQpJd?editors=0010)
210-
=======
211-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/KgQpJd?editors=0010)
212-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
196+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/KgQpJd?editors=0010)
213197

214198
Teraz sprawimy, by komponent `Clock` uruchomił własny timer i aktualizował go co sekundę.
215199

@@ -318,11 +302,7 @@ ReactDOM.render(
318302
);
319303
```
320304

321-
<<<<<<< HEAD
322-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/amqdNA?editors=0010)
323-
=======
324-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/amqdNA?editors=0010)
325-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
305+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/amqdNA?editors=0010)
326306

327307
Teraz timer powinien już tykać co sekundę.
328308

@@ -457,11 +437,7 @@ function FormattedDate(props) {
457437
}
458438
```
459439

460-
<<<<<<< HEAD
461-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/zKRqNB?editors=0010)
462-
=======
463-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/zKRqNB?editors=0010)
464-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
440+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/zKRqNB?editors=0010)
465441

466442
Taki przepływ danych nazywany jest powszechnie jednokierunkowym (ang. *unidirectional*) lub "z góry na dół" (ang. *top-down*). Stan jest zawsze własnością konkretnego komponentu i wszelkie dane lub części UI, powstałe w oparciu o niego, mogą wpłynąć jedynie na komponenty znajdujące się "poniżej" w drzewie.
467443

@@ -486,11 +462,7 @@ ReactDOM.render(
486462
);
487463
```
488464

489-
<<<<<<< HEAD
490-
[**Przetestuj kod na CodePen**](http://codepen.io/gaearon/pen/vXdGmd?editors=0010)
491-
=======
492-
[**Try it on CodePen**](https://codepen.io/gaearon/pen/vXdGmd?editors=0010)
493-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
465+
[**Przetestuj kod na CodePen**](https://codepen.io/gaearon/pen/vXdGmd?editors=0010)
494466

495467
Każdy `Clock` tworzy swój własny timer i aktualizuje go niezależnie od pozostałych.
496468

content/docs/thinking-in-react.md

Lines changed: 3 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -61,11 +61,7 @@ Teraz kiedy już określiliśmy, które z elementów projektu graficznego mają
6161

6262
## Krok 2: Zbuduj wersję statyczną w Reakcie {#step-2-build-a-static-version-in-react}
6363

64-
<<<<<<< HEAD
65-
<p data-height="600" data-theme-id="0" data-slug-hash="BwWzwm" data-default-tab="js" data-user="lacker" data-embed-version="2" class="codepen">Zobacz kod dla podrozdziału<a href="https://codepen.io/gaearon/pen/BwWzwm">Myślenie reactowe: Krok 2"</a> na <a href="http://codepen.io">CodePen</a>.</p>
66-
=======
67-
<p data-height="600" data-theme-id="0" data-slug-hash="BwWzwm" data-default-tab="js" data-user="lacker" data-embed-version="2" class="codepen">See the Pen <a href="https://codepen.io/gaearon/pen/BwWzwm">Thinking In React: Step 2</a> on <a href="https://codepen.io">CodePen</a>.</p>
68-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
64+
<p data-height="600" data-theme-id="0" data-slug-hash="BwWzwm" data-default-tab="js" data-user="lacker" data-embed-version="2" class="codepen">Zobacz kod dla podrozdziału <a href="https://codepen.io/gaearon/pen/BwWzwm">"Myślenie reactowe: Krok 2"</a> na <a href="https://codepen.io">CodePen</a>.</p>
6965
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>
7066

7167
Skoro wiemy już, jak wygląda hierarchia naszych komponentów, możemy zacząć ją wdrażać. Budowę aplikacji najłatwiej jest zacząć od od wersji statycznej, tzn. takiej która wyrenderuje interfejs użytkownika na podstawie naszego modelu danych, ale nie będzie zawierała żadnych elementów interaktywnych. Dobrze jest rozdzielić te procesy, ponieważ budowa wersji statycznej wymaga więcej pisania niż myślenia, podczas gdy dodawanie interaktywności wymaga więcej myślenia niż pisania. Za chwilę zobaczysz dlaczego.
@@ -109,13 +105,9 @@ Zatem ostatecznie nasz stan przestawia się następująco:
109105

110106
## Krok 4: Określ, gdzie powinien się mieścić stan {#step-4-identify-where-your-state-should-live}
111107

112-
<p data-height="600" data-theme-id="0" data-slug-hash="qPrNQZ" data-default-tab="js" data-user="lacker" data-embed-version="2" class="codepen">Zobacz kod dla podrozdziału<a href="https://codepen.io/gaearon/pen/qPrNQZ">"Myślenie reactowe: Krok 4"</a> na <a href="http://codepen.io">CodePen</a>.</p>
108+
<p data-height="600" data-theme-id="0" data-slug-hash="qPrNQZ" data-default-tab="js" data-user="lacker" data-embed-version="2" class="codepen">Zobacz kod dla podrozdziału <a href="https://codepen.io/gaearon/pen/qPrNQZ">"Myślenie reactowe: Krok 4"</a> na <a href="https://codepen.io">CodePen</a>.</p>
113109

114-
<<<<<<< HEAD
115110
Mamy zatem określony minimalny zestaw danych stanu aplikacji. Teraz musimy określić, który z naszych komponentów ulega zmianom, czyli do którego komponentu *należy* stan.
116-
=======
117-
<p data-height="600" data-theme-id="0" data-slug-hash="qPrNQZ" data-default-tab="js" data-user="lacker" data-embed-version="2" class="codepen">See the Pen <a href="https://codepen.io/gaearon/pen/qPrNQZ">Thinking In React: Step 4</a> on <a href="https://codepen.io">CodePen</a>.</p>
118-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
119111

120112
Pamiętaj: Dane w Reakcie płyną tylko w jedną stronę - z góry w dół hierarchii komponentów. Przynależność stanu do danego komponentu nie jest sprawą oczywistą i *często przysparza problemów na początku pracy z Reactem*. Aby to dobrze zrozumieć, postępuj zgodnie z następującymi wskazówkami:
121113

@@ -138,13 +130,9 @@ Teraz widać już, jak będzię działała nasza aplikacja: ustawiamy `filterTex
138130

139131
## Krok 5: Dodaj przepływ danych w drugą stronę {#step-5-add-inverse-data-flow}
140132

141-
<p data-height="600" data-theme-id="0" data-slug-hash="LzWZvb" data-default-tab="js,result" data-user="rohan10" data-embed-version="2" data-pen-title="Thinking In React: Step 5" class="codepen">Zobacz kod dla podrozdziału<a href="https://codepen.io/gaearon/pen/LzWZvb">"Myślenie reactowe: Krok 5"</a> na <a href="http://codepen.io">CodePen</a>.</p>
133+
<p data-height="600" data-theme-id="0" data-slug-hash="LzWZvb" data-default-tab="js,result" data-user="rohan10" data-embed-version="2" data-pen-title="Myślenie reactowe: Krok 5" class="codepen">Zobacz kod dla podrozdziału<a href="https://codepen.io/gaearon/pen/LzWZvb">"Myślenie reactowe: Krok 5"</a> na <a href="https://codepen.io">CodePen</a>.</p>
142134

143-
<<<<<<< HEAD
144135
Jak dotąd zbudowaliśmy aplikację, która poprawnie wyświetla informacje dostarczone przez atrybuty i stan spływające w dół hierarchii komponentów. Nadszedł czas aby umożliwić przepływ danych w przeciwnym kierunku: komponenty formularza głęboko wewnątrz hierarchii muszą mieć możliwość aktualizowania stanu `FilterableProductTable`
145-
=======
146-
<p data-height="600" data-theme-id="0" data-slug-hash="LzWZvb" data-default-tab="js,result" data-user="rohan10" data-embed-version="2" data-pen-title="Thinking In React: Step 5" class="codepen">See the Pen <a href="https://codepen.io/gaearon/pen/LzWZvb">Thinking In React: Step 5</a> on <a href="https://codepen.io">CodePen</a>.</p>
147-
>>>>>>> d615c5b7bcceef420c7f9246035f8ae3ba8ae11a
148136

149137
W Reakcie ten przepływ danych jest jawny. Pozwala to łatwo zobaczyć działanie aplikacji, ale zarazem wymaga trochę więcej kodu niż tradycyjne wiązanie dwukierunkowe (ang. *two-way binding*).
150138

0 commit comments

Comments
 (0)