Skip to content

Commit 9f900b8

Browse files
Incorporating Jakub's suggestions
1 parent e9e155d commit 9f900b8

File tree

1 file changed

+24
-24
lines changed

1 file changed

+24
-24
lines changed

content/docs/create-a-new-react-app.md

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -8,23 +8,23 @@ prev: add-react-to-a-website.html
88
next: cdn-links.html
99
---
1010

11-
Najwygodniej będzie ci się pracowało jeśli zastosujesz zintegrowany zestaw narzędzi (ang. toolchain). Użycie go pozwoli ci też zapewnić dobre doświadczenie użytkownikom twojej aplikacji.
11+
Najwygodniej będzie ci się pracowało, jeśli zastosujesz zintegrowany zestaw narzędzi (ang. *toolchain*). Użycie go pozwoli ci też zapewnić dobre doświadczenie użytkownikom twojej aplikacji.
1212

1313
Poniżej przedstawiamy kilka popularnych zestawów narzędziowych używanych w Reakcie. Pomagają one w zadaniach typu:
1414

15-
* Zwiększanie skali projektu do wielu plików i komponentów.
16-
* Stosowanie dodatkowych bibliotek dostępnych w npm.
17-
* Wczesne wykrywanie często popełnianych błędów.
18-
* Ciągła, automatyczna edycja CSS i JS w trakcie tworzenia aplikacji.
19-
* Optymalizacja kodu przed oddaniem aplikacji do użytku.
15+
* zwiększanie skali projektu do wielu plików i komponentów;
16+
* stosowanie dodatkowych bibliotek dostępnych w npm;
17+
* wczesne wykrywanie często popełnianych błędów;
18+
* ciągła, edycja CSS i JS w trakcie tworzenia aplikacji bez konieczności odświeżania strony w przeglądarce;
19+
* optymalizacja kodu przed wdrożeniem go do środowiska produkcyjnego.
2020

21-
Zestawy narzędziowe, które tutaj podajemy umożliwiają szybkie rozpoczęcie pracy and aplikacją i **nie wymagają żadnej wstępnej konfiguracji**
21+
Zestawy narzędziowe, które tutaj podajemy, umożliwiają szybkie rozpoczęcie pracy nad aplikacją i **nie wymagają żadnej wstępnej konfiguracji**
2222

2323
## Stosowanie zestawu narzędziowego nie jest konieczne {#you-might-not-need-a-toolchain}
2424

25-
Jeśli powyższe zadania nie przysparzają ci żadnych problemów lub jeśli nie wiesz jeszcze jak stosować narzędzia JavaScript, możesz [dodać React jako zwykły znacznik `<script>` do strony HTML](/docs/add-react-to-a-website.html), ewentualnie [z użyciem JSX](/docs/add-react-to-a-website.html#optional-try-react-with-jsx).
25+
Jeśli powyższe zadania nie przysparzają ci żadnych problemów lub jeśli nie wiesz jeszcze, jak stosować narzędzia JavaScript, możesz [dodać React jako zwykły znacznik `<script>` do strony HTML](/docs/add-react-to-a-website.html), ewentualnie [z użyciem JSX](/docs/add-react-to-a-website.html#optional-try-react-with-jsx).
2626

27-
Jest to **najprostszy sposób zintegrowania Reacta z istniejącą już stroną internetową**. Zestaw narzędziowy możesz zawsze dodać do swojej aplikacji jeśli zajdzie taka potrzeba.
27+
Jest to **najprostszy sposób zintegrowania Reacta z istniejącą już stroną internetową**. Zestaw narzędziowy możesz zawsze dodać do swojej aplikacji, gdy pojawi się taka potrzeba.
2828

2929
## Zalecane zestawy narzędziowe {#recommended-toolchains}
3030

@@ -33,62 +33,62 @@ Zespół Reacta rekomenduje następujące rozwiązania:
3333
- Jeśli **uczysz się Reacta** lub jeśli **tworzysz nową aplikację [jednostronicową](/docs/glossary.html#single-page-application),** skorzystaj z [Create React App](#create-react-app).
3434
- Jeśli tworzysz **stronę internetową renderowaną na serwerze z użyciem Node.js,** spróbuj zastosować [Next.js](#nextjs).
3535
- Jeśli tworzysz **stronę statyczną, która ma głównie wyświetlać określone treści,** spróbuj zastosować [Gatsby](#gatsby).
36-
- Jeśli tworzysz **bibliotekę kompnentów** lub **integrujesz z istniejącą bazą kodu,** spróbuj zastosować [bardziej elastyczne zestwy narzędziowe](#more-flexible-toolchains).
36+
- Jeśli tworzysz **bibliotekę kompnentów** lub **dokonujesz integracji z istniejącą bazą kodu,** spróbuj zastosować [bardziej elastyczne zestawy narzędziowe](#more-flexible-toolchains).
3737

3838

3939
### Create React App {#create-react-app}
4040

4141
[Create React App](http://github.com/facebookincubator/create-react-app) zapewnia bardzo dogodne środowisko pracy sprzyjające **nauce Reacta**. Jest to najlepszy sposób, aby zacząć tworzyć **nową [jednostronicową](/docs/glossary.html#single-page-application) aplikację** w Reakcie.
4242

43-
Środowisko pracy stworzone przez Create React App nie tylko umożliwi ci stosowanie najnowszych funkcjonalności JavaScript, lecz także zoptymalizuje twój kod przed oddaniem go do użytku i ogólnie znacznie usprawni twoją pracę. Aby móc skorzystać z tego rozwiązania na swoim komputerze, będziesz potrzebował Node >=6 oraz npm >=5.2. W celu stworzenia projektu zastosuj następujące komendy:
43+
Środowisko pracy stworzone przez Create React App nie tylko umożliwi ci stosowanie najnowszych funkcjonalności języka JavaScript, lecz także zoptymalizuje twój kod przed oddaniem go do użytku i ogólnie znacznie usprawni twoją pracę. Aby móc skorzystać z tego rozwiązania na swoim komputerze, będziesz potrzebować Node >= 6 oraz npm >= 5.2. Stworzenie projektu umożliwią ci następujące komendy:
4444

4545
```bash
46-
npx create-react-app my-app
47-
cd my-app
46+
npx create-react-app moja-aplikacja
47+
cd moja-aplikacja
4848
npm start
4949
```
5050

5151
>Wskazówka
52-
> `npx` w pierwszej linijce powyżej to nie błąd w druku, to [narzędzie uruchamiające pakiety zawarte w npm 5.2+](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b).
52+
> `npx` w pierwszej linijce powyżej to nie literówka, to [narzędzie uruchamiające pakiety zawarte w npm 5.2+](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b).
5353
54-
Create React App nie obsługuje ani logiki backendu ani baz danych; tworzy jedynie front-endowy potok budowania (ang. *build pipeline*). Dzięki temu możesz go używać z dowolnie wybranym przez siebie backendem. Create React App zawiera [Babel](http://babeljs.io/) i [webpack](https://webpack.js.org/), ale nie musisz nic o nich wiedzieć, aby z powodzeniem używać tego zestawu narzędzi.
54+
Create React App nie obsługuje ani logiki backendu ani baz danych; tworzy jedynie frontendowy potok budowania (ang. *build pipeline*). Dzięki temu możesz go używać z dowolnie wybranym przez siebie backendem. Create React App zawiera narzędzia takie jak [Babel](http://babeljs.io/) i [webpack](https://webpack.js.org/), ale nie musisz nic o nich wiedzieć, aby z powodzeniem używać ich w swoich projektach.
5555

56-
Kiedy uznasz, że twoja aplikacja jest gotowa do oddania do użytku, zastosuj komendę `npm run build`. Dzięki temu uzyskasz zoptymalizowaną wersję swojej aplikacji. Znajdziesz ją w folderze `build`. Więcej informacji na temat Create React App znajdziesz w [pliku README](https://github.com/facebookincubator/create-react-app#create-react-app-) oraz w tym [Przewodniku użytkownika](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#table-of-contents).
56+
Kiedy uznasz, że twoja aplikacja jest gotowa do wdrożenia do środowiska produkcyjnego, zastosuj komendę `npm run build`. Dzięki temu uzyskasz zoptymalizowaną wersję swojej aplikacji. Znajdziesz ją w folderze `build`. Więcej informacji na temat Create React App znajdziesz w [pliku README](https://github.com/facebookincubator/create-react-app#create-react-app-) oraz w tym [Przewodniku użytkownika](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#table-of-contents).
5757

5858
### Next.js {#nextjs}
5959

60-
[Next.js](https://nextjs.org/) jest popularnym, lekkim frameworkiem służącym do budowy aplikacji reactowych **statycznych oraz renderowanych po stronie serwera**. Zestaw ten zawiera **rozwiązania stylizujące i mechanizmy routingu**. Ponadto, Next.js domyślnie zakłada, że stosujesz [Node.js](https://nodejs.org/) jako środowisko serwera.
60+
[Next.js](https://nextjs.org/) jest popularnym, lekkim frameworkiem służącym do budowy aplikacji reactowych **statycznych oraz renderowanych po stronie serwera**. Zestaw ten zawiera **rozwiązania ułatwiające dodawanie stylu i mechanizmy routingu**. Ponadto, Next.js domyślnie zakłada, że stosujesz [Node.js](https://nodejs.org/) jako środowisko serwerowe.
6161

6262
Zapoznaj się z zestawem narzędziowym Next.js poprzez [oficjalny przewodnik](https://nextjs.org/learn/).
6363

6464
### Gatsby {#gatsby}
6565

66-
[Gatsby](https://www.gatsbyjs.org/) zapewnia najlepszy sposób tworzenia **stron statycznych** z Reactem. Ten zestaw narzędziowy umożliwia korzystanie z komponentów reactowych, ale w wyniku jego zastosowania otrzymujemy wstępne renderowanie HTML i CSS co zapewnia najszczybsze możliwe ładowanie strony.
66+
[Gatsby](https://www.gatsbyjs.org/) to najlepsze narzędzie do tworzenia **stron statycznych** korzystających z Reacta. Pozwala ono na tworzenie struktury aplikacji przy użyciu komponentów reactowych, lecz jako wynik końcowy generuje wstępnie wyrenderowane pliki HTML i CSS, co zapewnienia maksymalną szybkość ładowania strony.
6767

6868
Zapoznaj się z Gatsbym poprzez [oficjalny przewodnik](https://www.gatsbyjs.org/docs/) oraz [galerię zestawów startowych](https://www.gatsbyjs.org/docs/gatsby-starters/).
6969

7070
### Bardziej elastyczne zestawy narzędziowe {#more-flexible-toolchains}
7171

7272
Podane niżej zestawy narzędziowe są stosunkowo bardziej elastyczne i dają większą dowolność konfiguracji. Polecamy je bardziej doświadczonym użytkownikom.
7373

74-
- **[Neutrino](https://neutrinojs.org/)** łączy w sobie siłę [webpacku](https://webpack.js.org/) z prostotą ustawień domyślnych. Zestaw ten zawiera ustawienia domyślne dla [aplikacji reactowych](https://neutrinojs.org/packages/react/) i [komponentów reactowych](https://neutrinojs.org/packages/react-components/).
74+
- **[Neutrino](https://neutrinojs.org/)** łączy w sobie siłę [webpacka](https://webpack.js.org/) z prostotą ustawień domyślnych. Zestaw ten zawiera ustawienia domyślne dla [aplikacji reactowych](https://neutrinojs.org/packages/react/) i [komponentów reactowych](https://neutrinojs.org/packages/react-components/).
7575

76-
- **[nwb](https://github.com/insin/nwb)** jest zalecany szczególnie dla potrzeb [publikowania komponentów reactowych na npm](https://github.com/insin/nwb/blob/master/docs/guides/ReactComponents.md#developing-react-components-and-libraries-with-nwb). Może też [być stosowany](https://github.com/insin/nwb/blob/master/docs/guides/ReactApps.md#developing-react-apps-with-nwb) do tworzenia aplikacji w Reakcie.
76+
- **[nwb](https://github.com/insin/nwb)** jest zalecany szczególnie do [publikowania komponentów reactowych na npm](https://github.com/insin/nwb/blob/master/docs/guides/ReactComponents.md#developing-react-components-and-libraries-with-nwb). Może też [być stosowany](https://github.com/insin/nwb/blob/master/docs/guides/ReactApps.md#developing-react-apps-with-nwb) do tworzenia aplikacji w Reakcie.
7777

78-
- **[Parcel](https://parceljs.org/)** jest szybkim bundlerem aplikacji webowych, niewymagającym żadnego konfigurowania dla potrzeb [aplikacji reactowych](https://parceljs.org/recipes.html#react).
78+
- **[Parcel](https://parceljs.org/)** jest szybkim bundlerem aplikacji webowych, [doskonale współgrającym z Reactem]](https://parceljs.org/recipes.html#react).
7979

8080
- **[Razzle](https://github.com/jaredpalmer/razzle)** jest frameworkiem umożliwiającym renderowanie po stronie serwera niewymagającym konfigurowania, ale dającym większy wybór niż Next.js.
8181

8282
## Tworzenie zestawu narzędziowego od podstaw {#creating-a-toolchain-from-scratch}
8383

84-
W skład zestaw narzędziowy w JavaScripcie wchodzą zazwyczaj następujące elementy:
84+
W skład javascriptowych narzędzi do budowania aplikacji wchodzą zazwyczaj następujące elementy:
8585

8686
* **Menadżer pakietów** np. [Yarn](https://yarnpkg.com/) lub [npm](https://www.npmjs.com/). Umożliwia on korzystanie z ogromnego ekosystemu dodatkowych pakietów. Pozwala łatwo je instalować i aktualizować.
8787

8888
* **Bundler** np. [webpack](https://webpack.js.org/) lub [Parcel](https://parceljs.org/). Umożliwia on pisanie kodu modularnego i pakowania go w małe pakiety, aby zoptymalizować czas ładowania.
8989

9090
* **Kompilator** np. [Babel](http://babeljs.io/). Pozwala on na stosowanie nowych wersji JavaScriptu przy zachowaniu kompatybilności ze starszymi przeglądarkami.
9191

92-
Jeśli chcesz stworzyć swój własny zestaw narzędziowy od podstaw, zajrzyj do [tego przewodnika](https://blog.usejournal.com/creating-a-react-app-from-scratch-f3c693b84658). Dowiesz się z niego jak odtworzyć niektóre z funkcjonalności Create React App.
92+
Jeśli chcesz stworzyć swój własny zestaw narzędziowy od podstaw, zajrzyj do [tego przewodnika](https://blog.usejournal.com/creating-a-react-app-from-scratch-f3c693b84658). Dowiesz się z niego, jak odtworzyć niektóre z funkcjonalności Create React App.
9393

94-
Pamiętaj aby upewnić się, że twój własny zestaw narzędziowy [tworzy właściwą użytkową wersję aplikacji](/docs/optimizing-performance.html#use-the-production-build).
94+
Pamiętaj, aby upewnić się, że twój własny zestaw narzędziowy [jest przystosowany do wdrożeń produkcyjnych](/docs/optimizing-performance.html#use-the-production-build).

0 commit comments

Comments
 (0)