Skip to content

Commit bdda72a

Browse files
author
Jakub Drozdek
committed
Lowercase all 'You's
1 parent c879073 commit bdda72a

File tree

1 file changed

+10
-10
lines changed

1 file changed

+10
-10
lines changed

content/tutorial/tutorial.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ Ten samouczek nie zakłada jakiejkolwiek znajomości Reacta.
1616

1717
## Zanim zaczniemy się uczyć {#before-we-start-the-tutorial}
1818

19-
W tym samouczku skupimy się na stworzeniu niewielkiej gry. **Być może po tym zdaniu zechcesz go pominąć, bo nie zajmujesz się pisaniem gier - ale mimo wszystko daj mu szansę**. Techniki, których nauczysz się w tym poradniku są fundamentami do zbudowania *dowolnej* aplikacji w Reakcie, a zrozumienie ich zapewni Ci dogłębne poznanie tematu.
19+
W tym samouczku skupimy się na stworzeniu niewielkiej gry. **Być może po tym zdaniu zechcesz go pominąć, bo nie zajmujesz się pisaniem gier - ale mimo wszystko daj mu szansę**. Techniki, których nauczysz się w tym poradniku są fundamentami do zbudowania *dowolnej* aplikacji w Reakcie, a zrozumienie ich zapewni ci dogłębne poznanie tematu.
2020

2121
>Uwaga
2222
>
@@ -31,13 +31,13 @@ Samouczek podzieliliśmy na kilka części:
3131

3232
Nie musisz wcale przechodzić przez wszystkie części samouczka naraz, żeby wynieść z niego cokolwiek. Spróbuj jednak dojść najdalej jak możesz - nawet jeśli będą to tylko dwa rozdziały.
3333

34-
W trakcie wykonywania poleceń możesz kopiować kod do edytora, ale zalecamy pisać go samodzielnie. Pozwoli Ci to wyrobić pamięć mięśniową i lepiej zrozumieć temat.
34+
W trakcie wykonywania poleceń możesz kopiować kod do edytora, ale zalecamy pisać go samodzielnie. Pozwoli ci to wyrobić pamięć mięśniową i lepiej zrozumieć temat.
3535

3636
### Co będziemy budować? {#what-are-we-building}
3737

3838
W tym samouczku pokażemy, jak przy pomocy Reacta zbudować interaktywną grę w "kółko i krzyżyk".
3939

40-
Na koniec nasz kod będzie wyglądał tak: **[Efekt końcowy](https://codepen.io/gaearon/pen/gWWZgR?editors=0010)**. Być może w tej chwili kod wygląda bez sensu albo nie rozumiesz jego składni, ale bez obaw! Celem tego samouczka jest właśnie pomóc Ci zrozumieć Reacta i jego składnię.
40+
Na koniec nasz kod będzie wyglądał tak: **[Efekt końcowy](https://codepen.io/gaearon/pen/gWWZgR?editors=0010)**. Być może w tej chwili kod wygląda bez sensu albo nie rozumiesz jego składni, ale bez obaw! Celem tego samouczka jest właśnie pomóc ci zrozumieć Reacta i jego składnię.
4141

4242
Przed dalszą lekturą radzimy uruchomić grę w "kółko i krzyżyk". Jedną z funkcjonalności, znajdującą się na prawo od planszy, jest numerowana lista. Służy ona do wyświetlania historii wszystkich ruchów, jakie wykonano podczas rozgrywki, i jest aktualizowana na bieżąco w trakcie gry.
4343

@@ -120,7 +120,7 @@ Zalecamy wykonanie [tych instrukcji](https://babeljs.io/docs/editors/). Pozwoli
120120

121121
### Pomocy, nie wiem, co robić! {#help-im-stuck}
122122

123-
Jeśli w którymś momencie się zgubisz, przejrzyj [listę źródeł wsparcia od społeczności](/community/support.html). Zwłaszcza [Reactiflux Chat](https://discord.gg/0ZcbPKXt5bZjGY5n) jest znany z szybkiego udzielania pomocy. Jeśli mimo wszystko nie otrzymasz odpowiedzi lub nadal masz z czymś problem, zgłoś nam to, a spróbujemy Ci jakoś pomóc.
123+
Jeśli w którymś momencie się zgubisz, przejrzyj [listę źródeł wsparcia od społeczności](/community/support.html). Zwłaszcza [Reactiflux Chat](https://discord.gg/0ZcbPKXt5bZjGY5n) jest znany z szybkiego udzielania pomocy. Jeśli mimo wszystko nie otrzymasz odpowiedzi lub nadal masz z czymś problem, zgłoś nam to, a spróbujemy ci jakoś pomóc.
124124

125125
## Przegląd {#overview}
126126

@@ -166,7 +166,7 @@ return React.createElement('div', {className: 'shopping-list'},
166166

167167
[Zobacz pełną wersję kodu](babel://tutorial-expanded-version)
168168

169-
Jeśli ciekawość nie daje Ci spokoju, opis funkcji `createElement()` znajdziesz w [dokumentacji API](/docs/react-api.html#createelement), aczkolwiek w tym samouczku nie będziemy jej używać. Zamiast tego skorzystamy ze składni JSX.
169+
Jeśli ciekawość nie daje ci spokoju, opis funkcji `createElement()` znajdziesz w [dokumentacji API](/docs/react-api.html#createelement), aczkolwiek w tym samouczku nie będziemy jej używać. Zamiast tego skorzystamy ze składni JSX.
170170

171171
Składnia JSX ma pełną moc JavaScriptu. Między klamry można wstawić *dowolny* kod javascriptowy. Każdy element reactowy jest obiektem, który można przypisać do zmiennej i przekazywać dowolnie w swoim programie.
172172

@@ -223,7 +223,7 @@ Po zmianie: W każdym wyrenderowanym polu powinien wyświetlać się kolejny num
223223

224224
**[Zobacz dotychczasowy kod](https://codepen.io/gaearon/pen/aWWQOG?editors=0010)**
225225

226-
Gratulacje! Właśnie udało Ci się "przekazać atrybut" z komponentu nadrzędnego `Board` do komponentu potomnego `Square`. Przekazywanie atrybutów to jeden ze sposobów na przepływ danych między rodzicem a komponentem potomnym w drzewie.
226+
Gratulacje! Właśnie udało ci się "przekazać atrybut" z komponentu nadrzędnego `Board` do komponentu potomnego `Square`. Przekazywanie atrybutów to jeden ze sposobów na przepływ danych między rodzicem a komponentem potomnym w drzewie.
227227

228228
### Tworzenie interaktywnego komponentu {#making-an-interactive-component}
229229

@@ -352,7 +352,7 @@ Zbudowaliśmy solidne fundamenty pod grę w "kółko i krzyżyk". Zostało nam j
352352

353353
W obecnej wersji aplikacji każdy z komponentów `Square` decyduje o własnym stanie. Jednak do rozstrzygnięcia gry potrzebny nam będzie jeden wspólny stan, przechowujący wartości dla wszystkich 9 pól na planszy.
354354

355-
Być może przeszło Ci przez myśl, że to komponent `Board` powinien "pytać" każdy z komponentów `Square` o jego stan. Nawet jeśli jest to możliwe w Reakcie, odradzamy takiego podejścia, ponieważ kod stanie się wtedy bardziej zagmatwany, podatny na błędy i trudny w utrzymaniu. Zamiast tego należy przenieść stan całej planszy do komponentu nadrzędnego - `Board`. Komponent ten, poprzez atrybuty, będzie mówił każdemu z komponentów `Square`, co mają wyrenderować - podobnie jak w jednym z poprzednich podrozdziałów, gdzie [przekazywaliśmy kolejne numery do komponentów `Square`](#passing-data-through-props).
355+
Być może przeszło ci przez myśl, że to komponent `Board` powinien "pytać" każdy z komponentów `Square` o jego stan. Nawet jeśli jest to możliwe w Reakcie, odradzamy takiego podejścia, ponieważ kod stanie się wtedy bardziej zagmatwany, podatny na błędy i trudny w utrzymaniu. Zamiast tego należy przenieść stan całej planszy do komponentu nadrzędnego - `Board`. Komponent ten, poprzez atrybuty, będzie mówił każdemu z komponentów `Square`, co mają wyrenderować - podobnie jak w jednym z poprzednich podrozdziałów, gdzie [przekazywaliśmy kolejne numery do komponentów `Square`](#passing-data-through-props).
356356

357357
**Aby móc zebrać dane z wielu komponentów potomnych lub umożliwić dwóm potomkom komunikowanie się ze sobą, należy zadeklarować ich wspólny stan w rodzicu. Taki rodzic może wtedy przekazać poszczególne wartości potomkom poprzez atrybuty; dzięki temu potomkowie będą zsynchronizowani zarówno ze sobą nawzajem, jak i z rodzicem.**
358358

@@ -1105,7 +1105,7 @@ Gdy lista jest ponownie renderowana, React odczytuje wartość klucza każdego z
11051105

11061106
**Zalecamy przypisywanie odpowiednich kluczy do każdej tworzonej listy dynamicznej**. Jeśli nie masz do dyspozycji wartości, która nadawałaby się na klucz, zastanów się, czy nie możesz lepiej ustrukturyzować danych.
11071107

1108-
Jeśli nie podasz klucza, React wyświetli ostrzeżenie w konsoli i domyślnie użyje indeksu elementu. Używanie indeksu jako klucza może przysporzyć Ci kłopotów, gdy zechcesz zmienić kolejność lub dodać/usunąć elementy do listy. Jawne przekazanie `key={i}` "uciszy" ostrzeżenie, jednak problem nadal będzie występował. Takie podejście nie jest zalecane w większości przypadków.
1108+
Jeśli nie podasz klucza, React wyświetli ostrzeżenie w konsoli i domyślnie użyje indeksu elementu. Używanie indeksu jako klucza może przysporzyć ci kłopotów, gdy zechcesz zmienić kolejność lub dodać/usunąć elementy do listy. Jawne przekazanie `key={i}` "uciszy" ostrzeżenie, jednak problem nadal będzie występował. Takie podejście nie jest zalecane w większości przypadków.
11091109

11101110
Klucze nie muszą być unikalne globalnie; wystarczy, że będą unikalne w ramach danej listy.
11111111

@@ -1209,7 +1209,7 @@ Teraz jeśli klikniemy na którymkolwiek elemencie listy ruchów, plansza powinn
12091209

12101210
### Podsumowanie {#wrapping-up}
12111211

1212-
Gratulacje! Udało Ci się stworzyć grę w "kółko i krzyżyk", która:
1212+
Gratulacje! Udało ci się stworzyć grę w "kółko i krzyżyk", która:
12131213

12141214
* umożliwia granie w "kółko i krzyżyk",
12151215
* informuje, gdy któryś z graczy wygra,
@@ -1220,7 +1220,7 @@ Dobra robota! Mamy nadzieję, że czujesz już większą swobodę w pisaniu apli
12201220

12211221
Sprawdź, jak na koniec powinien wyglądać kod: **[Efekt końcowy](https://codepen.io/gaearon/pen/gWWZgR?editors=0010)**.
12221222

1223-
Jeśli masz jeszcze trochę wolnego czasu i chcesz poćwiczyć Reacta, mamy dla Ciebie kilka pomysłów na udoskonalenia gry w "kółko i krzyżyk" (w kolejności od najłatwiejszego do najtrudniejszego):
1223+
Jeśli masz jeszcze trochę wolnego czasu i chcesz poćwiczyć Reacta, mamy dla ciebie kilka pomysłów na udoskonalenia gry w "kółko i krzyżyk" (w kolejności od najłatwiejszego do najtrudniejszego):
12241224

12251225
1. Wyświetl w historii współrzędne dla każdego z ruchów w formacie (kolumna, wiersz).
12261226
2. Zastosuj pogrubienie na aktualnie wyświetlanym elemencie listy ruchów.

0 commit comments

Comments
 (0)