Quindi questa è stata una grande introduzione a React Native ed expo, ma trovo importante che tu capisca
con cosa stai lavorando prima di iniziare.
Ora, però, è ora di iniziare e, per questo, visitare expo. io. Lì puoi fare clic su
per iniziare e qui troverai i passaggi iniziali.
Ora non hai davvero bisogno di quel primo
passo, possiamo saltare direttamente al passaggio numero due che è che hai bisogno di NodeJS. Ora hai bisogno di NodeJS che è un runtime Javascript che ti
consente ad esempio di creare app lato server con Javascript. Non è necessario perché stiamo per scrivere
qualsiasi codice NodeJS in questo corso, non è
un corso
Node, non preoccuparti,
non è necessario conoscere NodeJS ma è un pacchetto che ci consente di eseguire Javascript sul nostro computer e per
esempio, il client expo dietro le quinte gira anche su
Javascript, non è totalmente correlato a React
Native, solo perché questo strumento funzioni correttamente.
Anche per questo comando di installare lo strumento, npm, è Node Package Manager
ed è anche reso disponibile da NodeJS.
Quindi il primo passo è che visiti nodejs. org e lì, scarica
l'ultima versione, nel mio caso 12. 6 da lì per iniziare e qualunque sia la tua ultima
versione quando la stai visualizzando, scarica semplicemente quella versione,
installala, ti dà un normale programma di installazione che puoi semplicemente percorrere facendo clic su tutti questi passaggi lì,
niente di troppo fantasioso.
È disponibile per MacOS e Windows e Linux.
Quindi basta scaricarlo qui, passare attraverso il programma di installazione e una volta installato, è possibile procedere a
questo terzo passaggio qui.
Quindi con NodeJS installato, copiamo quel comando qui e quindi apriamo il tuo normale terminale o su Windows,
il tuo prompt dei comandi e incolla quel comando qui.
Ora su Mac e Linux, potrebbe essere necessario aggiungere un sudo davanti a questo, su
Windows questo non sarà necessario, per ottenere le autorizzazioni giuste.
Quindi qui lo inserirò,
quindi ti potrebbe essere richiesta la password, semplicemente inseriscilo se lo sei e ora
questo installerà la CLI expo che è questo strumento che ci aiuta a creare e gestire progetti React
Native con l'aiuto di expo a livello globale sulla tua macchina, in modo che tu possa usarla da qualsiasi
parte della
tua macchina, così da qualsiasi parte del tuo terminale.
Quindi aspettiamo che l'installazione finisca, puoi
ignorare tutti gli avvisi tra cui potresti trovarti e tornerò al
termine dell'installazione.
Puoi anche ignorare questi errori intermedi qui, a condizione che il totale non si blocchi con un
errore ma finisca con un messaggio come questo
alla fine, hai avuto successo.
Quindi, con questo, abbiamo installato Expo CLI, il passo successivo è creare il nostro progetto, quindi il passo numero
quattro qui.
Facciamo questo eseguendo expo init
e quindi qualsiasi nome di progetto a tua scelta e per questo, prima di tutto assicurati di usare il comando cd per
navigare nella cartella qui sul tuo computer dove vuoi creare quel progetto. Quindi l'ho fatto qui, mi trovo in quella cartella
e ora posso eseguire expo init e chiamerò questa rn-first-app perché dopo tutto è
la nostra prima app React Native. Basta premere invio, quel nome ovviamente dipende totalmente da
te che hai
qui e questo creerà una nuova cartella nel luogo in cui hai eseguito questo comando e configurerai
lì un'app React Native usando expo.
Ora probabilmente ti viene chiesto quale modello vuoi usare e
lì puoi andare con il modello vuoto per ora.
Assicurati di non scegliere il minimo indispensabile perché sarebbe una configurazione senza l'ambiente expo con tutte
le funzionalità
di convenienza, quindi vai sicuramente qui.
Ora, probabilmente ti verrà chiesto di inserire un nome per la tua app e inserirò qui la prima app, che alla
fine
è il nome che viene visualizzato nel selettore di attività della tua app nella schermata principale
e presto.
Puoi lasciare la lumaca così com'è e semplicemente premere di nuovo
Invio, ora sto anche usando il filo sulla mia macchina, che è un'alternativa a npm, potresti non chiederti se vuoi
usare un filo che è totalmente
a posto, lo farò anche scegliere no
qui per usare npm e quindi ora, andrà avanti, creare questa cartella di progetto, installare tutte
le dipendenze richieste come React e React Native e darci un progetto React Native che possiamo usare per costruire un'app
nativa.
Quindi aspettiamo che questo finisca ora.
Ora, una volta terminato, vedi le prossime istruzioni qui. Puoi navigare nella cartella appena creata con
il comando cd e poi lì, semplicemente avviare npm start. Npm start avvierà ora lo strumento di sviluppo
di Expo, gli strumenti di sviluppo di Expo e una nuova scheda dovrebbe aprirsi nel tuo browser.
Ecco quella scheda che si è aperta, se ci sono problemi qui, puoi ignorare che
per ora, questo qui è lo strumento di sviluppo expo o gli strumenti di sviluppo expo come viene chiamato.
È una finestra che ti consente di eseguire la tua app su diversi dispositivi collegati o di aggiungere simulatori e ti consente
di gestire generalmente parti della tua app, vedi qui alcuni output dalla tua app, alcuni avvisi che
potresti ricevere e questo è
molto comodo finestra per la gestione dell'app e per l'esecuzione dell'app. Ora assicurati anche che qui
nel terminale in cui hai eseguito npm start, lascerai quel processo in esecuzione.
Potresti vedere che non è finito, non riesci a vedere quella riga di input in cui puoi inserire
i comandi, invece qui non puoi digitare o puoi premere alcune delle scorciatoie che vedi qui ma non puoi digitare
nuovi comandi.
Puoi sempre uscire da questo processo premendo control e c contemporaneamente, ma dovresti lasciare questo processo attivo
e funzionante per tutto il tempo in cui lavori al tuo
progetto e se hai finito per il giorno, puoi chiuderlo e riavviarlo il giorno successivo
perché questo processo controllerà anche il tuo codice e ogni volta che cambi qualcosa nel tuo codice
e salvi tale modifica, la salverà automaticamente e la pubblicherà sul tuo dispositivo connesso.
Ma a proposito di questo, connettiamo il dispositivo e, per quello, il modo più semplice per iniziare è
usare il tuo iPhone o telefono Android che possiedi.
Quindi nel mio caso, è un iPhone qui ed ecco il mio vero telefono e sono nell'App Store, ora è in tedesco perché ho un telefono
tedesco ma questo è il normale App Store. Ora lì, puoi
andare nell'area di ricerca e cercare expo. Ora, una volta che lo hai fatto, dovresti trovare quel client expo qui
e puoi semplicemente scaricarlo sul tuo dispositivo, è gratis da usare. Basta installarlo sul dispositivo e attendere il completamento dell'installazione
e, una volta terminato,
è possibile aprirlo e ora con
l'app expo installata, non è necessario registrarsi qui, invece su Android dovresti essere in grado per scansionare
quel codice a barre direttamente dall'app expo. Su iOS, apri semplicemente l'app della fotocamera
e poi puoi anche andare agli strumenti di sviluppo qui e vedrai quel codice a barre
qui, tieni semplicemente la fotocamera su quella su iOS o lo scanner dell'app expo qui su Android e dovresti essere richiesto se vuoi
aprire un'app in expo allora. Basta aprirlo lì e ora questo
dovrebbe aprire la tua app qui nel client expo che
hai installato, di nuovo senza registrarti, semplicemente tenendo la fotocamera del tuo iPhone sopra quel codice a barre
o su Android facendolo direttamente dall'app expo dove avrai quell'opzione per farlo.
Quindi ora questo creerà il bundle Javascript come vedi qui in basso o in altre
parole, questo ora prenderà la tua app e la compilerà sostanzialmente e la preparerà e poi la caricherà qui sui
server di Expo nella tua app e puoi semplicemente premere ottenuto qui nella prima schermata e quindi questa è la tua app
React Native iniziale.
E ora visualizziamo effettivamente il codice per questo e vediamo come possiamo cambiare qualcosa nel codice per vedere qualcosa
di diverso qui su questa schermata.