Nimic nu este mai bun decât crearea de aplicații cu JavaScript. Cu excepția cazului în care creați aplicații mobile. JavaScript este destinat construirii de aplicații web și utilizarea acestuia pentru a crea aplicații mobile native nu a fost posibilă. A fost greu pentru orice dezvoltator web să se scufunde în crearea de aplicații mobile native. Ei trebuie să învețe Java, sau Objective-C … sau orice limbaj de programare care a fost folosit în acest scop.

Adică până la Facebook Reactive native a spart această barieră. React Native vine cu avantaje mari, cum ar fi crearea de aplicații multiplataforma atât pentru Android cât și pentru IOS. Înainte de React Native, trebuia să vă scrieți codul de două ori – unul pentru Android și unul pentru IOS. Nu mai este cazul.

Acest articol este o introducere în lumea React Native, așa că pregătește-te?

De ce să reacționezi nativ?

Bine, deci de ce React native și nu orice altă tehnologie?

Ne oferă multe soluții pe care alte tehnologii nu și le pot permite. Iată ce puteți face cu React Native:

Crearea de aplicații mobile native

React Native ne permite să scriem aplicații native în JavaScript atât pentru iOS, cât și pentru Android. Ne oferă posibilitatea de a utiliza toate componentele native, cum ar fi gesturile, notificările push, camera și locația. Există și alte biblioteci JavaScript pentru a crea aplicații mobile precum ionic sau PhoneGap. Dar acele biblioteci folosesc Webview, iar aplicațiile construite cu aceste tehnologii nu sunt native.

Construirea de aplicații mobile pe mai multe platforme (iOS și Android)

Da, cu React Native puteți crea aplicații mobile care pot rula pe iOS și Android. Acesta este unul dintre marile beneficii ale React Native. Înainte ca Facebook să o creeze, trebuia să vă construiți aplicația de două ori și cu un cod diferit: unul pentru iOS folosind Swift sau Objective-C și unul pentru Android folosind Java sau Kotlin. React Native a rezolvat această problemă, astfel încât să puteți construi aplicația React Native și va funcționa în iOS și Android. Minunat! ?

Scrieți codul totul în JavaScript și React

În timp ce creați aplicații React Native, veți scrie de fapt JavaScript. Reactjs codul ne permite să construim UI excelente și componente pentru experiența utilizatorului.

Noțiuni introductive despre react-native

Începând cu react-native poate fi interesant, dar în același timp poate fi puțin confuz. Primul pas este instalarea acestuia și există mai multe moduri de a face acest lucru:

Utilizarea expo-cli:

expo-cli este un instrument de linie de comandă. Descarcă și instalează cazanul React Native pentru dvs., integrat cu expo API (verificați aici pentru ghidul de instalare). Este un mod ușor de a construi o aplicație React Native și este modul recomandat dacă tocmai ați început cu React Native.

expo-cli vă oferă multe opțiuni. Puteți rula și testa aplicația pe un dispozitiv mobil fără nicio configurație. Scanați un cod QR și aplicația dvs. se va deschide cu aplicația mobilă expo. Puteți explora alte aplicații mobile create cu React Native pe browser, printr-o interfață web numită apreciază!

Folosind react-native-cli

React-native-cli face aceeași treabă ca și expo-cli, dar cu o abordare diferită și avantaje suplimentare. Aplicațiile care sunt instalate cu react-native-cli ne oferă opțiunea și capacitatea de a crea propriile module native în aplicația noastră. Nu trebuie să vă scoateți aplicația pentru a putea crea module native. Ejectarea te face capabil să folosești module native și să scrii pe tine (vom explora cum să scriem module native într-o altă parte).

Dezvoltarea aplicațiilor React Native pe diferite platforme este un proces diferit. Uneori avem nevoie de o anumită configurație pentru o anumită platformă. De exemplu, pentru a construi pentru Android, trebuie să utilizați SDK-ul Android, așa că hai să explorăm cum funcționează acest lucru!

Crearea de aplicații mobile pentru Android

Există câteva cerințe pe care trebuie să le instalați pentru a începe să dezvoltați pentru Android. În primul rând, trebuie să descărcați și să configurați atât SDK Android cât și Android Studio. Le puteți descărca cu acest link Aici.

După descărcarea Android Studio, trebuie să instalați și câteva API-uri. Pentru aceasta deschideți Android Studio, apoi faceți clic pe fila Setări, se va deschide această fereastră:

Ce trebuie sa stiti pentru a incepe sa creati aplicatii

Mai întâi, verificați ✔️ platforma pe care doriți să o susțină reactivul nat în fila Platforme SDK (de exemplu Android 6.0 Marshmallow). Apoi treceți la instrumentele SDK.

1611941648 147 Ce trebuie sa stiti pentru a incepe sa creati aplicatii
faceți clic pe imagine pentru a o vedea clar

Și verifică Android SDK Build-Tools, Android SDK tools, și google play service. Sub Android SDK Build-Tools, selectați toate platformele:

  • Începând cu 19.0.0 până la 20.0.0
  • De la 22.0.0 la 24.0.0
  • Și 25.0.2, 26.0.1 la 26.0.3
  • 27.0.3 și 28.0.1 – 28.02
1611941648 923 Ce trebuie sa stiti pentru a incepe sa creati aplicatii

Acum am terminat cu SDK și Android Studio. Următorul pas este emulatorul. Emulatorul (sau simulatorul) este locul unde trebuie să rulăm și să testăm aplicația noastră. Există multe alegeri diferite.

Puteți utiliza emulatoare Android Studio. Verificați aici cum să creați un emulator de utilizat pe Android Studio. Sincer nu le-am folosit niciodată. eu prefer Genimație sau un dispozitiv real în schimb.

Genimație

Genimație este o aplicație desktop care oferă un emulator virtual pentru a vă testa aplicația. Îmi place să-l folosesc foarte mult pentru că este rapid. ? Vă oferă opțiuni pentru a crea un telefon personalizat cu funcțiile pe care le puteți găsi pe orice dispozitiv real. De exemplu, activați Wifi, locația și camera. Vă recomand cu drag să utilizați Gdușmănie peste emulatoarele Android Studio sau orice alt emulator.

Folosind dispozitive reale

Nimic nu este mai bun decât utilizarea dispozitivelor reale pentru a vă rula și testa aplicația. Acest lucru se datorează faptului că vă permite să știți cum arată aplicația dvs. pe un dispozitiv real. Te face să simți realitatea muncii tale într-un mod pe care dispozitivul virtual nu îl dă. Deci, dacă aveți capacitatea de a utiliza un dispozitiv, nu ezitați.

Până în prezent, suntem în regulă cu Android – dar ce rămâne cu iOS?

Crearea de aplicații native pentru IOS

Rularea React Native pentru iOS nu arată mult diferit de Android. Aceeași aplicație React Native care rulează în Android poate rula și pe iOS, cu unele excepții.

De exemplu, dacă doriți să rulați pe un dispozitiv iOS, trebuie să aveți un MacOS. Vorbind despre MacOS și iOS, nu este nevoie să descărcați dependențe suplimentare, cum ar fi SDK-ul pentru Android, pentru a rula React Native pe iOS.

În ceea ce privește emulatoarele, Xcode are emulatoare frumoase pe care le puteți folosi pentru a testa aplicația React Native. Puteți verifica această postare care arată câteva trucuri de folosit cu Emulatoare.

Ce trebuie sa stiti pentru a incepe sa creati aplicatii
appcoda credit de imagine

În MacOS puteți rula atât iOS cât și Android. Puteți instala cu siguranță Android Studio și Genymotion pe MacOS. Această posibilitate nu există pe un PC unde puteți rula doar emulatorul Android, dar nu și un emulator iOS. Deci, ești norocos dacă ai un MacOS – bucură-te?

Deci, acum avem mediul pentru a construi o aplicație React Native și am instalat totul, dar cum este scris codul React Native? Este atât de simplu: de fapt vei scrie Reactjs cod.

Puteți verifica ghidul oficial pentru a practica ceva cu React Native. Vă recomand acest articol minunat pentru a începe „Reactionați replicile native pentru YouTube.”Vă va ghida pas cu pas pentru a crea prima aplicație React Native.

Wow! Până acum sunteți bine și codificați cu react-native. ? Dar trebuie să verificați și să depanați erorile și să vedeți jurnalele codului dvs. Daeah busteni !! Deci avem nevoie de un debugger! Cum depanezi cu React Native?

Depanare reactivă-nativă

Depanarea codului dvs. este foarte importantă, nu doar cu React Native, ci cu orice alt limbaj de programare. Deci, în codul tău React Native, trebuie să știi ce se întâmplă. Există multe modalități diferite de a depana o aplicație React Native, cum ar fi:

Depanare cu devtools Chrome

React Native vă oferă opțiunea de a utiliza instrumente Chrome pentru a vedea jurnalele aplicației dvs. Pentru a depana cu Chrome și a activa modul de depanare în emulatorul dvs., pe tastatură trebuie doar să faceți clic Ctrl+ m.

Acest ecran va apărea:

1611941648 931 Ce trebuie sa stiti pentru a incepe sa creati aplicatii

Și apoi alegeți Debug Js Remotely. Aceasta va deschide o filă în Google Chrome cu această adresă http://localhost:8081/debugger-ui/. Asta pentru a folosi devtools Chrome, ce zici de alte opțiuni?

Folosind React-native-debugger

1611941649 76 Ce trebuie sa stiti pentru a incepe sa creati aplicatii
credit react-native-debugger

React-native-debugger este un instrument excelent pentru a depana codul React Native. Este o aplicație desktop care vă oferă multe avantaje. Vine cu devtools Redux și integrarea React-devtools. Puteți depana și stilul. Este de fapt cel mai bun depanator pentru React Native și este cel pe care îl folosesc. De obicei, este disponibil pe MacOS, Windows și Linux. Verifică ghidul de instalare și integrare.

Cred că este suficient în acest moment. Aceasta este prima parte a ghidului absolut pentru crearea de aplicații mobile cu React Native. În partea următoare ne vom scufunda în sfaturi și aspecte mai tehnice, cum ar fi modul în care putem folosi componente native, React native API, integrarea cu alte biblioteci, Redux, GraphQL și altele de genul acesta. Deci, abonați-vă la acest lucru mail-list să rămâneți la curent când va apărea următoarea parte. Multumesc pentru timpul acordat. ?

Mă poți găsi întotdeauna pe Stare de nervozitate ?