{"id":23881,"date":"2023-10-02T13:02:53","date_gmt":"2023-10-02T11:02:53","guid":{"rendered":"https:\/\/theforcecode.com\/help\/pl\/zarzadzanie-stanem-w-aplikacjach-react-porownanie-context-api-i-redux-copy\/"},"modified":"2023-10-11T10:45:27","modified_gmt":"2023-10-11T08:45:27","slug":"wprowadzenie-do-react-navigation","status":"publish","type":"post","link":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/","title":{"rendered":"Wprowadzenie do React Navigation"},"content":{"rendered":"<p>React Navigation jest jednym z najwa\u017cniejszych komponent\u00f3w w ekosystemie React Native. Jest to biblioteka, kt\u00f3ra umo\u017cliwia p\u0142ynne przechodzenie mi\u0119dzy r\u00f3\u017cnymi ekranami w aplikacji mobilnej. React Navigation to jeden z najpopularniejszych sposob\u00f3w obs\u0142ugi nawigacji w aplikacjach React Native.<\/p>\n<ul>\n<li><a title=\"Wprowadzenie do React Navigation: Kluczowy komponent w ekosystemie React Native\" href=\"#1\">Co to jest React Navigation?<\/a><\/li>\n<li><a title=\"Korzy\u015bci z u\u017cywania React Navigation: Dlaczego jest to niezb\u0119dne dla Twojej aplikacji React Native?\" href=\"#2\">Dlaczego warto u\u017cywa\u0107 React Navigation?<\/a><\/li>\n<li><a title=\"Krok po kroku: Jak prawid\u0142owo zainstalowa\u0107 React Navigation w Twoim projekcie?\" href=\"#3\">Instalacja React Navigation<\/a><\/li>\n<li><a title=\"Tworzenie nawigatora stosu w React Navigation: Przewodnik dla pocz\u0105tkuj\u0105cych\" href=\"#4\">Tworzenie nawigatora stosu<\/a><\/li>\n<li><a title=\"Nawigacja mi\u0119dzy ekranami w React Navigation: Jak zapewni\u0107 p\u0142ynne przej\u015bcia u\u017cytkownikowi?\" href=\"#5\">Nawigacja mi\u0119dzy ekranami<\/a><\/li>\n<li><a title=\"Zaawansowane techniki nawigacji: Jak nawigowa\u0107 do tej samej trasy wielokrotnie w React Navigation?\" href=\"#6\">Nawigacja do tej samej trasy wielokrotnie<\/a><\/li>\n<li><a title=\"Jak bezproblemowo wr\u00f3ci\u0107 do poprzedniego ekranu w React Navigation?\" href=\"#7\">Powr\u00f3t do poprzedniego ekranu<\/a><\/li>\n<li><a title=\"Podsumowanie React Navigation: Jak efektywnie zarz\u0105dza\u0107 nawigacj\u0105 w aplikacjach React Native?\" href=\"#8\">Podsumowanie<\/a><\/li>\n<\/ul>\n<div class=\"alert message_alert overflow-y-auto alert-default\"><span class=\"w-12 block flex-shrink\"><svg class=\"w-8 h-8\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"><\/path><\/svg><\/span><div class=\"flex-1\"><p class=\"mb-0\">W tym artykule om\u00f3wimy szczeg\u00f3\u0142owo, jak skonfigurowa\u0107 i u\u017cywa\u0107 React Navigation w twoim projekcie React Native. Chcesz stworzy\u0107 atrakcyjne i intuicyjne interfejsy w swojej aplikacji React Native? Poznaj React Navigation &#8211; kluczowy komponent, kt\u00f3ry umo\u017cliwia p\u0142ynne przechodzenie mi\u0119dzy ekranami. Dowiedz si\u0119, jak \u0142atwo zarz\u0105dza\u0107 nawigacj\u0105 i tworzy\u0107 efektywne przej\u015bcia dla lepszej interakcji u\u017cytkownika. Zanurz si\u0119 w \u015bwiecie nawigacji z React Native!<\/p><\/div><\/div>\n<h2 id=\"co-to-jest-react-navigation\"><a name=\"1\"><\/a>Co to jest React Navigation?<\/h2>\n<p>React Navigation jest to biblioteka JavaScript, kt\u00f3ra umo\u017cliwia \u0142atwe i efektywne zarz\u0105dzanie nawigacj\u0105 i przej\u015bciami mi\u0119dzy ekranami w aplikacjach mobilnych stworzonych za pomoc\u0105 React Native. Jest to jedno z najwa\u017cniejszych narz\u0119dzi dla ka\u017cdego dewelopera React Native, umo\u017cliwiaj\u0105ce tworzenie z\u0142o\u017conych hierarchii nawigacyjnych i przej\u015b\u0107 mi\u0119dzy ekranami.<\/p>\n<p>Sprawd\u017a tak\u017ce:<\/p>\n<ul>\n<li><a title=\"State Management w React Native Redux, Mobx i Inne Rozwi\u0105zania\" href=\"https:\/\/theforcecode.com\/help\/pl\/zarzadzanie-stanem-w-react-native-redux-mobx-i-inne-rozwiazania\/\">Zarz\u0105dzanie Stanem w React Native: Redux, Mobx i inne Rozwi\u0105zania<\/a><\/li>\n<li><a title=\"Optymalizacja Wydajno\u015bci w Aplikacjach React Native Praktyczne Wskaz\u00f3wki\" href=\"https:\/\/theforcecode.com\/help\/pl\/optymalizacja-wydajnosci-w-aplikacjach-react-native-praktyczne-porady\/\">Optymalizacja Wydajno\u015bci w Aplikacjach React Native: Praktyczne Porady<\/a><\/li>\n<\/ul>\n<h2 id=\"dlaczego-warto-uzywac-react-navigation\"><a name=\"2\"><\/a>Dlaczego warto u\u017cywa\u0107 React Navigation?<\/h2>\n<p>React Navigation oferuje wiele zalet, kt\u00f3re sprawiaj\u0105, \u017ce jest to idealne rozwi\u0105zanie dla ka\u017cdego, kto chce stworzy\u0107 aplikacj\u0119 mobiln\u0105 z React Native. Oto niekt\u00f3re z nich:<\/p>\n<ol>\n<li aria-level=\"1\"><strong>\u0141atwo\u015b\u0107 u\u017cycia<\/strong>: React Navigation zosta\u0142o zaprojektowane z my\u015bl\u0105 o \u0142atwo\u015bci u\u017cycia. Dzi\u0119ki temu, nawet je\u015bli jeste\u015b nowy w React Native, szybko nauczysz si\u0119, jak korzysta\u0107 z React Navigation.<\/li>\n<li aria-level=\"1\"><strong>Wszechstronno\u015b\u0107<\/strong>: React Navigation umo\u017cliwia tworzenie r\u00f3\u017cnorodnych schemat\u00f3w nawigacyjnych, od prostych stos\u00f3w po skomplikowane tabele i szuflady.<\/li>\n<li aria-level=\"1\"><strong>Dostosowywalno\u015b\u0107<\/strong>: Ka\u017cdy aspekt React Navigation jest w pe\u0142ni dostosowywalny, co pozwala tworzy\u0107 unikalne i spersonalizowane interfejsy u\u017cytkownika.<\/li>\n<li aria-level=\"1\"><strong>Integracja z innymi bibliotekami React Native<\/strong>: React Navigation dobrze integruje si\u0119 z innymi bibliotekami React Native, takimi jak Redux, MobX i inne.<\/li>\n<\/ol>\n<h2 id=\"instalacja-react-navigation\"><a name=\"3\"><\/a>Instalacja React Navigation<\/h2>\n<p>Zanim zaczniemy korzysta\u0107 z React Navigation, musimy najpierw zainstalowa\u0107 kilka pakiet\u00f3w. Poni\u017cej przedstawiamy kroki, kt\u00f3re musisz podj\u0105\u0107, aby prawid\u0142owo zainstalowa\u0107 i skonfigurowa\u0107 React Navigation w twoim projekcie React Native.<\/p>\n<h3 id=\"instalacja-pakietow\">Instalacja pakiet\u00f3w<\/h3>\n<p><code>npm install @react-navigation\/native @react-navigation\/native-stack<\/code><\/p>\n<h3 id=\"instalacja-zaleznosci\">Instalacja zale\u017cno\u015bci<\/h3>\n<p>Nast\u0119pnie musisz zainstalowa\u0107 wymagane zale\u017cno\u015bci. Komendy, kt\u00f3re musisz u\u017cy\u0107, zale\u017c\u0105 od tego, czy tw\u00f3j projekt jest zarz\u0105dzany przez Expo czy jest to czysty projekt React Native.<\/p>\n<p>Je\u015bli masz projekt zarz\u0105dzany przez Expo, zainstaluj zale\u017cno\u015bci za pomoc\u0105 expo:<\/p>\n<p><code>npx expo install react-native-screens react-native-safe-area-context<\/code><\/p>\n<p>Je\u015bli masz czysty projekt React Native, zainstaluj zale\u017cno\u015bci za pomoc\u0105 npm:<\/p>\n<p><code>npm install react-native-screens react-native-safe-area-context<\/code><\/p>\n<p>Dla iOS z czystym projektem React Native, upewnij si\u0119, \u017ce masz zainstalowane CocoaPods https:\/\/cocoapods.org\/. Nast\u0119pnie zainstaluj pods, aby uko\u0144czy\u0107 instalacj\u0119:<\/p>\n<p><code>cd iospod installcd ..<\/code><\/p>\n<h3 id=\"konfiguracja-nawigatora\">Konfiguracja nawigatora<\/h3>\n<p>Po zainstalowaniu wymaganych pakiet\u00f3w i zale\u017cno\u015bci, musimy skonfigurowa\u0107 nasz nawigator. Zazwyczaj robimy to w naszym pliku wej\u015bciowym, takim jak index.js lub App.js:<\/p>\n<p><code>import * as React from 'react';import {NavigationContainer} from '@react-navigation\/native';const App = () =&gt; {\u00a0 return (\u00a0 \u00a0 &lt;NavigationContainer&gt;\u00a0 \u00a0 \u00a0 {\/* Reszta kodu twojej aplikacji *\/}\u00a0 \u00a0 &lt;\/NavigationContainer&gt;\u00a0 );};export default App;<\/code><\/p>\n<h2 id=\"tworzenie-nawigatora-stosu\"><a name=\"4\"><\/a>Tworzenie nawigatora stosu<\/h2>\n<p>Nawigator stosu jest jednym z najcz\u0119\u015bciej u\u017cywanych typ\u00f3w nawigator\u00f3w w React Navigation. Umo\u017cliwia on nawigacj\u0119 mi\u0119dzy r\u00f3\u017cnymi ekranami poprzez stosowanie ich jeden na drugim. Poni\u017cej znajduje si\u0119 przyk\u0142adowy kod, kt\u00f3ry pokazuje, jak stworzy\u0107 nawigator stosu z dwoma ekranami (Home i Details):<\/p>\n<p><code>import * as React from 'react';import {NavigationContainer} from '@react-navigation\/native';import {createNativeStackNavigator} from '@react-navigation\/native-stack';const Stack = createNativeStackNavigator();const MyStack = () =&gt; {\u00a0 return (\u00a0 \u00a0 &lt;NavigationContainer&gt;\u00a0 \u00a0 \u00a0 &lt;Stack.Navigator&gt;\u00a0 \u00a0 \u00a0 \u00a0 &lt;Stack.Screen name=\"Home\" component={HomeScreen} \/&gt;\u00a0 \u00a0 \u00a0 \u00a0 &lt;Stack.Screen name=\"Details\" component={DetailsScreen} \/&gt;\u00a0 \u00a0 \u00a0 &lt;\/Stack.Navigator&gt;\u00a0 \u00a0 &lt;\/NavigationContainer&gt;\u00a0 );};export default MyStack;<\/code><\/p>\n<h2 id=\"nawigacja-miedzy-ekranami\"><a name=\"5\"><\/a>Nawigacja mi\u0119dzy ekranami<\/h2>\n<p>Teraz, gdy mamy skonfigurowany nasz nawigator, mo\u017cemy zacz\u0105\u0107 nawigowa\u0107 mi\u0119dzy r\u00f3\u017cnymi ekranami. Aby to zrobi\u0107, u\u017cywamy funkcji navigation.navigate(), do kt\u00f3rej przekazujemy nazw\u0119 trasy, do kt\u00f3rej chcemy przenie\u015b\u0107 u\u017cytkownika.<\/p>\n<p>Poni\u017cej znajduje si\u0119 przyk\u0142adowy kod, kt\u00f3ry pokazuje, jak przekaza\u0107 u\u017cytkownika z ekranu Home do ekranu Details:<\/p>\n<p><code>function HomeScreen({ navigation }) {\u00a0 return (\u00a0 \u00a0 &lt;View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}&gt;\u00a0 \u00a0 \u00a0 &lt;Text&gt;Home Screen&lt;\/Text&gt;\u00a0 \u00a0 \u00a0 &lt;Button\u00a0 \u00a0 \u00a0 \u00a0 title=\"Go to Details\"\u00a0 \u00a0 \u00a0 \u00a0 onPress={() =&gt; navigation.navigate('Details')}\u00a0 \u00a0 \u00a0 \/&gt;\u00a0 \u00a0 &lt;\/View&gt;\u00a0 );}<\/code><\/p>\n<h2 id=\"nawigacja-do-tej-samej-trasy-wielokrotnie\"><a name=\"6\"><\/a>Nawigacja do tej samej trasy wielokrotnie<\/h2>\n<p>Czasem mo\u017cemy chcie\u0107 nawigowa\u0107 do tej samej trasy wielokrotnie. Na przyk\u0142ad, mo\u017cemy chcie\u0107 otworzy\u0107 kolejny ekran Details na wierzchu stosu. Aby to zrobi\u0107, zamiast u\u017cywa\u0107 navigation.navigate(), mo\u017cemy u\u017cy\u0107 navigation.push():<\/p>\n<p><code>function DetailsScreen({ navigation }) {\u00a0 return (\u00a0 \u00a0 &lt;View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}&gt;\u00a0 \u00a0 \u00a0 &lt;Text&gt;Details Screen&lt;\/Text&gt;\u00a0 \u00a0 \u00a0 &lt;Button\u00a0 \u00a0 \u00a0 \u00a0 title=\"Go to Details... again\"\u00a0 \u00a0 \u00a0 \u00a0 onPress={() =&gt; navigation.push('Details')}\u00a0 \u00a0 \u00a0 \/&gt;\u00a0 \u00a0 &lt;\/View&gt;\u00a0 );}<\/code><\/p>\n<h2 id=\"powrot-do-poprzedniego-ekranu\"><a name=\"7\"><\/a>Powr\u00f3t do poprzedniego ekranu<\/h2>\n<p>Czasami b\u0119dziemy chcieli powr\u00f3ci\u0107 do poprzedniego ekranu. Mo\u017cemy to zrobi\u0107 za pomoc\u0105 funkcji navigation.goBack():<\/p>\n<p><code>function DetailsScreen({ navigation }) {\u00a0 return (\u00a0 \u00a0 &lt;View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}&gt;\u00a0 \u00a0 \u00a0 &lt;Text&gt;Details Screen&lt;\/Text&gt;\u00a0 \u00a0 \u00a0 &lt;Button\u00a0 \u00a0 \u00a0 \u00a0 title=\"Go back\"\u00a0 \u00a0 \u00a0 \u00a0 onPress={() =&gt; navigation.goBack()}\u00a0 \u00a0 \u00a0 \/&gt;\u00a0 \u00a0 &lt;\/View&gt;\u00a0 );}<\/code><\/p>\n<h2 id=\"podsumowanie\"><a name=\"8\"><\/a>Podsumowanie<\/h2>\n<p>React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci, jest to idealne rozwi\u0105zanie dla ka\u017cdego, kto chce stworzy\u0107 aplikacj\u0119 mobiln\u0105 z React Native. Pami\u0119taj, aby zawsze dok\u0142adnie przetestowa\u0107 swoj\u0105 nawigacj\u0119, aby upewni\u0107 si\u0119, \u017ce dzia\u0142a ona tak, jak oczekujesz.<\/p>\n<div class=\"helpful-block-content wth-theme-thumbs\" data-title=\"\" >\n<ul>\n<li><span class=\"wth-title\">Czy ten artyku\u0142 by\u0142 pomocny?<\/span><\/li>\n<li><a data-post=\"23881\" data-post-url=\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\" data-post-title=\"Wprowadzenie do React Navigation\" data-response=\"1\" href=\"#\" class=\"wth-green-btn icon-thumbsup icon1-thumbs-up4\">Tak<\/a><a data-response=\"0\" data-post=\"23881\" data-post-url=\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\" data-post-title=\"Wprowadzenie do React Navigation\" href=\"#\" class=\"wth-red-btn icon-thumbsdown icon1-thumbs-down4\">Nie<\/a><\/li>\n<\/ul>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>React Navigation jest jednym z najwa\u017cniejszych komponent\u00f3w w ekosystemie React Native. Jest to biblioteka, kt\u00f3ra umo\u017cliwia p\u0142ynne przechodzenie mi\u0119dzy r\u00f3\u017cnymi ekranami w aplikacji mobilnej. React Navigation to jeden z najpopularniejszych sposob\u00f3w obs\u0142ugi nawigacji w aplikacjach React Native. Co to jest React Navigation? Dlaczego warto u\u017cywa\u0107 React Navigation? Instalacja React Navigation Tworzenie nawigatora stosu Nawigacja mi\u0119dzy [&hellip;]<\/p>\n","protected":false},"author":15,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1015],"tags":[979,1016,1212,1543,1551,1552],"acf":{"second_title":"Nawigacja w React Native - praktyczny przewodnik po React Navigation","pokaz_ranking_hostingow":false,"tresc":false},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Wprowadzenie do React Navigation &raquo; TheForceCode - centrum wiedzy<\/title>\n<meta name=\"description\" content=\"React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Wprowadzenie do React Navigation &raquo; TheForceCode - centrum wiedzy\" \/>\n<meta property=\"og:description\" content=\"React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\" \/>\n<meta property=\"og:site_name\" content=\"TheForceCode - centrum wiedzy\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/theforcecode\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-10-02T11:02:53+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-10-11T08:45:27+00:00\" \/>\n<meta name=\"author\" content=\"PowiernikMocy\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Napisane przez\" \/>\n\t<meta name=\"twitter:data1\" content=\"PowiernikMocy\" \/>\n\t<meta name=\"twitter:label2\" content=\"Szacowany czas czytania\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minut\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\"},\"author\":{\"name\":\"PowiernikMocy\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/person\/fc4829558bbc3eb55f2cabff906de402\"},\"headline\":\"Wprowadzenie do React Navigation\",\"datePublished\":\"2023-10-02T11:02:53+00:00\",\"dateModified\":\"2023-10-11T08:45:27+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\"},\"wordCount\":782,\"publisher\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#organization\"},\"keywords\":[\"React\",\"react native\",\"konfiguracja\",\"nawigacja\",\"navigation\",\"ekran\"],\"articleSection\":[\"React Native\"],\"inLanguage\":\"pl-PL\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\",\"url\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\",\"name\":\"Wprowadzenie do React Navigation &raquo; TheForceCode - centrum wiedzy\",\"isPartOf\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#website\"},\"datePublished\":\"2023-10-02T11:02:53+00:00\",\"dateModified\":\"2023-10-11T08:45:27+00:00\",\"description\":\"React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci.\",\"breadcrumb\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Strona g\u0142\u00f3wna\",\"item\":\"https:\/\/theforcecode.com\/help\/pl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Framework React Native\",\"item\":\"https:\/\/theforcecode.com\/help\/pl\/react-native\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Nawigacja w React Native - praktyczny przewodnik po React Navigation\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#website\",\"url\":\"https:\/\/theforcecode.com\/help\/pl\/\",\"name\":\"TheForceCode.com\",\"description\":\"TheForceCode - artyku\u0142y\",\"publisher\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#organization\"},\"alternateName\":\"TheForceCode Help\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/theforcecode.com\/help\/pl\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"pl-PL\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#organization\",\"name\":\"TheForceCode.com\",\"alternateName\":\"TheForceCode \u2013 May the code, be with you\",\"url\":\"https:\/\/theforcecode.com\/help\/pl\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/theforcecode.com\/help\/pl\/wp-content\/uploads\/2023\/04\/tfc-logo-black.png\",\"contentUrl\":\"https:\/\/theforcecode.com\/help\/pl\/wp-content\/uploads\/2023\/04\/tfc-logo-black.png\",\"width\":1000,\"height\":307,\"caption\":\"TheForceCode.com\"},\"image\":{\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/theforcecode\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/person\/fc4829558bbc3eb55f2cabff906de402\",\"name\":\"PowiernikMocy\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/cc4482a5ab8c62f7ffeb5d78c27ef285?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/cc4482a5ab8c62f7ffeb5d78c27ef285?s=96&d=mm&r=g\",\"caption\":\"PowiernikMocy\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Wprowadzenie do React Navigation &raquo; TheForceCode - centrum wiedzy","description":"React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/","og_locale":"pl_PL","og_type":"article","og_title":"Wprowadzenie do React Navigation &raquo; TheForceCode - centrum wiedzy","og_description":"React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci.","og_url":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/","og_site_name":"TheForceCode - centrum wiedzy","article_publisher":"https:\/\/www.facebook.com\/theforcecode\/","article_published_time":"2023-10-02T11:02:53+00:00","article_modified_time":"2023-10-11T08:45:27+00:00","author":"PowiernikMocy","twitter_card":"summary_large_image","twitter_misc":{"Napisane przez":"PowiernikMocy","Szacowany czas czytania":"5 minut"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/#article","isPartOf":{"@id":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/"},"author":{"name":"PowiernikMocy","@id":"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/person\/fc4829558bbc3eb55f2cabff906de402"},"headline":"Wprowadzenie do React Navigation","datePublished":"2023-10-02T11:02:53+00:00","dateModified":"2023-10-11T08:45:27+00:00","mainEntityOfPage":{"@id":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/"},"wordCount":782,"publisher":{"@id":"https:\/\/theforcecode.com\/help\/pl\/#organization"},"keywords":["React","react native","konfiguracja","nawigacja","navigation","ekran"],"articleSection":["React Native"],"inLanguage":"pl-PL"},{"@type":"WebPage","@id":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/","url":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/","name":"Wprowadzenie do React Navigation &raquo; TheForceCode - centrum wiedzy","isPartOf":{"@id":"https:\/\/theforcecode.com\/help\/pl\/#website"},"datePublished":"2023-10-02T11:02:53+00:00","dateModified":"2023-10-11T08:45:27+00:00","description":"React Navigation jest pot\u0119\u017cnym narz\u0119dziem, kt\u00f3re pozwala tworzy\u0107 z\u0142o\u017cone schematy nawigacyjne w twojej aplikacji React Native. Dzi\u0119ki jego \u0142atwo\u015bci u\u017cycia i wszechstronno\u015bci.","breadcrumb":{"@id":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/theforcecode.com\/help\/pl\/wprowadzenie-do-react-navigation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Strona g\u0142\u00f3wna","item":"https:\/\/theforcecode.com\/help\/pl\/"},{"@type":"ListItem","position":2,"name":"Framework React Native","item":"https:\/\/theforcecode.com\/help\/pl\/react-native\/"},{"@type":"ListItem","position":3,"name":"Nawigacja w React Native - praktyczny przewodnik po React Navigation"}]},{"@type":"WebSite","@id":"https:\/\/theforcecode.com\/help\/pl\/#website","url":"https:\/\/theforcecode.com\/help\/pl\/","name":"TheForceCode.com","description":"TheForceCode - artyku\u0142y","publisher":{"@id":"https:\/\/theforcecode.com\/help\/pl\/#organization"},"alternateName":"TheForceCode Help","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/theforcecode.com\/help\/pl\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"pl-PL"},{"@type":"Organization","@id":"https:\/\/theforcecode.com\/help\/pl\/#organization","name":"TheForceCode.com","alternateName":"TheForceCode \u2013 May the code, be with you","url":"https:\/\/theforcecode.com\/help\/pl\/","logo":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/logo\/image\/","url":"https:\/\/theforcecode.com\/help\/pl\/wp-content\/uploads\/2023\/04\/tfc-logo-black.png","contentUrl":"https:\/\/theforcecode.com\/help\/pl\/wp-content\/uploads\/2023\/04\/tfc-logo-black.png","width":1000,"height":307,"caption":"TheForceCode.com"},"image":{"@id":"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/theforcecode\/"]},{"@type":"Person","@id":"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/person\/fc4829558bbc3eb55f2cabff906de402","name":"PowiernikMocy","image":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/theforcecode.com\/help\/pl\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/cc4482a5ab8c62f7ffeb5d78c27ef285?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cc4482a5ab8c62f7ffeb5d78c27ef285?s=96&d=mm&r=g","caption":"PowiernikMocy"}}]}},"_links":{"self":[{"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/posts\/23881"}],"collection":[{"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/users\/15"}],"replies":[{"embeddable":true,"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/comments?post=23881"}],"version-history":[{"count":8,"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/posts\/23881\/revisions"}],"predecessor-version":[{"id":24072,"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/posts\/23881\/revisions\/24072"}],"wp:attachment":[{"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/media?parent=23881"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/categories?post=23881"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/theforcecode.com\/help\/pl\/wp-json\/wp\/v2\/tags?post=23881"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}