apeescape2.com
  • Pagrindinis
  • Tendencijos
  • Procesas Ir Įrankiai
  • Paskirstytos Komandos
  • Projektavimo Procesas
Technologija

„Cordova“ karkasai: joninis prieš pagrindą

Šiais laikais interneto kūrėjai valdo pasaulį. „JavaScript“ yra naudojamas visur, kur galima programuoti. Tarp šių sričių mobiliųjų programų kūrimas buvo vienas iš pirmųjų būdų išsišakoti: maždaug prieš dešimt metų „PhoneGap“ leido įdiegti HTML ir „JavaScript“ programas „iOS“ ir „Android“.

Nuo to laiko ši technologija turėjo savo pakilimų ir nuosmukių: nepaisant paprasto kūrimo, šios programos akivaizdžiai skyrėsi nuo vietinių. „Vanilla HTML“ ir naršyklės „JavaScript“ buvo nukreipti į naršykles, ir jiems nebuvo jokios galimybės nepriekaištingai pereiti į šį naują lauką.



Iki šiol pagrindiniai klausimai vis dar yra:



  • Sunkumai laikantis vietinio dizaino ir animacijos
  • Kompleksiniai ekrano perėjimo efektai
  • Palieskite įvykių tvarkymą
  • Pasirodymas dideliuose sąrašuose
  • Fiksuotų elementų išdėstymas
  • Prisitaikymas prie skirtingų dydžių ekrano
  • Vietinių valdymo elementų vietos (pvz., „IOS“ būsenos juosta)
  • Prisitaikymas prie skirtingų mobiliųjų naršyklių

Kodėl verta naudoti „Cordova“ programų sistemą?

Cordova technologijos dažnai neįvertinamos dėl anksčiau minėtų problemų turinčių programų. „Frameworks“ siekia jas kompensuoti ir priartinti HTML programas kuo artimesnėms vietinėms programoms tiek dizaino, tiek našumo požiūriu.

Pažvelkime į keletą hibridinių programų pavyzdžių. Jie sukurti naudojant dvi šiuo metu sėkmingiausias sistemas, be „Onsen“ vartotojo sąsajos, kurios palengvins žiniatinklio kūrėjų plėtrą šiuolaikiniame pasaulyje: „Framework7“ ir „Ionic“.



Apie jonų sistemą

„Ionic“ sukūrė „Drifty Co.“ 2012 m. Ir yra pagrįstas „Angular“. Nuo tada ji buvo aktyviai kuriama, sulaukė didelių investicijų ir stiprios kūrėjų bendruomenės. Oficiali svetainė teigia, kad ja remiantis buvo sukurta milijonai programų.

Šio straipsnio rašymo metu naujausia versija yra „Ionic 3“, pagrįsta „Angular 5“. „Ionic 4“, kuria siekiama lankstumo ir nepriklausomybės nuo „Angular“, yra ankstyvosios beta versijos.

Be UI variklio, nuostabu komponentų biblioteka ir sąsaja, leidžianti pasiekti vietinio įrenginio funkcijas, „Ionic“ siūlo keletą papildomų galimybių, paslaugų ir komunalinių paslaugų.



Joninis CLI

„Ionic“ komandinės eilutės sąsaja naudojama interaktyviam projekto inicijavimui (t. Y. Vedliui), puslapių ir komponentų generavimui bei kūrimo serverio paleidimui, leidžiančiam kurti programas kelyje ir tiesiogiai jas perkrauti. Tai taip pat teikia integraciją su „Ionic cloud“ paslaugomis.

Laboratorija ir „DevApp“

„Lab“ yra nepaprastai naudinga mini paslauga, leidžianti „Ionic“ kūrėjo naršyklėje imituoti programos darbą skirtingose ​​platformose. „DevApp“ padeda greitai įdiegti programą realiame įrenginyje.

Pakavimas, diegimas ir stebėjimas

„Ionic“ tiekia daugybę interneto paslaugų, kurios supaprastina ir pagreitina bandytojų ir vartotojų programų kūrimą, derinimą, testavimą ir atnaujinimą.

Vis dėlto Joniko planai dažnai keičiasi. Kai kurios anksčiau egzistavusios paslaugos, tokios kaip „Auth“, „Push“, „Analytics“ ir „View“, buvo uždarytos, todėl abonentai sukėlė pasipiktinimą.

Kūrėjas

Tai yra „Ionic“ grafinis redaktorius, skirtas kurti funkcines sąsajas.

Apie „Framework7“

Šią sistemą 2014 m. Sukūrė Rusijos studija „iDangero“. Galų gale vienas kūrėjas dirbo prie projekto, neįtraukdamas kelių nedidelių bendradarbių į „GitHub“ saugyklą.

Iš pradžių „Framework7“ sudarė vartotojo sąsajos komponentų rinkinys, sukurtas tada neseniai išleisto „iOS 7“ stiliaus, nuo kurio jis gavo savo pavadinimą. Vėliau buvo pridėta „Android“ tema ir abi temos buvo atnaujintos naujausiems „iOS“ ir „Material Design“.

Neseniai projekto plėtra įsibėgėjo ir jis išplito iš komponentų rinkinio į visavertę mobiliųjų programų sistemą, integruodamas populiarias technologijas ir įrankius.

„Framework7“ palaikymas ir pavyzdžiai naudojant „Vue.js“ egzistuoja nuo v1, o „v3“ taip pat palaiko „React“. Tai gali leisti projektui rimtai konkuruoti su populiaresniu „Ionic“, kuris siūlo tik „Angular“ ir „TypeScript“.

Diegimas ir pirmasis paleidimas

Joninis

Norėdami pradėti dirbti su „Ionic“, įdiekite jį naudodami „NPM“:

npm install -g ionic

Tada pasirinkite būsimos programos šabloną. Oficiali „Ionic“ svetainė siūlo kelis šablonus arba galite pasirinkti tuščią šabloną, kad sukurtumėte programą nuo pat pradžių naudodami ionic start myApp blank

Pasirinkime paprastą dizainą. Vykdykite šią komandą:

ionic start Todo tabs

Atsakymas „Taip“ kai montuotojas paklaus „Ar norėtumėte integruoti savo naują programą su„ Cordova “, kad taikytumėte į„ iOS “ir„ Android “?“ Tai automatiškai integruos programą su „Cordova“ ir paruoš ją diegti mobiliose platformose.

Kitame etape diegimo programa pasiūlys mus prijungti prie „Ionic Pro SDK“. Atsakymas „Ne“ kol kas, kad pavyzdys būtų paprastas.

Įdiekite papildomą @ionic/lab paketą, kad gautumėte patogų derinimo NS - naršyklės „iOS“, „Android“ ir „Windows“ įrenginių imitacijos:

cd Todo npm i --save-dev @ionic/lab

Dabar galite paleisti programą derinimo režimu. Tai leidžia jums kurti ir derinti programą tiesiogiai žiniatinklio naršyklėje:

ionic lab

Todėl gausite keletą naudingų adresų:

c / c ++

„Ionic Lab“ derinimo paslauga yra paleista 8200 prievade. Pati programa veikia 8100 prievade ir Atidaryti viso ekrano režimą nuoroda iš „Ionic Lab“ veda ten. Naršyklės langas su veikiančia „Ionic Lab“ atidaromas automatiškai.

Derinimo „Ionic Lab“ vartotojo sąsaja, rodanti „iOS“ ir „Android“ modeliavimus

Be to, „Ionic“ programoje nurodo programos adresą vietinis tinklas . Tai nepaprastai naudinga, nes leidžia atidaryti programą mobiliojo įrenginio naršyklėje, jei tik įrenginys yra vietiniame tinkle (pavyzdžiui, per „Wi-Fi“). Be to, galite naudoti Pridėti prie pagrindinio ekrano mygtuką, kad vėl atidarytumėte programą viso ekrano režimu. Tai greičiausias būdas išbandyti programą įrenginyje.

Kitas būdas yra „Ionic DevApp“ programa , kurią galima įdiegti mobiliajame įrenginyje ir kuri suteikia prieigą prie programos per vietinį tinklą. Jis siūlo papildinių palaikymą („Ionic Native“), kad būtų galima pasiekti vietinio įrenginio funkcijas ir rodyti žurnalus.

Pagrindai7

F7 kūrimo įrankiai yra mažiau pažengę nei „Ionic“, o automatinio inicijavimo CLI nėra dokumentuota. Tačiau oficiali svetainė numato kelios „GitHub“ saugyklos su šabloniniais projektais tai padės pradėti kurti.

Panašus į Skirtukai šablonas „Ionic“, F7 pasiūlymuose Vaizdai su skirtukais , bet naudosime funkcionalesnį šabloną, kuris integruos „Framework7“ su „React“. Parama „React“ buvo pridėta 3 versijoje. Tam klonuokite šablonų saugyklą:

git clone https://github.com/framework7io/framework7-template-react.git Todo

Perjunkite į projekto aplanką, gaukite priklausomybes ir pradėkite procesą:

cd Todo npm install npm start

Vykdymo rezultatai yra panašūs į „Ionic“: Jūs gaunate vietinę nuorodą ir nuorodą savo tinkle, kad galėtumėte tiesiogiai pasiekti iš realaus įrenginio:

Dabar galite atidaryti http://localhost:3000/ naršyklėje. „Framework7“ neapima įmontuotų įrenginių emuliatorių, todėl naudokime „Chrome DevTools“ įrenginio režimas gauti panašų rezultatą:

„Framework7“ programa, veikianti „Chrome DevTools“

Kaip matote, „Framework7“ yra panašus į „Ionic“, nes jame yra dvi „iOS“ ir „Material Design“ temos. Tema parenkama pagal platformą.

Deja, skirtingai nei panašus šabloną su „Vue.js“ palaikymu oficialiuose „React“ šablonuose „Webpack“ dar neįdiegta, ir tai draudžia naudoti „Hot Module Replacement“, kad greitai atnaujintume programas neperkraunant puslapio. Vis tiek galite naudoti numatytąją tiesioginio perkrovimo funkciją, kuri iš naujo įkelia puslapį, kai keičiate šaltinio kodą.

„Cordova“ įrengimas

Norėdami įdiegti programas įrenginiuose ir emuliatoriuose naudodami „Cordova“, turite atsisiųsti ir nustatyti „iOS“ ir „Android“ kūrimo įrankius, taip pat „Cordova“ CLI. Daugiau apie tai galite perskaityti mūsų puslapyje ankstesnis straipsnis ir oficialioje „Cordova“ svetainėje „iOS“ platformos vadovas ir „Android“ platformos vadovas skyriai.

Joninis

Patirtis rodo, kad norint sėkmingai išspręsti daugumą „Ionic“ problemų, pakanka derinti su naršykle, retkarčiais tikrinant tikrus įrenginius.

Nepaisant to, kad sutinkate su „iOS“ ir „Android“ integravimu, o „Ionic“ paruošia reikiamus parametrus config.xml failas ir šaltiniai resources aplanką, vis tiek turite prijungti abi platformas prie programos naudodami „Cordova“:

cordova platform add ios cordova platform add android

Dabar galite paleisti „Cordova“ programą „tikruose“ emuliatoriuose, įdiegti ją į mobilųjį įrenginį ir net nusiųsti į „App Store“ ir „Google Play“.

Kita komanda įdiegia programą į „iOS“ įrenginį, jei ji prijungta per USB. Priešingu atveju programa bus įdiegta „iOS Simulator“.

cordova run ios

Labiausiai tikėtina, kad „Xcode“ komandų eilutės įrankiai informuos jus apie būtinybę nustatyti kūrėjo sertifikatus. Turėsite atidaryti projektą „Xcode“ ir atlikti reikiamus veiksmus. Tai reikia padaryti tik vieną kartą, o vėliau galėsite paleisti programą naudodami „Cordova“ CLI.

Kartais „iOS Simulator“ nepaleidžiama automatiškai. Tokiu atveju paleiskite jį rankiniu būdu, pavyzdžiui, per „Spotlight“.

„Android“ emuliatorių galima paleisti panašiai:

cordova run android

„iOS“ ir „Android“ emuliatoriai su „Cordova“ programa, įdiegta pagal „Ionic“

Atkreipkite dėmesį, kad cordova run komanda paleidžia ir įdiegia jau surinkta programa, kuri nenaudoja ionic serve / ionic lab serverio, todėl „Live Reload“ neveiks. Norėdami kurti ir derinti programą tiesiogiai, naudokite naršyklę vietiniame tinkle arba įdiekite „Ionic DevApp“ programą.

Patirtis rodo, kad norint sėkmingai išspręsti daugumą „Ionic“ problemų, pakanka derinti su naršykle, retkarčiais tikrinant tikrus įrenginius.

Pagrindai7

Anksčiau pasirinktas „React“ Framework7 šablonas nesuteikia „Cordova“ sąrankos automatizavimo, todėl platformas turėsite pridėti rankiniu būdu. Sukurkite „Cordova“ projektą aplanke cordova projekto aplanko poaplankis:

cordova create cordova/ com.example.todo Todo cd cordova/ cordova platform add ios cordova platform add android cd ../

Šablonas pagrįstas Sukurkite „React“ programą , todėl norėdami paleisti kompiliuotą projektą „Cordova“ aplinkoje, turite pridėti 'homepage': '.' nustatymas į ./package.json failą. Šį failą galima rasti projekto šakniniame lygyje:

Nustatymas, reikalingas tinkamai „Cordova“ kompiliuoti

Sudarykite „Framework7“ projektą ir nukopijuokite rezultatą į „Cordova“ projektą:

npm run build rm -rf cordova/www/* cp -r build/* cordova/www/

Dabar galite paleisti programą įrenginyje ar emuliatoriuje:

cd cordova/ cordova run ios

„iOS“ ir „Android“ emuliatoriai su įdiegta „Framework7“ pagrindu sukurta „Cordova“ programa


Su tavimi baigta! Tikėkimės, kad „Framework7“ atitiks „Ionic“ kūrimo standartą ir pradinį sąrankos patogumą.

Kurti užduočių sąrašus

Joninis

Pagaliau pradėkime kurti programą! Kadangi tai yra „To Do“ programa, pagrindiniame puslapyje (src/pages/home/home.html faile) bus pateikiamas užduočių sąrašas su galimybe „pažymėti kaip baigtą“ ir „pridėti naują“.

„Ionic“ siūlo komponentus ir sąrašus. Pirmiausia pašalinkite padding nuosavybę nuo elemento, kad sąrašas būtų rodomas visame ekrane. Sąraše įdėkite tekstą naudodami elementą ir pridėkite priedą, kad pažymėtumėte atliktas užduotis.

Hello ApeeScape Blog

Grįžkite į naršyklės skirtuką, kai veikia „Ionic Lab“ paslauga. Programa buvo atnaujinta automatiškai:

Mūsų statinis „To Do List“ išdėstymo testas imituojamas per „Ionic Lab“ „Android“ ir „iOS“ režimais

Puiku! Dabar perkelkite užduoties duomenis į JS objektą ir nustatykite jo HTML pateiktį naudodami kampinį. Eikite į src/pages/home/home.ts failą ir sukurkite HomePage ypatybių užduotis klasės egzempliorius:

export class HomePage { tasks = [{ name: 'Hello' }, { name: 'ApeeScape' }, { name: 'Blog' }]; constructor() { } }

Dabar galite kreiptis į tasks masyvas HTML kode. Naudokite *ngFor Kampinis konstravimas iteratyviai sukuria sąrašo elementus kiekvienam masyvo elementui. Kodas tampa mažesnis:

{{task.name}}

Liko tik pridėti mygtuką, kad sukurtumėte naujas užduotis į puslapio antraštę. Norėdami tai padaryti, naudokite ,,, andcomponents:

To Do List

Atkreipkite dėmesį į (click)='addTask()' Kampinė konstrukcija. Kaip jūs galite atspėti, jis prideda čiaupo tvarkytuvą prie mygtuko ir iškviečia addTask() mūsų komponento metodas. Įdiegime šį metodą, kad atidarytume užduoties pavadinimo dialogo langą, kai paliečiamas mygtukas.

Tam jums reikia AlertController Joninis komponentas. Norėdami naudoti šį komponentą, importuokite jo tipą:

import { AlertController } from 'ionic-angular';

Ir nurodykite jį konstruktoriaus parametrų sąraše puslapyje:

constructor(public alertCtrl: AlertController) { }

Dabar galite tai paskambinti addTask() metodas. Nustatykite jį po valdiklio. Galite sukurti ir rodyti dialogo langą su šiais skambučiais:

this.alertCtrl .create(/* options */) .present();

Nurodykite pranešimo antraštę, lauko aprašymą ir du mygtukus options objektas. Mygtukas „Gerai“ pridės naują užduotį prie tasks masyvas:

handler: (inputs) => { this.tasks.push({ name: inputs.name }); }

Pridėjus elementą prie masyvo this.tasks, komponentas bus reaktyviai atstatytas ir sąraše bus rodoma nauja užduotis.

vieneto testavimas c # pavyzdys

Visas puslapio kodas dabar atrodo taip:

import { Component } from '@angular/core'; import { AlertController } from 'ionic-angular'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { tasks = [{ name: 'Hello' }, { name: 'ApeeScape' }, { name: 'Blog' }]; constructor(public alertCtrl: AlertController) { } addTask() { this.alertCtrl .create({ title: 'Add Task', inputs: [ { name: 'name', placeholder: 'Task' } ], buttons: [ { text: 'Cancel', role: 'cancel' }, { text: 'Add', handler: ({ name }) => { this.tasks.push({ name }); } } ] }) .present(); } }

„To To Do“ programa, imituojama per „Ionic Lab“ „Android“ ir „iOS“ režimais

Iš naujo įdiekite programą įrenginyje:

cordova run ios

Viskas! Ne taip sunku, ar ne? Dabar pabandykime padaryti tą patį su „Framework7“.

Pagrindai7

„Framework7“ šablonai sukurti norint parodyti visas komponentų galimybes, todėl jums reikia palikti tik src/components/pages/HomePage.jsx puslapis src/components/App.jsx ir src/routes.js failus, išvalykite jo turinį ir pašalinkite papildomus kodo komentarus.

Dabar sukurkite užduočių sąrašą. „Framework7“ teikia ir komponentai už tai. Norėdami įdėti užduoties užbaigimo jungiklį į jį, pridėkite komponentą. Nepamirškite importuoti visų šių komponentų iš framework7-react modulis. Dabar puslapio kodas atrodo taip:

import React from 'react'; import { Page, Navbar, NavTitle, List, ListItem, Toggle } from 'framework7-react'; export default () => ( To Do List );

Pati programa atrodo taip:

Mūsų statinis „To Do List“ išdėstymo testas, vykdomas „Framework7“, kurį „Android“ ir „iOS“ režimais imituoja „Chrome DevTools“

Gana gera pradžia. Pabandykime dar kartą perkelti statinius duomenis iš HTML kodo. Tam naudokite išmanųjį komponentą, o ne tą, kurį turėjome be pilietybės. Importuoti Component abstrakti „React“ klasė:

import React, { Component } from 'react';

Užrašykite užduočių masyvą į state kintamasis egzempliorius:

export default class HomePage extends Component { state = { tasks: [{ name: 'Hello' }, { name: 'ApeeScape' }, { name: 'Blog' }] }; /* ... */ }

Tikroji programa greičiausiai naudos abstraktesnį duomenų srautą, pvz., Su „Redux“ ar „MobX“, tačiau nedidelį pavyzdį išlaikysime vidinio komponento būseną.

Dabar galite naudoti JSX sintaksę, kad pakartotinai sukurtumėte sąrašo elementus kiekvienai masyvo užduočiai:

{this.state.tasks.map((task, i) => ( ))}

Liko tik pridėti antraštę su mygtuku ir vėl sukurti naują užduotį. Elementas jau yra, todėl pridėkite jį:

To Do List

„React“ galite pridėti čiaupų tvarkytuvus naudodami onClick ypatybė ir joje nustatomas atgalinio žymeklio rodiklis. Įdiekite tvarkyklę, kad būtų rodomas užduoties pavadinimo dialogo langas.

Kiekvienas „Framework7“ elementas turi prieigą prie programos egzemplioriaus per this.$f7 nuosavybė. Galite naudoti dialog.prompt() tokiu būdu. Prieš uždarydami dialogo langą, paskambinkite setState() „React“ komponento metodą ir perduoti jam ankstesnio masyvo kopiją su nauju elementu. Tai reaktyviai atnaujins sąrašą.

addTask = () => { this.$f7.dialog.prompt('Task Name:', 'Add Task', (name) => { this.setState({ tasks: [ ...this.state.tasks, { name } ] }); }); };

Čia yra visas komponento kodas:

import React, { Component } from 'react'; import { Page, Navbar, NavTitle, NavRight, Link, List, ListItem, Toggle } from 'framework7-react'; export default class HomePage extends Component { state = { tasks: [{ name: 'Hello' }, { name: 'ApeeScape' }, { name: 'Blog' }] }; addTask = () => { this.$f7.dialog.prompt('Task Name:', 'Add Task', (name) => { this.setState({ tasks: [ ...this.state.tasks, { name } ] }); }); }; render = () => ( To Do List {this.state.tasks.map((task, i) => ( ))} ); }

Patikrinkite rezultatą:

„To To Do“ programa, veikianti per „Framework7“, kurią „Android“ ir „iOS“ režimais imituoja „Chrome DevTools“

Liko tik atstatyti ir įdiegti įrenginį:

kintamieji klasės pitone
npm run build rm -rf cordova/www/* cp -r build/* cordova/www/ cd cordova/ cordova run ios

Padaryta!


Galutinį abiejų šių projektų kodą galite rasti „GitHub“:

  • joninis-todo-app
  • framework7-reaguoti-todo-app

Rezultatai

Dabar jūs pamatėte visą mokymo programą su kiekviena „Cordova“ sistema. Kaip „Framework7“ susiduria su joninėmis?

Pradiniai nustatymai

„Ionic“ yra daug lengviau įdiegti dėl savo CLI, o „F7“ reikia daugiau laiko, norint pasirinkti ir nustatyti šabloną arba įdiegti žingsnis po žingsnio.

Komponentų įvairovė

Abiejose sistemose yra visas nuostabiai sukurtų standartinių komponentų rinkinys dviem temomis: „iOS“ ir „Material Design“. „Ionic“ papildomai pateikia šiuos komponentus „Windows“ temoje ir gigantišką vartotojo temos turgavietėje.

Be to, kad visiškai imituojamas vietinis dizainas ir animacijos, didelis dėmesys skiriamas našumo optimizavimui, suteikiant fantastiškų rezultatų: dažnai beveik neįmanoma atskirti bet kurios sistemos programų nuo vietinių.

„Framework7“ pateikia papildomą sudėtingesnių ir naudingesnių komponentų, tokių kaip „Smart Select“ , Automatinis užbaigimas , Kalendorius , Kontaktų sąrašas , Prisijungimo ekranas , Žinutės ir Nuotraukų naršyklė . Kita vertus, „Ionic“ teikia didžiulį pasirinkimą vartotojo sukurti komponentai .

Ekosistema ir bendruomenė

Ionicas akivaizdžiai laimi šiuos parametrus dėl ilgesnio gyvenimo trukmės, tvirto finansinio palaikymo ir aktyvios bendruomenės. Joninė infrastruktūra nuolat tobulėja: palaikančios paslaugos ir debesų sprendimai užleidžia vietą naujoms, o papildinių skaičius vis auga.

„Framework7“ yra geresnis nei bet kada, tačiau labai trūksta bendruomenės palaikymo.

Trečiųjų šalių priklausomybės

„Framework7“ yra lankstesnė sprendžiant trečiųjų šalių sprendimus. Didžiausia jo stiprybė yra galimybė pasirinkti, jei projekte naudojate „Vue“ ar „React“, taip pat „Webpack“ ar „Browserify“. Joninis yra pagrįstas kampiniu ir reikalauja žinių apie jį (taigi ir „TypeScript“).

Tačiau neseniai „Ionic“ kūrėjai paskelbė apie naują „Ionic 4“ beta versiją , teigdamas, kad yra visiškai vartotojo sąsajos-agnostikas - nebereikia kampinių priklausomybių, jei jų nenorite.

„Cordova“ struktūros: vis dar galingas kelias platformų mobiliųjų programų kūrimo būdas

Ar naudoti „Cordova“, priklauso nuo konkretaus projekto. Iš tiesų, hibridinių mobiliųjų programų kūrimo greitis ir kelių platformų palaikymas yra pagrindiniai jo pranašumai. Bet tai visada yra kompromisas, ir kartais galite susidurti su kai kuriais trūkumais, kurių nebūtų, jei būtų įprastas požiūris. Šios nuostabios struktūros ir jų bendruomenės puikiai dirba, kad sumažintų tuos trūkumus ir palengvintų mūsų gyvenimą. Taigi, kodėl neišbandžius jų?

Susijęs: Dvikova: „React Native vs. Cordova“

Suprasti pagrindus

Kas yra Cordova?

„Cordova“ supakuoja žiniatinklio programas į vietinius konteinerius, kad galėtų jas paleisti įvairiose mobiliose platformose. Programa įkeliama „žiniatinklio rodinyje“ - tam tikroje viso ekrano naršyklėje mobiliesiems. Tai taip pat suteikia sąsają tarp JS ir vietinio kodo, kad būtų galima pasiekti vietinį API: tokios įrenginio funkcijos kaip „push“ pranešimai ir prieiga prie kameros.

Kas yra „PhoneGap“?

„PhoneGap“ yra originalus technologijos pavadinimas, vėliau prisidedantis prie atvirojo kodo bendruomenės ir pavadintas Apache Cordova. Šiais laikais pats „PhoneGap“ yra „Adobe“ priklausantis projektas, kuris yra CLI, GUI ir debesų įrankių rinkinys, teikiantis naudingas paslaugas „Cordova“ mobiliųjų programų kūrėjams.

Kas yra „Onsen“ vartotojo sąsaja?

„Onsen“ vartotojo sąsaja yra HTML ir „JavaScript“ sistema, teikianti vartotojo sąsajos komponentų rinkinį, imituojantį natūralią „iOS“ ir „Android“ platformų išvaizdą. Jis derinamas su „Monaca“ - įrankių rinkiniu, padedančiu kurti hibridinių mobiliųjų programėlių ciklą.

Kas yra joninis?

„Ionic“ yra vartotojo sąsajos sistema, pagrįsta „Angular“, teikianti įvairių temų mobiliųjų sąsajų komponentų rinkinį, įskaitant „iOS“, „Material Design“ ir „Windows Platform“. Panašiai kaip „PhoneGap“, jame taip pat pateikiamos įvairios papildomos funkcijos ir paslaugos, padedančios kurti hibridines mobilias programas, jas išbandyti ir pristatyti.

Kas yra „Framework7“?

„Framework7“ naudojama hibridinėms programoms mobiliesiems kurti. Tai vartotojo sąsajos komponentų rinkinys, vaizduojantis „iOS“ ir „Material Design“ stiliaus vadovus. Jis turi keletą įdiegimų, pagrįstų populiariausių „front-end“ sistemų, tokių kaip „React“ ir „Vue“, viršuje.

Kas yra gimtoji programa?

Savoji programa yra sukurta konkrečiai mobiliajai platformai, naudojant savąjį SDK ir kūrimo kaminą. Pvz., Vietinė „iOS“ programa būtų sukurta naudojant „Swift“ arba „Objective-C“, o „Android“ - „Kotlin“ ar „Java“.

Kas yra hibridinė mobilioji programa?

Hibridinė mobilioji programa sukurta naudojant vietinio mobiliojo SDK ir kai kurių kitų technologijų paketų, pvz., HTML ir „JavaScript“, derinį. Hibridines programas kuriančios technologijos yra „Cordova“, „Xamarin“, „React Native“ ir „Native Script“, be daugelio kitų.

Įmonių klientų aptarnavimo direktorius, ryšių, žiniasklaidos, pramogų ir technologijų direktorius

Kita

Įmonių klientų aptarnavimo direktorius, ryšių, žiniasklaidos, pramogų ir technologijų direktorius
Projektavimas žmogaus elgesiui: neapčiuopiamojo apibrėžimas

Projektavimas žmogaus elgesiui: neapčiuopiamojo apibrėžimas

„Ux Design“

Populiarios Temos
10 patarimų, kaip sklandžiai palaikyti „WordPress“ priežiūrą
10 patarimų, kaip sklandžiai palaikyti „WordPress“ priežiūrą
Node.js / TypeScript REST API kūrimas, 2 dalis: modeliai, tarpinė programinė įranga ir paslaugos
Node.js / TypeScript REST API kūrimas, 2 dalis: modeliai, tarpinė programinė įranga ir paslaugos
Rubino metaprogramavimas yra dar šaunesnis nei skamba
Rubino metaprogramavimas yra dar šaunesnis nei skamba
Patobulintas kokybės užtikrinimo testavimas - vartotojo srauto pamoka
Patobulintas kokybės užtikrinimo testavimas - vartotojo srauto pamoka
Verslo analitikas - verslo žvalgyba ir analizė
Verslo analitikas - verslo žvalgyba ir analizė
 
„ApeeScape“ greitas ir praktiškas CSS apgaulės lapas
„ApeeScape“ greitas ir praktiškas CSS apgaulės lapas
Pradinio patekimo į rinką iššūkiai
Pradinio patekimo į rinką iššūkiai
Persvarstyti TV platformos vartotojo sąsajos dizainą
Persvarstyti TV platformos vartotojo sąsajos dizainą
„Salesforce Einstein AI“: API pamoka
„Salesforce Einstein AI“: API pamoka
Prisitaikymas prie sėkmės - pokyčių valdymo vadovas
Prisitaikymas prie sėkmės - pokyčių valdymo vadovas
Populiarios Temos
  • skirtumas tarp s corp ir c corp
  • geštalto suvokimo organizacijos dėsniai
  • grafinis dizainas nėra menas
  • kaip gauti twitter duomenis
  • kas yra rtl-sdr
  • kuris iš šių dalykų gerai išmano HTML5, „Javascript“ ir CSS?
Kategorijos
Mobilusis Projektų Valdymas Vikrus Kpi Ir „Analytics“ „Ux Design“ Dizainerio Gyvenimas Kita Produkto Žmonės Ir Komandos Pelningumas Ir Efektyvumas Mobilus Dizainas

© 2021 | Visos Teisės Saugomos

apeescape2.com