From 9eed96c8df67f5fa715b0195452d77fd3ff24fe6 Mon Sep 17 00:00:00 2001 From: Piotr Szymanski Date: Tue, 19 Feb 2019 13:19:55 +0400 Subject: [PATCH 01/96] First translation --- content/docs/add-react-to-a-website.md | 151 +++++++++++++------------ 1 file changed, 76 insertions(+), 75 deletions(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 11b99d37a..57428100a 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -1,6 +1,6 @@ --- id: add-react-to-a-website -title: Add React to a Website +title: Dodaj Reacta do swojej strony permalink: docs/add-react-to-a-website.html redirect_from: - "docs/add-react-to-an-existing-app.html" @@ -8,127 +8,128 @@ prev: getting-started.html next: create-a-new-react-app.html --- -Use as little or as much React as you need. +Użyj tak mało lub tak dużo Reacta ile potrzebujesz. -React has been designed from the start for gradual adoption, and **you can use as little or as much React as you need**. Perhaps you only want to add some "sprinkles of interactivity" to an existing page. React components are a great way to do that. +React od poczatku został zaprojektowany z myślą o stopniowej adopcji, **możesz użyć tak mało lub tak dużo Reacta na ile go potrzebujesz**. Być może, jedyne co chcesz to dodać trochę interaktywności do istniejacej strony. Komponenty React sa świetne do zrobienia tego. -The majority of websites aren't, and don't need to be, single-page apps. With **a few lines of code and no build tooling**, try React in a small part of your website. You can then either gradually expand its presence, or keep it contained to a few dynamic widgets. +Wiekszość stron internetowych nie jest i nie musi być aplikacjami jedno stronowymi. Z **kilkoma liniami kodu i bez narzędzi kompilacji**, wypróbuj React w małej cześci Twojej strony. Następnie możesz stopniowo zwiekszać jego wykorzystanie, lub przechowywać w kilku dynamicznych widżetach. --- -- [Add React in One Minute](#add-react-in-one-minute) -- [Optional: Try React with JSX](#optional-try-react-with-jsx) (no bundler necessary!) +- [Dodaj React w minute](#add-react-in-one-minute) +- [Opcjonalnie: Wypróbuj React z JSX](#optional-try-react-with-jsx) (bundler nie jest wymagany!) -## Add React in One Minute {#add-react-in-one-minute} +## Dodaj React w minute {#add-react-in-one-minute} -In this section, we will show how to add a React component to an existing HTML page. You can follow along with your own website, or create an empty HTML file to practice. +W tej sekcji pokażemy jak dodać komponent Reakta do strony internetowej. Możesz to zrobić korzystajac z własnej strony internetowej lub stwórz nową pusta strone. -There will be no complicated tools or install requirements -- **to complete this section, you only need an internet connection, and a minute of your time.** +Nie będziemy korzystali z żadnych skomplikowanych narzędzi lub wymagań instalacyjnych -- **aby ukończyć tą sekcje, jedyne czego potrzebujesz to połączenie internetowe i minuta wolnego czasu.** -Optional: [Download the full example (2KB zipped)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip) +Opcjonalnie: [Pobierz cały przykład (2KB zipped)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip) -### Step 1: Add a DOM Container to the HTML {#step-1-add-a-dom-container-to-the-html} +### Krok 1: Dodaj kontener do HTML {#step-1-add-a-dom-container-to-the-html} -First, open the HTML page you want to edit. Add an empty `
` tag to mark the spot where you want to display something with React. For example: +Najpierw otwórz strone internetowa która chcesz edytować. Dodaj pusty znacznik `
` aby zaznaczyć miejsce w którym chcesz wyświetlić coś za pomocą przycisku React. Na przykład: ```html{3} - +
- + ``` -We gave this `
` a unique `id` HTML attribute. This will allow us to find it from the JavaScript code later and display a React component inside of it. +Przypisaliśmy temu znacznikowi `
` unikalny atrybut `id`. Pozwoli nam to na późniejsze odnalezienie kodu korzystając z JavaScript oraz wyświetlenie w nim komponentu React. ->Tip + +>Wskazówka > ->You can place a "container" `
` like this **anywhere** inside the `` tag. You may have as many independent DOM containers on one page as you need. They are usually empty -- React will replace any existing content inside DOM containers. +>Możesz umieścić "kontener" `
` **w dowolnym miejscu** wewnątrz znacznika ``. Możesz mieć tyle niezależnych kontenerów na jednej stronie, ile potrzebujesz. Zazwyczaj sa one puste -- React zastąpi istniejącą zawartość w kontenerze. -### Step 2: Add the Script Tags {#step-2-add-the-script-tags} +### Krok 2: Dodaj znacznik script {#step-2-add-the-script-tags} -Next, add three ` - + ``` -The first two tags load React. The third one will load your component code. +Pierwsze dwa znaczniki wczytują React. Trzeci załaduje kod Twojego komponentu. -### Step 3: Create a React Component {#step-3-create-a-react-component} +### Krok 3: Stwórz komponent React {#step-3-create-a-react-component} -Create a file called `like_button.js` next to your HTML page. +Stwórz plik `like_button.js` w folderze swojej strony. -Open **[this starter code](https://cdn.rawgit.com/gaearon/0b180827c190fe4fd98b4c7f570ea4a8/raw/b9157ce933c79a4559d2aa9ff3372668cce48de7/LikeButton.js)** and paste it into the file you created. +Otwórz **[przyładowy kod](https://cdn.rawgit.com/gaearon/0b180827c190fe4fd98b4c7f570ea4a8/raw/b9157ce933c79a4559d2aa9ff3372668cce48de7/LikeButton.js)** i wklej jego zawartość do pliku który stworzyłeś. ->Tip +>Wskazówka > ->This code defines a React component called `LikeButton`. Don't worry if you don't understand it yet -- we'll cover the building blocks of React later in our [hands-on tutorial](/tutorial/tutorial.html) and [main concepts guide](/docs/hello-world.html). For now, let's just get it showing on the screen! +>Ten kod definiuje komponent Reakta nazwany `LikeButton`. Nie przejmuj sie jeżeli jeszcze tego nie rozumiesz -- wyjaśnimy bloki konstrukcyjne React później w naszym [praktycznym tutorialu](/tutorial/tutorial.html) i [w głównych koncepcjach](/docs/hello-world.html). Na razie pokażmy to na ekranie! -After **[the starter code](https://cdn.rawgit.com/gaearon/0b180827c190fe4fd98b4c7f570ea4a8/raw/b9157ce933c79a4559d2aa9ff3372668cce48de7/LikeButton.js)**, add two lines to the bottom of `like_button.js`: +Po **[przyładowym kodzie](https://cdn.rawgit.com/gaearon/0b180827c190fe4fd98b4c7f570ea4a8/raw/b9157ce933c79a4559d2aa9ff3372668cce48de7/LikeButton.js)**, dodaj dwie linijki na na końcu `like_button.js`: ```js{3,4} -// ... the starter code you pasted ... +// ... przykładowy kod który wkleiłeś ... const domContainer = document.querySelector('#like_button_container'); ReactDOM.render(e(LikeButton), domContainer); ``` -These two lines of code find the `
` we added to our HTML in the first step, and then display our "Like" button React component inside of it. +Te dwie linijki kodu znajda znacznik `
` który dodaliśmy do naszego kodu HTML w pierwszym kroku, i wyświetla nasz przycisk "Like" jako komponent React. -### That's It! {#thats-it} +### To wszystko! {#thats-it} -There is no step four. **You have just added the first React component to your website.** +Nie ma kroku czwartego. **Własnie dodałeś pierwszy komponent Reacta do swojej strony.** -Check out the next sections for more tips on integrating React. +Zapoznaj się z następnymi sekcjami aby uzyskać więcej podpowiedzi na temat integracji w React. -**[View the full example source code](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605)** +**[Zobacz przykładowy kod źródłowy](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605)** -**[Download the full example (2KB zipped)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)** +**[Pobierz cały przykład (2KB zipped)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)** -### Tip: Reuse a Component {#tip-reuse-a-component} +### Wskazówka: Wykorzystaj komponent ponownie {#tip-reuse-a-component} -Commonly, you might want to display React components in multiple places on the HTML page. Here is an example that displays the "Like" button three times and passes some data to it: +Często możesz chcieć wyświetlić komponent Reacta w wielu miejscach na stronie. Oto przykład który trzykrotnie wyświetla przycisk "Like" i przekazuje do niego dane: -[View the full example source code](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda) +[Zobacz przykładowy kod źródłowy](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda) -[Download the full example (2KB zipped)](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda/archive/9d0dd0ee941fea05fd1357502e5aa348abb84c12.zip) +[Pobierz cały przykład (2KB zipped)](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda/archive/9d0dd0ee941fea05fd1357502e5aa348abb84c12.zip) ->Note +>Wskazówka > ->This strategy is mostly useful while React-powered parts of the page are isolated from each other. Inside React code, it's easier to use [component composition](/docs/components-and-props.html#composing-components) instead. +>Ta strategia jest szczegoólnie przydatna gdy części strony oparte na Reackcie sa od siebie odizolowane. Wewnatrz kodu React, łatwiej jest korzystać z [kompozycji komponentow](/docs/components-and-props.html#composing-components). -### Tip: Minify JavaScript for Production {#tip-minify-javascript-for-production} +### Wskazówka: Minifikuj JavaScript dla środowiska produkcyjnego {#tip-minify-javascript-for-production} -Before deploying your website to production, be mindful that unminifed JavaScript can significantly slow down the page for your users. +Przed wdrozeniem strony na środowisko produkcyjne, pamiętaj że nie zminifikowany kod JavaScript może znacznie spowolnić działanie Twojej strony. -If you already minify the application scripts, **your site will be production-ready** if you ensure that the deployed HTML loads the versions of React ending in `production.min.js`: +Jeżeli już zminifikowałeś skrypty aplikacji, **Twoja strona internetowa będzie gotowa dla środowiska produkcyjnego** jeżeli wdrożony kod ładuje wersje Reacta zakonczoną `production.min.js`: ```js ``` -If you don't have a minification step for your scripts, [here's one way to set it up](https://gist.github.com/gaearon/42a2ffa41b8319948f9be4076286e1f3). +Jeżeli nie wykonujesz minifikacji dla swoich skryptow, [oto jeden ze sposobów aby to zrobić](https://gist.github.com/gaearon/42a2ffa41b8319948f9be4076286e1f3). -## Optional: Try React with JSX {#optional-try-react-with-jsx} +## Opcjonalnie: Wypróbuj React z JSX {#optional-try-react-with-jsx} -In the examples above, we only relied on features that are natively supported by the browsers. This is why we used a JavaScript function call to tell React what to display: +W przykładach powyżej opieramy się tylko na funkcjach które są natywnie obsługiwane przez przeglądarki. Dlatego wywołaliśmy funkcję JavaScript, aby powiedzieć Reactowi, co wyświetlić: ```js const e = React.createElement; -// Display a "Like" + ); -``` +''' -Te dwa fragmenty kodu sa rownoważne. Ponieważ **JSX jest [całkowicie opcjonalny](/docs/react-without-jsx.html)**, wiele osób uważa że jest to pomocne przy pisaniu kodu UI -- zarówno z React jak i z innymi bibliotekami. +Te dwa fragmenty kodu są równoważne. Ponieważ **JSX jest [całkowicie opcjonalny](/docs/react-without-jsx.html)**, wiele osób uważa, że jest to pomocne przy pisaniu kodu UI -- zarówno z React, jak i z innymi bibliotekami. Możesz wypróbować JSX korzystając z [tego konwertera online](http://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=). ### Szybko wypróbuj JSX {#quickly-try-jsx} -Najszybszym sposobem na wyprobowanie JSX w Twoim projekcie jest doddanie znacznika ` -``` +''' -Teraz możesz użyć JSX w dowolnym znaczniku ` From d34848c67c28dfeeef62d483a540d83ef81dcf58 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:45:43 +0400 Subject: [PATCH 16/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index cc8916d06..dd87f4f82 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -58,7 +58,7 @@ Następnie dodaj trzy znaczniki ` - + From 12b776b66535f4623ccc47dad3b54bf1c6571439 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:56:13 +0400 Subject: [PATCH 17/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index dd87f4f82..79eecc889 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -17,7 +17,7 @@ Większość stron internetowych nie jest i nie musi być aplikacjami jednostro --- - [Dodaj Reacta w minutę](#add-react-in-one-minute) -- [Opcjonalnie: Wypróbuj React z JSX](#optional-try-react-with-jsx) (bundler nie jest wymagany!) +- [Opcjonalnie: Wypróbuj Reacta z JSX](#optional-try-react-with-jsx) (bundler nie jest wymagany!) ## Dodaj Reacta w minutę {#add-react-in-one-minute} From 3d0bb7905aa62974dc1bb5e7235b877b5888c69b Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:56:46 +0400 Subject: [PATCH 18/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 79eecc889..7a6d87c5b 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -54,7 +54,7 @@ Następnie dodaj trzy znaczniki ` From eadd8f342bb38f326b54fc75e6ba50bf16d04d6b Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:57:12 +0400 Subject: [PATCH 19/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 7a6d87c5b..f318bde9d 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -21,7 +21,7 @@ Większość stron internetowych nie jest i nie musi być aplikacjami jednostro ## Dodaj Reacta w minutę {#add-react-in-one-minute} -W tej sekcji pokażemy jak dodać komponent Reakta do strony internetowej. Możesz to zrobić korzystając z własnej strony internetowej lub stwórz nową pustą stronę. +W tej sekcji pokażemy, jak dodać komponent reactowy do strony internetowej. Możesz to zrobić korzystając z własnej strony internetowej lub stworzyć nowy plik HTML. Nie będziemy instalowali żadnych zależności ani korzystali ze skomplikowanych narzędzi -- **aby ukończyć ten rozdział, będziesz potrzebować jedynie połączenia internetowego i minuty wolnego czasu.** From eff7fc5bb0395e665a7fee7243debfd4680b4bd4 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:58:02 +0400 Subject: [PATCH 20/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index f318bde9d..e930f975b 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -194,7 +194,7 @@ npx babel --watch src --out-dir . --presets react-app/prod > >Jeśli zobaczysz komunikat o błędzie "Błędnie zainstalowałeś pakiet 'babel'", mogłeś pominąć [poprzedni krok](#add-jsx-to-a-project). Wykonaj go w tym samym folderze, i spróbuj ponownie. -Nie czekaj na jego zakończenie -- to polecenie uruchamia automatyczne śledzenie dla JSX. +Nie czekaj na jego zakończenie -- to polecenie uruchamia skrypt automatycznie śledzący zmiany w kodzie ze składnią JSX. Jeśli utworzysz teraz plik o nazwie 'src/like_button.js' wraz z **[przykładowym kodem JSX](https://cdn.rawgit.com/gaearon/c8e112dc74ac44aac4f673f2c39d19d1/raw/09b951c86c1bf1116af741fa4664511f2f179f0a/like_button.js)**, obserwator utworzy przeprocesowany plik 'like_button.js' z kodem JavaScript odpowiednim dla przeglądarki. Gdy edytujesz plik źródłowy, korzystając z JSX, transformacja zostanie ponownie automatycznie uruchomiona. From a7b4095f59861782f49aac30e14db61205323fab Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:58:36 +0400 Subject: [PATCH 21/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index e930f975b..d4e541bcf 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -190,7 +190,7 @@ npx babel --watch src --out-dir . --presets react-app/prod >Notatka > ->'npx' nie jest literówka -- jest to [narzędzie do uruchamiania pakietów dostępne w npm 5.2+](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b). +>`npx` to nie literówka -- jest to [narzędzie do uruchamiania pakietów, dostępne w npm 5.2+](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b). > >Jeśli zobaczysz komunikat o błędzie "Błędnie zainstalowałeś pakiet 'babel'", mogłeś pominąć [poprzedni krok](#add-jsx-to-a-project). Wykonaj go w tym samym folderze, i spróbuj ponownie. From 7422c553d958085def4e929dc71019d3e9dd7786 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 14:59:40 +0400 Subject: [PATCH 22/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index d4e541bcf..2bb9b2343 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -200,4 +200,4 @@ Jeśli utworzysz teraz plik o nazwie 'src/like_button.js' wraz z **[przykładowy Dodatkowo umożliwi to również korzystanie z nowych składni JavaScript, takich jak klasy, bez obawy o brak kompatybilności ze starszymi przeglądarkami. Narzędzie, które właśnie użyliśmy, nazywa się Babel, i możesz dowiedzieć się więcej na jego temat z [dokumentacji](http://babeljs.io/docs/en/babel-cli/). -Jeśli zauważyłeś, że czujesz się komfortowo z narzędziami do kompilacji i chcesz by robiły dla Ciebie więcej, [następna sekcja](/docs/create-a-new-react-app.html) opisuje niektóre z najbardziej popularnych i przystępnych narzędzi. Jeżeli nie -- znaczniki script będą wystarczające. +Jeśli uważasz, że czujesz się już komfortowo z narzędziami do kompilacji i chcesz, by robiły za ciebie więcej, zajrzyj do [następnego rozdziału](/docs/create-a-new-react-app.html), w którym opisaliśmy niektóre z najbardziej popularnych i przystępnych narzędzi. Jeżeli nie -- cóż, znaczniki `script` też wystarczą! From 5292fee399436db7cff8d744ff079d140b9fc81b Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Tue, 26 Feb 2019 15:00:53 +0400 Subject: [PATCH 23/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 2bb9b2343..0f00a1313 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -64,7 +64,7 @@ Następnie dodaj trzy znaczniki ` ''' -Teraz możesz użyć JSX w dowolnym znaczniku ' -''' Pierwsze dwa znaczniki wczytają Reacta. Trzeci załaduje kod twojego komponentu. From d485751fcb1db2654bdbcfa6a9fc95063327e1ed Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:20:30 +0400 Subject: [PATCH 51/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index dc1ee916f..f9714d1b2 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -101,7 +101,7 @@ Często zdarza się, że komponent trzeba wyświetlić na stronie kilka razy. Ot [Zobacz przykładowy kod źródłowy](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda) -[Pobierz cały przykład (2KB zipped)](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda/archive/9d0dd0ee941fea05fd1357502e5aa348abb84c12.zip) +[Pobierz cały przykład (2KB po kompresji)](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda/archive/9d0dd0ee941fea05fd1357502e5aa348abb84c12.zip) >Wskazówka > From c183e1b9005ee55cd3588b13aeca8538651f6629 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:20:59 +0400 Subject: [PATCH 52/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index f9714d1b2..3aa72fde3 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -105,7 +105,7 @@ Często zdarza się, że komponent trzeba wyświetlić na stronie kilka razy. Ot >Wskazówka > ->Ta strategia jest szczegoólnie przydatna gdy części strony oparte na Reackcie sa od siebie odizolowane. Wewnatrz kodu React, łatwiej jest korzystać z [kompozycji komponentow](/docs/components-and-props.html#composing-components). +>Ta strategia jest szczególnie przydatna, gdy części strony oparte na Reakcie są od siebie odizolowane. W kodzie reactowym łatwiej jest zamiast tego korzystać z [kompozycji komponentów](/docs/components-and-props.html#composing-components). ### Wskazówka: Minifikuj JavaScript dla środowiska produkcyjnego {#tip-minify-javascript-for-production} From c71edfd22f808d508482e9e7a0e3f2d9abf4ba97 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:21:29 +0400 Subject: [PATCH 53/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 3aa72fde3..7e53801b0 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -109,7 +109,7 @@ Często zdarza się, że komponent trzeba wyświetlić na stronie kilka razy. Ot ### Wskazówka: Minifikuj JavaScript dla środowiska produkcyjnego {#tip-minify-javascript-for-production} -Przed wdrozeniem strony na środowisko produkcyjne, pamiętaj że nie zminifikowany kod JavaScript może znacznie spowolnić działanie Twojej strony. +Przed wdrożeniem strony na środowisko produkcyjne, pamiętaj, że niezminifikowany kod javascriptowy może znacznie spowolnić działanie twojej strony. Jeżeli już zminifikowałeś skrypty aplikacji, **Twoja strona internetowa będzie gotowa dla środowiska produkcyjnego** jeżeli wdrożony kod ładuje wersje Reacta zakonczoną `production.min.js`: From 0e682300022bc67a5bcb628bbf186b111d1ff9e2 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:23:02 +0400 Subject: [PATCH 54/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 7e53801b0..efa04e8fe 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -122,7 +122,7 @@ Jeżeli nie wykonujesz minifikacji dla swoich skryptow, [oto jeden ze sposobów ## Opcjonalnie: Wypróbuj Reacta z JSX {#optional-try-react-with-jsx} -W przykładach powyżej opieramy się tylko na funkcjach, które są natywnie obsługiwane przez przeglądarki. Dlatego wywołaliśmy funkcję JavaScript, aby powiedzieć Reactowi, co wyświetlić: +W przykładach powyżej opieramy się tylko na funkcjonalnościach, które są natywnie obsługiwane przez przeglądarki. Dlatego wywołaliśmy funkcję javascriptową, aby poinformować Reacta, co ma wyświetlić: '''js const e = React.createElement; From f0116a478421e012dddcd876a9f587c5c61f58a8 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:23:28 +0400 Subject: [PATCH 55/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index efa04e8fe..e94f8a5c9 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -111,7 +111,7 @@ Często zdarza się, że komponent trzeba wyświetlić na stronie kilka razy. Ot Przed wdrożeniem strony na środowisko produkcyjne, pamiętaj, że niezminifikowany kod javascriptowy może znacznie spowolnić działanie twojej strony. -Jeżeli już zminifikowałeś skrypty aplikacji, **Twoja strona internetowa będzie gotowa dla środowiska produkcyjnego** jeżeli wdrożony kod ładuje wersje Reacta zakonczoną `production.min.js`: +Jeśli twoje skrypty są już zminifikowane, **aplikacja będzie gotowa dla środowiska produkcyjnego**, jeżeli wdrożony kod będzie ładował wersję Reacta zakończoną `production.min.js`: ```js From ecf876660eeb195eaf77de15bd048db11ac6224a Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:24:18 +0400 Subject: [PATCH 56/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index e94f8a5c9..854b96735 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -118,7 +118,7 @@ Jeśli twoje skrypty są już zminifikowane, **aplikacja będzie gotowa dla śro ``` -Jeżeli nie wykonujesz minifikacji dla swoich skryptow, [oto jeden ze sposobów aby to zrobić](https://gist.github.com/gaearon/42a2ffa41b8319948f9be4076286e1f3). +Jeżeli nie masz jeszcze skonfigurowanej minifikacji skryotów, [oto jeden ze sposobów, aby to zrobić](https://gist.github.com/gaearon/42a2ffa41b8319948f9be4076286e1f3). ## Opcjonalnie: Wypróbuj Reacta z JSX {#optional-try-react-with-jsx} From 8dc77eeea65fe16146f0dc60cd7ecb673738d78f Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:24:34 +0400 Subject: [PATCH 57/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 854b96735..aac32bbcc 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -124,7 +124,7 @@ Jeżeli nie masz jeszcze skonfigurowanej minifikacji skryotów, [oto jeden ze sp W przykładach powyżej opieramy się tylko na funkcjonalnościach, które są natywnie obsługiwane przez przeglądarki. Dlatego wywołaliśmy funkcję javascriptową, aby poinformować Reacta, co ma wyświetlić: -'''js +```js const e = React.createElement; // Wyświetl "Like" ); From 4d28d2d69dc0d90951f4dd8d93c2b0204fda0303 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:30:14 +0400 Subject: [PATCH 68/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 3d33fd344..3dc6afddd 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -139,7 +139,7 @@ Niemniej React oferuje również możliwość użycia składni [JSX](/docs/intro // Wyświetla przycisk "Lubię to!" return ( ); ''' From dfed54c967155cded0a2cd13924ca71ef9d16e33 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:30:31 +0400 Subject: [PATCH 69/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 3dc6afddd..0b418564b 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -140,7 +140,7 @@ Niemniej React oferuje również możliwość użycia składni [JSX](/docs/intro return ( + ); ''' From 914c9d34481b124f7b3153d5aca438c5d941ad46 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:32:02 +0400 Subject: [PATCH 70/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 1 - 1 file changed, 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 0b418564b..0bd06d12c 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -142,7 +142,6 @@ return ( Lubię to! ); -''' Te dwa fragmenty kodu są równoważne. Ponieważ **JSX jest [całkowicie opcjonalny](/docs/react-without-jsx.html)**, wiele osób uważa, że jest to pomocne przy pisaniu kodu UI -- zarówno z React, jak i z innymi bibliotekami. From 1ff4e0028e4bfa1140f46f8f2f796b583820bd08 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:32:34 +0400 Subject: [PATCH 71/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 0bd06d12c..0075556c8 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -143,7 +143,7 @@ Lubię to! ); -Te dwa fragmenty kodu są równoważne. Ponieważ **JSX jest [całkowicie opcjonalny](/docs/react-without-jsx.html)**, wiele osób uważa, że jest to pomocne przy pisaniu kodu UI -- zarówno z React, jak i z innymi bibliotekami. +Te dwa fragmenty kodu są równoważne. Mimo iż **składnia JSX jest [całkowicie opcjonalna](/docs/react-without-jsx.html)**, wiele osób uważa, że jest pomocna przy pisaniu kodu dla UI -- zarówno w Reakcie, jak i z innymi bibliotekami. Możesz wypróbować JSX korzystając z [tego konwertera online](http://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=). From df3a8cb261a66e1d4c2ed9285fe36efee7988210 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:32:52 +0400 Subject: [PATCH 72/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 0075556c8..49d3742e5 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -145,7 +145,7 @@ Lubię to! Te dwa fragmenty kodu są równoważne. Mimo iż **składnia JSX jest [całkowicie opcjonalna](/docs/react-without-jsx.html)**, wiele osób uważa, że jest pomocna przy pisaniu kodu dla UI -- zarówno w Reakcie, jak i z innymi bibliotekami. -Możesz wypróbować JSX korzystając z [tego konwertera online](http://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=). +Możesz wypróbować składnię JSX korzystając z [tego konwertera online](http://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=). ### Szybko wypróbuj JSX {#quickly-try-jsx} From 4d8df6203a4b462d16936b7dd90d71714a13f6e7 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:33:10 +0400 Subject: [PATCH 73/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 49d3742e5..2877d772d 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -147,7 +147,7 @@ Te dwa fragmenty kodu są równoważne. Mimo iż **składnia JSX jest [całkowic Możesz wypróbować składnię JSX korzystając z [tego konwertera online](http://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=). -### Szybko wypróbuj JSX {#quickly-try-jsx} +### Szybki test składni JSX {#quickly-try-jsx} Najszybszym sposobem na wyprobowanie JSX w Twoim projekcie jest dodanie znacznika ' From 7988db9a0b30effe2fff31035a6c7ae7ed1af015 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:33:50 +0400 Subject: [PATCH 75/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index aec023ff3..125a3dd1d 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -151,7 +151,7 @@ Możesz wypróbować składnię JSX korzystając z [tego konwertera online](http Najszybszym sposobem na wypróbowanie składni JSX w projekcie jest dodanie następującego znacznika ` ''' From 47c3128a1a6498c02a718b3bef411b3ea0690d56 Mon Sep 17 00:00:00 2001 From: jakubdrozdek <30927218+jakubdrozdek@users.noreply.github.com> Date: Wed, 27 Feb 2019 18:34:04 +0400 Subject: [PATCH 76/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 1 - 1 file changed, 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 125a3dd1d..95bf4734e 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -153,7 +153,6 @@ Najszybszym sposobem na wypróbowanie składni JSX w projekcie jest dodanie nast ```html -''' Od teraz możesz używać składni JSX wewnątrz dowolnego znacznika ` +``` Pierwsze dwa znaczniki wczytają Reacta. Trzeci załaduje kod twojego komponentu. @@ -81,6 +83,7 @@ Pod kodem z **[szablonu startowego](https://cdn.rawgit.com/gaearon/0b180827c190f const domContainer = document.querySelector('#like_button_container'); ReactDOM.render(e(LikeButton), domContainer); +``` Te dwie linijki kodu są odpowiedzialne za znalezienie naszego elementu `
` z pierwszego kroku i wyświetlenie przycisku `"Like"` pochodzącego z wklejonego komponentu. @@ -132,6 +135,7 @@ return e( { onClick: () => this.setState({ liked: true }) }, 'Lubię to!' ); +``` Niemniej React oferuje również możliwość użycia składni [JSX](/docs/introducing-jsx.html): @@ -142,6 +146,7 @@ return ( Lubię to! ); +``` Te dwa fragmenty kodu są równoważne. Mimo iż **składnia JSX jest [całkowicie opcjonalna](/docs/react-without-jsx.html)**, wiele osób uważa, że jest pomocna przy pisaniu kodu dla UI -- zarówno w Reakcie, jak i z innymi bibliotekami. @@ -153,6 +158,7 @@ Najszybszym sposobem na wypróbowanie składni JSX w projekcie jest dodanie nast ```html +``` Od teraz możesz używać składni JSX wewnątrz dowolnego znacznika ` From 645081a2783e0e7d91d9609a1c9d3b00f9d68ee6 Mon Sep 17 00:00:00 2001 From: Marcin Ostrouch <39092009+marcinostrouch@users.noreply.github.com> Date: Thu, 28 Feb 2019 15:49:18 +0400 Subject: [PATCH 88/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 713750063..8cbd2d149 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -177,7 +177,7 @@ Przejdź do folderu projektu i wywołaj dwie komendy: > >**Korzystamy tu z `npm` tylko do instalacji preprocesora JSX**; nie będzie on potrzebny do niczego innego. Zarówno React, jak i kod aplikacji mogą pozostać bez zmian w znacznikach ` From 253e9d6196eacfd7de73e0d88ceed8c2d37104eb Mon Sep 17 00:00:00 2001 From: Marcin Ostrouch <39092009+marcinostrouch@users.noreply.github.com> Date: Thu, 28 Feb 2019 19:18:47 +0400 Subject: [PATCH 95/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index 501ac25b4..a61e94ea5 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -74,7 +74,7 @@ Otwórz **[szablon startowy](https://cdn.rawgit.com/gaearon/0b180827c190fe4fd98b >Wskazówka > ->Kod ten definiuje komponent reactowy o nazwie `LikeButton`. Nie przejmuj się, jeżeli jeszcze go nie rozumiesz -- podstawy Reacta wyjaśnimy później w naszym [praktycznym samouczku](/tutorial/tutorial.html) i [w rozdziale pt. "Główne idee"](/docs/hello-world.html). Na razie jednak skupmy się na wyświetleniu tego na ekranie! +>Kod ten definiuje komponent reactowy o nazwie `LikeButton`. Nie przejmuj się, jeśli jeszcze czegoś nie rozumiesz na tym etapie -- podstawy Reacta wyjaśnimy później w naszym [praktycznym samouczku](/tutorial/tutorial.html) i [w rozdziale pt. "Główne idee"](/docs/hello-world.html). Na razie jednak skupmy się na wyświetleniu tego na ekranie! Pod kodem z **[szablonu startowego](https://cdn.rawgit.com/gaearon/0b180827c190fe4fd98b4c7f570ea4a8/raw/b9157ce933c79a4559d2aa9ff3372668cce48de7/LikeButton.js)** w pliku `like_button.js` dodaj dwie linijki: From b202494c0ad9af9101665b27bf35a0f3df3ffedd Mon Sep 17 00:00:00 2001 From: Marcin Ostrouch <39092009+marcinostrouch@users.noreply.github.com> Date: Thu, 28 Feb 2019 19:19:13 +0400 Subject: [PATCH 96/96] Update content/docs/add-react-to-a-website.md Co-Authored-By: cvqprs --- content/docs/add-react-to-a-website.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index a61e94ea5..625245bee 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -97,7 +97,7 @@ Zapoznaj się z następnymi rozdziałami, aby uzyskać więcej informacji na tem **[Pobierz cały przykład (2KB po kompresji)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)** -### Wskazówka: Korzystaj z komponentów wielokrotnie {#tip-reuse-a-component} +### Wskazówka: Wykorzystuj komponenty wielokrotnie {#tip-reuse-a-component} Często zdarza się, że komponent trzeba wyświetlić na stronie kilka razy. Oto przykład, który trzykrotnie wyświetla przycisk "Like" i przekazuje do niego dane: