1
00:00:02,340 --> 00:00:08,460
Ważne jest, aby zrozumieć, jak działa nawigacja i natywne aplikacje, a zwłaszcza jeśli masz doświadczenie

2
00:00:08,460 --> 00:00:14,400
w tworzeniu stron internetowych, ważne jest, aby zrozumieć, czym różni się od nawigacji między ekranami

3
00:00:14,460 --> 00:00:20,760
i siecią, ponieważ w sieci faktycznie wpisujesz adres L i budujesz aplikacja reagująca Używasz narzędzia takiego

4
00:00:20,760 --> 00:00:24,240
jak reakcja routera, aby następnie załadować komponent użytkownika.

5
00:00:24,240 --> 00:00:30,640
A jeśli klikniesz link, który prowadzi do mojej strony, dot com slash ponownie, router z reakcją, który jest dodatkową biblioteką, którą zainstalowałeś, uruchamia się i

6
00:00:30,660 --> 00:00:37,950
widzi, że zmieniasz ścieżkę w twoim U. R. L. i ładuje inny składnik

7
00:00:37,950 --> 00:00:38,820
reagujący.

8
00:00:38,850 --> 00:00:40,800
Tak działa nawigacja w sieci.

9
00:00:40,890 --> 00:00:47,880
Więc jesteś L jest twoim źródłem prawdy i zmiana, że jesteś, może zostać przechwycona przez biblioteki takie jak router

10
00:00:47,880 --> 00:00:51,220
reagujący, który następnie wyrenderował różne komponenty na ekranie.

11
00:00:51,240 --> 00:00:53,910
Tak reaguję na prace w sieci.

12
00:00:54,030 --> 00:00:57,990
Jest jedna ważna różnica, gdy myślimy o aplikacjach natywnych.

13
00:00:58,070 --> 00:01:05,070
Nie mamy, że jesteś ell użytkownicy nie chodzą w twojej aplikacji, wprowadzając niektóre z nich jesteś L zamiast

14
00:01:05,070 --> 00:01:09,510
naciskasz przyciski, naciskasz przyciski i idziesz do przodu i do tyłu.

15
00:01:09,540 --> 00:01:16,050
Masz tylne przyciski, a szuflady boczne - to precyzyjna nawigacja w aplikacjach mobilnych.

16
00:01:16,050 --> 00:01:19,720
Jak już wspomniałem, posiadanie kranów jest jednym z powszechnych wzorów, które tam widzisz.

17
00:01:19,770 --> 00:01:25,170
Przeciętny wspólny wzorzec polega na tym, że poruszasz się po stosie stron, a to oznacza,

18
00:01:25,170 --> 00:01:31,770
że po przejściu na jakąś stronę klikasz element przeniesiony na nowy ekran, a następnie automatycznie dostajesz przycisk Wstecz

19
00:01:31,770 --> 00:01:36,210
na górze lub na Androidzie oczywiście mieć jeden wbudowany w urządzenie.

20
00:01:36,210 --> 00:01:41,850
A kiedy naciśniesz, że wróciłeś do poprzedniej strony i uzyskasz płynne przejście

21
00:01:41,850 --> 00:01:43,100
do tego.

22
00:01:43,140 --> 00:01:48,660
Możesz tam nawigować, na przykład ładować komponent użytkownika, naciskając kartę lub naciskając specjalny element

23
00:01:48,870 --> 00:01:54,270
i będąc tam nawigowanym, a zarzut wygląda po prostu i różni się nieco

24
00:01:54,270 --> 00:01:55,390
od użytkowników.

25
00:01:55,500 --> 00:02:00,700
Teraz oczywiście chcemy wprowadzić ten wygląd do naszej natywnej aplikacji ReACT.

26
00:02:00,780 --> 00:02:02,570
I na szczęście to bardzo łatwe.

27
00:02:02,580 --> 00:02:09,310
Z pomocą biblioteki strony trzeciej będzie korzystać z biblioteki strony trzeciej, która będzie z tego korzystać.

28
00:02:09,310 --> 00:02:16,630
Zatrzymałem mój serwer tutaj, to zareaguj na nawigację, możemy go zainstalować za pomocą npm install dash dash bezpiecznie

29
00:02:16,720 --> 00:02:24,280
reaguj na nawigację w ten sposób i chociaż nazywa się to reaguj nawigacją w rzeczywistości jest to biblioteka

30
00:02:24,310 --> 00:02:26,660
nawigacyjna stworzona do reagowania natywnego.

31
00:02:26,680 --> 00:02:33,370
Teraz możesz także używać go w aplikacjach internetowych, ale jego głównym celem są aplikacje natywne zbudowane z React Native.

32
00:02:33,370 --> 00:02:40,330
Tak więc, chociaż nazywa się to nawigacją reagującą, to działa w React Native, a nie tylko w sieci.

33
00:02:40,870 --> 00:02:46,330
Możemy więc po prostu zainstalować ten pakiet tutaj w naszej aplikacji, aby zacząć z niego korzystać.

34
00:02:46,330 --> 00:02:51,130
I oczywiście nauczę cię tajników tego pakietu i jak go używać do różnych

35
00:02:51,130 --> 00:02:53,200
wzorców nawigacji w tym module.

36
00:02:53,200 --> 00:02:56,590
Ale jeśli chcesz nurkować głębiej lub też mieć pisemny przewodnik.

37
00:02:56,590 --> 00:03:02,280
Zdecydowanie sprawdź także reagującą kropkę nawigacyjną ORIC, która jest oficjalną stroną tego pakietu, gdzie możesz zanurzyć

38
00:03:02,290 --> 00:03:06,000
się w dokach, aby dowiedzieć się wszystkiego o tym pakiecie.

39
00:03:06,040 --> 00:03:09,400
Tam możesz przeczytać wszystko o tym bardzo szczegółowo.

40
00:03:09,430 --> 00:03:13,320
Dowiesz się, jak go używać, jak go skonfigurować i tak dalej.

41
00:03:13,330 --> 00:03:19,360
Możesz z tym wiele zrobić i chociaż omówię większość z tego tutaj, jest to świetny zasób

42
00:03:19,360 --> 00:03:21,680
dla ciebie, aby zanurzyć się głębiej.

43
00:03:21,760 --> 00:03:28,390
Teraz widzimy jedną rzecz, którą absolutnie powinniśmy zrobić, to uruchomić to polecenie użytkownika, który instaluje

44
00:03:28,390 --> 00:03:32,350
kilka dodatkowych zależności w odpowiedzi na potrzeby nawigacji.

45
00:03:32,510 --> 00:03:39,670
Więc po prostu skopiuj to polecenie ze strony Pierwsze kroki tutaj i wykonaj w swoim projekcie w

46
00:03:39,670 --> 00:03:46,180
wierszu poleceń w zintegrowanym terminalu, nie masz instalacji npm, ale instalacji Expo, ale jedyną różnicą

47
00:03:46,180 --> 00:03:52,210
jest to, że Expo zainstalowane za kulisami uruchomi instalację npm, ale to wybierze określone

48
00:03:52,300 --> 00:03:56,540
wersje tych pakietów, które działają z określoną wersją Expo.

49
00:03:56,590 --> 00:04:01,750
Więc jest to bezpieczniejsza wersja instalacji npm, którą możesz powiedzieć i dlatego zalecamy jej użycie

50
00:04:01,750 --> 00:04:02,370
tutaj.

51
00:04:02,380 --> 00:04:07,600
Teraz jedna dodatkowa uwaga na temat tego polecenia i ogólnie tej strony w lewym górnym rogu tej

52
00:04:07,600 --> 00:04:09,240
strony zobaczysz wersję nawigacji React.

53
00:04:09,250 --> 00:04:16,670
Te dokumenty odnoszą się teraz do ponownego użycia tego kursu, podczas gdy w 3 lub 4 są prawie takie same.

54
00:04:16,690 --> 00:04:22,570
Obecnie nie używamy, podczas gdy w wersji 5, ponieważ wersja 5 używa nieco innej składni, której

55
00:04:22,580 --> 00:04:24,280
na razie nie omówimy.

56
00:04:24,280 --> 00:04:30,760
Więc upewnij się, że jeśli wracasz do dokumentów, faktycznie wybierasz wersję 4 lub wolną od dokumentacji

57
00:04:30,760 --> 00:04:32,500
tutaj, aby płynnie postępować.

58
00:04:32,530 --> 00:04:37,300
Oczywiście zawsze możesz spojrzeć na wersję 5 i ręcznie dostosować kod, jeśli chcesz,

59
00:04:37,480 --> 00:04:42,720
ale dla płynnego doświadczenia, gdzie skupić się oczywiście na React Native i nie reagować na nawigację.

60
00:04:42,820 --> 00:04:45,160
Wybierz wersję 4 lub bezpłatny rok.

61
00:04:45,220 --> 00:04:50,560
To tylko mała uwaga na wypadek, gdybyś zastanawiał się nad różnicą między dokumentami tutaj a tym,

62
00:04:50,560 --> 00:04:56,720
co widzisz w tym kursie. Teraz jedna ważna uwaga, podczas gdy my pozostajemy gotowi zareagować na nawigację, w

63
00:04:56,720 --> 00:04:57,550
której jesteśmy.

64
00:04:57,560 --> 00:05:05,540
Tutaj w dalszej części kursu będę miał cały moduł dotyczący reagowania na nawigację pięć, a później, gdzie pokażę ci,

65
00:05:05,540 --> 00:05:10,100
jak przekonwertować twój projekt, aby korzystać z tej najnowszej wersji.

66
00:05:10,100 --> 00:05:16,130
Czy więc posiadasz to, co najlepsze z obu światów, i nauczysz się obu rodzajów konfiguracji nawigacji i

67
00:05:16,130 --> 00:05:22,400
nawigacji oraz reagowania na natywne aplikacje, ponieważ zarówno dla, jak i dla każdej przyszłości, w której ona będzie

68
00:05:22,760 --> 00:05:25,180
miała pięć lat, będzie bardzo ważna.

69
00:05:25,250 --> 00:05:30,890
Więc po prostu skopiujmy to polecenie i upewnijmy się, że oprócz instalacji reagowania na

70
00:05:30,890 --> 00:05:36,830
nawigację, która jest podstawowym pakietem, oczywiście instalujemy te pakiety również w projekcie, uruchamiając tutaj

71
00:05:36,830 --> 00:05:43,570
Instalację Expo z zakończoną tutaj instalacją. Mogę zrestartować mój serwer Expo po uruchomieniu NPM i możemy

72
00:05:43,570 --> 00:05:46,540
teraz zacząć korzystać z nawigacji reagującej.

73
00:05:46,540 --> 00:05:51,550
Teraz w tym celu wymień nowy folder w moim projekcie, a ja nazwiemy go nawigacją.

74
00:05:51,550 --> 00:05:57,140
Nie jest to coś, co musisz zrobić, ale może pomóc w utrzymaniu kodu w czystości, ponieważ tam jest.

75
00:05:57,140 --> 00:06:03,600
Stworzę nowy plik, wszystkie utworzę nawigator posiłków kropka J jesień.

76
00:06:03,640 --> 00:06:05,590
Teraz ta nazwa pliku zależy wyłącznie od Ciebie.

77
00:06:05,620 --> 00:06:12,970
Chcę tylko zaznaczyć, że tam skonfiguruję nawigację dla mojej aplikacji do posiłków,

78
00:06:12,970 --> 00:06:14,690
którą buduję.

79
00:06:14,710 --> 00:06:16,630
Dlatego właśnie tak to się nazywa.

80
00:06:16,630 --> 00:06:22,420
I to jest jesienna nawigacja jazzowa, w której chcę skonfigurować konfigurację nawigacji.

81
00:06:22,420 --> 00:06:29,530
Chcę powiedzieć, że nawigacja zainstalowała bibliotekę, jakie różne ekrany mamy, w jaki sposób są połączone i

82
00:06:29,830 --> 00:06:32,880
jak możemy się między nimi poruszać.

83
00:06:33,190 --> 00:06:36,670
Teraz łatwiej to po prostu zobaczyć niż po prostu o nich porozmawiać.

84
00:06:36,730 --> 00:06:41,350
Dlatego w nawigatorze posiłków zacznijmy konfigurować nawigację.