1
00:00:02,230 --> 00:00:08,830
Ora oltre a configurare un nuovo progetto da zero con React Native CLI o con l'Expo CLI e quindi

2
00:00:08,860 --> 00:00:10,820
a scegliere il flusso di

3
00:00:11,020 --> 00:00:19,710
lavoro nudo, puoi persino convertire un progetto gestito in un progetto di flusso di lavoro nudo React Native ed è piuttosto bello perché ciò significa

4
00:00:19,900 --> 00:00:24,480
che puoi ottenere tutto le funzionalità utili del flusso di lavoro gestito durante

5
00:00:24,490 --> 00:00:32,170
lo sviluppo e, una volta terminato, ad esempio o una volta che è necessario un determinato pacchetto di terze parti che integra

6
00:00:32,230 --> 00:00:38,110
alcune funzionalità che non sono state integrate in expo e assolutamente necessarie, in tal caso è possibile

7
00:00:38,110 --> 00:00:43,180
ancora passare e non è necessario ricostruire l'app da zero e creare un nuovo progetto

8
00:00:43,180 --> 00:00:44,890
e copiare il codice.

9
00:00:45,010 --> 00:00:51,380
Come? Bene nel tuo progetto e questa è la funzionalità

10
00:00:51,380 --> 00:00:57,520
del dispositivo nativo, i grandi posti proiettano in precedenza nel corso in cui possiamo aggiungere luoghi, dove ovviamente stiamo

11
00:00:57,520 --> 00:01:05,230
usando la posizione, le mappe, la fotocamera, SQLite, dove stiamo usando tutti questi cose, lì in questo progetto, puoi semplicemente eseguire espulsione expo e

12
00:01:05,230 --> 00:01:10,390
questo trasforma il tuo progetto in un progetto di flusso di lavoro gestito non expo.

13
00:01:10,390 --> 00:01:13,110
Importante, non è possibile tornare indietro, ovviamente puoi copiare

14
00:01:13,110 --> 00:01:18,550
la tua cartella ed effettuare una copia di backup e salvarla o se stai usando git, puoi ovviamente

15
00:01:18,550 --> 00:01:23,860
tornare a un commit precedente ma se non hai salvato il tuo progetto, una volta espulso, non

16
00:01:23,860 --> 00:01:25,360
è possibile riconvertirlo,

17
00:01:25,360 --> 00:01:26,900
quindi essere consapevoli di questo.

18
00:01:27,160 --> 00:01:32,680
Dovresti creare un nuovissimo progetto gestito expo e copiarlo su tutto il tuo codice se

19
00:01:32,680 --> 00:01:33,970
vuoi tornare indietro.

20
00:01:33,970 --> 00:01:40,720
Quindi qui se esegui espulsione expo, dovresti effettivamente chiederti quale tipo di progetto vuoi espellere e

21
00:01:40,750 --> 00:01:46,180
qui ho due opzioni alla fine. Ora le opzioni che vedi qui potrebbero differire nel tempo

22
00:01:46,210 --> 00:01:52,360
ma qui, le due opzioni che ho sono nude e kit expo. Il kit Expo è deprecato, questo è fondamentalmente

23
00:01:52,360 --> 00:01:58,780
quello che avevamo prima di avere il flusso di lavoro nudo, quindi non dovresti davvero passare a questo, invece

24
00:01:58,780 --> 00:02:02,520
puoi passare a nudo qui, il che significa semplicemente che

25
00:02:02,530 --> 00:02:08,710
ora questo verrà trasformato in un progetto React Native, come se fosse creato con l'interfaccia della riga di

26
00:02:08,710 --> 00:02:13,010
comando di React Native senza il wrapper expo ma verrà preconfigurato come

27
00:02:13,030 --> 00:02:18,640
indicato qui nella pagina di reazione-nativo-unimoduli che è una specie di questo pacchetto che expo deve

28
00:02:18,670 --> 00:02:26,200
esporre tutte queste API expo a un app non expo. Quindi preconfigurerà tutte queste cose durante ogni azione in

29
00:02:26,200 --> 00:02:29,140
modo da non doverlo fare, quindi

30
00:02:29,350 --> 00:02:36,120
otterrai un'app React Native plus per così dire. Quindi, se premo invio qui e ora è

31
00:02:36,120 --> 00:02:42,310
importante, non puoi tornare indietro una volta completato, puoi scegliere un nome per la schermata principale

32
00:02:42,910 --> 00:02:50,490
e sceglierò posti fantastici qui, ad esempio, premi invio, ora nome Android Studio e Xcode guida i progetti ma

33
00:02:50,530 --> 00:02:54,670
dipende da te e ora questo farà il suo lavoro.

34
00:02:54,880 --> 00:02:56,280
Trasforma il progetto, aggiunge una

35
00:02:56,290 --> 00:03:02,380
cartella Android e poiché sono su macOS, aggiunge anche una cartella iOS. Ovviamente su Windows e Linux, non lo farà

36
00:03:02,380 --> 00:03:06,970
perché lì, poiché ora è necessario crearlo localmente, non è in grado

37
00:03:06,970 --> 00:03:08,660
di creare app

38
00:03:09,640 --> 00:03:16,450
iOS e preconfigura tutto e installa un paio di dipendenze in modo da poter utilizzare il codice

39
00:03:16,450 --> 00:03:22,150
esistente e tutti i pacchetti expo che hai già installato in questa configurazione non elaborata,

40
00:03:22,150 --> 00:03:25,130
quindi non configura tutte le cose unimodules

41
00:03:25,240 --> 00:03:32,710
qui, ma si assicura anche che tutti i pacchetti che stai già utilizzando, come la posizione expo o exite

42
00:03:33,130 --> 00:03:37,980
SQLite, che anche questi pacchetti opera. Quindi ora può volerci un

43
00:03:38,010 --> 00:03:46,260
po ', quindi aspettiamo che finisca e qui è fatto e vedi che in realtà mi dice che generalmente ha fatto il

44
00:03:46,260 --> 00:03:50,430
suo lavoro ma c'erano due pacchetti che richiedono una configurazione manuale.

45
00:03:50,430 --> 00:03:54,750
Puoi semplicemente fare clic su questi collegamenti per ottenere istruzioni su cosa devi fare lì,

46
00:03:54,780 --> 00:04:00,810
è il selettore di immagini expo e il pacchetto di mappe native di React in cui è necessario eseguire l'installazione

47
00:04:00,810 --> 00:04:01,980
manuale per completarlo.

48
00:04:02,820 --> 00:04:05,010
Quindi qui nella pagina di

49
00:04:05,010 --> 00:04:11,810
selezione delle immagini di expo, alla fine quello che dobbiamo fare è eseguire l'installazione delle porte nella cartella iOS,

50
00:04:11,820 --> 00:04:18,660
quindi dobbiamo fare tutto dopo aver installato il pacchetto. Quindi nella cartella del progetto, navigherò su iOS ed

51
00:04:18,660 --> 00:04:24,930
eseguirò l'installazione della porta, la porta è come npm per iOS, installa alcune dipendenze che iOS deve funzionare

52
00:04:25,050 --> 00:04:32,040
correttamente, quindi è quello che sta succedendo ora e una volta fatto, faremo anche è necessario aggiungere questa voce qui

53
00:04:32,040 --> 00:04:36,030
al manifest di Android, quindi è anche qualcosa che dovremo fare.

54
00:04:36,270 --> 00:04:42,030
Quindi dobbiamo andare nella cartella Android, nella cartella dell'app lì e nella cartella di origine,

55
00:04:42,360 --> 00:04:47,070
AndroidManifest e quindi, come descritto qui, aggiungere questo all'interno dei tag dell'applicazione.

56
00:04:47,070 --> 00:04:57,060
Quindi qui è l'applicazione e lì, dovremmo aggiungere questa voce di attività qui, come questa, che è richiesta.

57
00:04:57,300 --> 00:05:02,280
Ora, mentre sono già qui, vedrai anche che questo file manifest è stato impostato

58
00:05:02,280 --> 00:05:02,950
in

59
00:05:03,090 --> 00:05:08,940
un certo modo, include tutte le autorizzazioni e, naturalmente, non vuoi farlo, vuoi solo chiedere le

60
00:05:08,940 --> 00:05:10,390
autorizzazioni hai davvero bisogno.

61
00:05:10,410 --> 00:05:18,480
Quindi, come dice qui, rimuovi tutte le autorizzazioni di cui la tua app non ha bisogno e, ad

62
00:05:18,480 --> 00:05:24,300
esempio, la mia applicazione demo qui dovrebbe solo avere bisogno dell'autorizzazione per trovare

63
00:05:27,440 --> 00:05:36,890
la posizione che sposterò lassù e, naturalmente, l'autorizzazione della telecamera che sposterò lassù e anche l'autorizzazione di scrittura su memoria esterna, che

64
00:05:41,790 --> 00:05:43,520
dovrebbe essere richiesta.

65
00:05:43,530 --> 00:05:48,900
Dovrebbero essere effettivamente tutte le autorizzazioni e puoi controllare tutti i pacchetti di terze parti o tutti

66
00:05:48,900 --> 00:05:54,110
i pacchetti API di expo che stai utilizzando per assicurarti di non perdere alcuna autorizzazione.

67
00:05:54,300 --> 00:06:00,840
Con ciò, in realtà commenterò tutte queste autorizzazioni qui e anche tutte queste autorizzazioni e

68
00:06:00,840 --> 00:06:09,170
lo testeremo per vedere se funziona. Quindi, con ciò, l'impostazione del pacchetto di selezione delle immagini è fatta. Ora anche le mappe native

69
00:06:09,190 --> 00:06:14,880
di React devono essere configurate e lì possiamo immergerci nelle istruzioni di installazione.

70
00:06:14,880 --> 00:06:18,260
Ora questo comando di installazione npm, che è già successo, ma ora ciò

71
00:06:18,390 --> 00:06:24,960
che dobbiamo fare è eseguire React Native link React Native maps. Quindi saliamo semplicemente di un livello

72
00:06:25,020 --> 00:06:32,380
nella cartella principale del progetto ed eseguiamo React Native link React Native maps e

73
00:06:32,380 --> 00:06:34,590
che ora collegherà

74
00:06:34,600 --> 00:06:40,870
tutto, assicuriamoci che tutto funzioni correttamente, che tutto sia configurato correttamente e

75
00:06:40,870 --> 00:06:49,120
sarà comunque necessario fare qualche manuale roba, tutte queste cose qui non dovrebbero essere richieste,

76
00:06:49,270 --> 00:07:00,230
ciò dovrebbe essere fatto con il collegamento per fortuna ma su Android, è necessario assicurarsi di aggiungere questa voce qui,

77
00:07:00,230 --> 00:07:05,520
questa voce di metadati nella chiave dell'applicazione in AndroidManifest.

78
00:07:05,630 --> 00:07:11,990
Quindi qui all'interno dell'applicazione, possiamo aggiungere questa voce e lì è necessario posizionare la chiave API di

79
00:07:11,990 --> 00:07:12,740
Google Maps.

80
00:07:12,840 --> 00:07:14,680
Ora ce l'ho nella cartella

81
00:07:14,690 --> 00:07:21,230
env se ricordi, quindi prenderò questa chiave e la aggiungerò qui, sostituirò la tua chiave API di Google

82
00:07:21,230 --> 00:07:23,490
Maps qui con essa e anche

83
00:07:23,660 --> 00:07:31,040
importante, se vai alla pagina API di Google Maps, devi per abilitare questo SDK di mappe per Android per il

84
00:07:31,040 --> 00:07:31,790
tuo

85
00:07:31,790 --> 00:07:36,500
progetto, è importante altrimenti non funzionerà. Per iOS, non devi fare nulla di speciale a

86
00:07:36,500 --> 00:07:41,690
meno che tu non voglia utilizzare Google Maps lì, nel qual caso devi seguire le istruzioni fornite nelle istruzioni di React

87
00:07:41,870 --> 00:07:44,920
Native Maps qui per come utilizzare Google Maps su iOS ma per

88
00:07:45,800 --> 00:07:52,930
Android tu sicuramente è necessario abilitare l'SDK di Google Maps per l'API Android qui. Per abilitare questa API, puoi accedere a Google Cloud Platform

89
00:07:52,940 --> 00:07:58,760
qui per il progetto a cui hai lavorato in precedenza quando hai impostato quella chiave API e

90
00:07:59,000 --> 00:08:05,240
così via e quindi qui in API e servizi, puoi andare alla libreria che ti porta in una

91
00:08:05,240 --> 00:08:09,710
libreria di tutte le API di Google e lì l'SDK delle mappe per

92
00:08:09,710 --> 00:08:11,120
Android, devi abilitarlo.

93
00:08:11,120 --> 00:08:15,980
Dovrai anche impostare l'SDK delle mappe per iOS se desideri utilizzare Google Maps su iOS che

94
00:08:15,980 --> 00:08:17,150
non userò qui.

95
00:08:17,350 --> 00:08:18,760
Ora dovrebbe essere già abilitato qui,

96
00:08:18,770 --> 00:08:21,500
ma assicurati che lo sia. Quindi, nel caso in cui non

97
00:08:21,590 --> 00:08:22,710
fosse abilitato, fallo sicuramente.

98
00:08:24,370 --> 00:08:27,240
Con ciò, questo dovrebbe anche essere impostato in

99
00:08:27,250 --> 00:08:34,450
modo che funzioni e ora se eseguiamo run-android di reazione nativo, l'app che abbiamo creato in un modulo precedente con il flusso di

100
00:08:34,450 --> 00:08:41,260
lavoro gestito expo ora dovrebbe ancora funzionare, ora senza il flusso di lavoro gestito expo senza il client expo utilizzato sul

101
00:08:41,260 --> 00:08:47,770
simulatore o sul dispositivo reale, ma invece compilare localmente con Android Studio o ovviamente anche con iOS se si desidera

102
00:08:47,770 --> 00:08:54,000
utilizzarlo e quindi allo stesso modo in cui lo si farebbe in un progetto creato con CLI React Native ma

103
00:08:54,010 --> 00:08:55,510
ora dopo essere stato

104
00:08:55,510 --> 00:09:01,000
espulso dal flusso di lavoro gestito, questo ovviamente significa che tutto questo codice è stato scritto nel

105
00:09:01,000 --> 00:09:07,180
flusso di lavoro gestito, eppure ora lo eseguo nel flusso di lavoro non gestito, il che è piuttosto semplice.

106
00:09:07,180 --> 00:09:10,830
Quindi aspettiamo che questo finisca e vediamo se questa app funziona come dovrebbe.

107
00:09:11,590 --> 00:09:16,780
Sta arrivando sull'emulatore Android qui che è l'emulatore che voglio usare per i test perché lì posso usare

108
00:09:16,780 --> 00:09:23,020
la telecamera dell'emulatore per i test e di nuovo, solo per sottolineare questo, questo non sta usando l'app client expo, non

109
00:09:23,020 --> 00:09:24,400
potremmo nemmeno ' t

110
00:09:24,400 --> 00:09:28,930
esegui la scansione di un codice a barre qui perché non esiste un codice a

111
00:09:28,940 --> 00:09:34,570
barre per eseguire la scansione, ora questa è davvero un'app costruita con Android Studio e inviata alla nostra app.

112
00:09:34,720 --> 00:09:38,710
Quindi ecco la nostra app e ora proviamo ad aggiungere

113
00:09:38,710 --> 00:09:44,470
un nuovo posto qui, testare, scattare un'immagine, consentire l'accesso alla telecamera ovviamente e quindi prendere

114
00:09:49,370 --> 00:09:50,630
questa immagine sì

115
00:09:53,960 --> 00:09:55,190
ritagliarla, scegliere una

116
00:09:56,060 --> 00:09:58,010
posizione sulla mappa forse, ecco

117
00:10:00,760 --> 00:10:04,050
la mappa in arrivo, questa posizione mi sembra

118
00:10:04,070 --> 00:10:06,760
buona, salva questo, salva il posto, eccoci

119
00:10:06,760 --> 00:10:07,540
qui

120
00:10:07,540 --> 00:10:09,940
e ora fammi chiudere questa app.

121
00:10:10,060 --> 00:10:13,210
Lì, vedi anche che questa è davvero un'app

122
00:10:13,210 --> 00:10:19,210
standalone installata, se apro il cassetto delle app qui sul dispositivo, qui sul simulatore, è

123
00:10:19,380 --> 00:10:22,040
questa fantastica app che vedi qui.

124
00:10:22,040 --> 00:10:28,920
Quindi, se lancio questo, ora riavvia l'app in cui abbiamo appena lavorato e c'è il nostro posto in quanto

125
00:10:29,190 --> 00:10:30,330
è stato archiviato

126
00:10:30,330 --> 00:10:34,540
nella memoria locale, l'immagine ovviamente è stata memorizzata nel filesystem altrimenti

127
00:10:34,710 --> 00:10:41,370
non la vedremmo e funziona come prima ma ora non all'interno del client expo ma come app standalone

128
00:10:41,370 --> 00:10:41,970
senza

129
00:10:41,970 --> 00:10:48,300
alcun wrapper expo, utilizzando ancora alcune delle API expo e pacchetti expo con l'aiuto di questo pacchetto

130
00:10:48,300 --> 00:10:53,640
unimodules che viene aggiunto e configurato automaticamente al flusso di lavoro nudo che abbiamo invece

131
00:10:53,700 --> 00:10:55,080
ottenuto con l'aiuto dell'espulsione.

132
00:10:55,080 --> 00:10:57,000
Quindi stanno succedendo un sacco di cose interessanti.