10 rammer for å bygge mobilapplikasjon med HTML, CSS og JavaScript

For mange webutviklere, som bare kan være kjent med HTML, CSS og JavaScript, kan det være ukjent territorium å utvikle en innfødt mobilapp . Teknisk sett er mobile apper i Android, iOS og Windows Phone bygget med helt forskjellige programmeringsspråk; En Android-app bruker Java, en iOS-app bruker Objective-C, mens en Windows Phone-app bruker .NET.

Men nå kan alle med en anstendig kjennskap til HTML, CSS og JavaScript bygge en mobil applikasjon. En viktig fordel ved å bruke webteknologi til å bygge appen din, er Portability . Ved å bruke en pakker / kompilator, som PhoneGap, vil du kunne port og installere appen på mange forskjellige plattformer.

Det er en rekke rammer som gjør dette mulig. De har også gjort halvparten av det harde arbeidet for å bygge bro over gapet mellom web- og mobilplattformer . Her har vi satt sammen 10 av de beste mobile rammer som vi kunne finne. Hvis du er klar til å bygge den neste milliard-dollar-appen, kan vi sjekke ut listen.

1. jQuery Mobile

jQueryMobile er et robust mobilutviklingsramme for å bygge applikasjoner på tvers av mobil-plattformer . jQuery Mobile støtter et bredt spekter av forskjellige plattformer, fra en vanlig desktop, smarttelefon, nettbrett eller en e-leser enhet som Nook eller Kindle. I likhet med sin søsken, jQuery UI, består jQuery Mobile av en rekke brukergrensesnitt som i dette tilfellet er optimalisert for mobil og berøringsaktivert enhet s.

Anbefalt lesing: Mobil Appdesign / Dev: Begynnerveiledning til JQuery Mobile

2. Cordova / PhoneGap

PhoneGap er i hovedsak basert på Cordova. Cordova / Phonegap gir et sett JavaScript APIer som kobler til enhetens innfødte funksjoner som Kamera, Kompass, Kontakter og Geolocation. Cordova / Phonegap lar oss bygge en mobil applikasjon uten det opprinnelige programmeringsspråket ; i stedet kan vi bruke et rammeverk som jQuery Mobile. Den vil kompilere appen din ved hjelp av plattformens SDK og vil være klar til å installere på plattformen den støtter, inkludert iOS, Android, Windows Phone, Blackberry og Web OS.

3. Sencha Touch

Sencha Touch er et mobilt rammeverk drevet av HTML5 og CSS3, og gir APIer, animasjoner og komponenter som er kompatible med de nåværende mobilplattformene og nettleserne. Sencha Touch støtter både Cordova og PhoneGap ; du kan kompilere appen din og sende appen din til de respektive plattformens App Stores. I tillegg gir Sencha Touch et sett med temaer for iOS, Android, Blackberry, Windows Phone, Tizen og en rekke andre plattformer for å hjelpe appen din til å føles som en innfødt app.

4. Ratchet

Ratchet ble opprinnelig brukt av Twitter som et internt verktøy for å lage sin mobile app prototype som deretter publiseres offentlig som et åpen kildekode-prosjekt. Ratchet kommer med en samling av brukergrensesnitt og JavaScript-plugins for å bygge enkle mobilapper, som gir gjenbrukbare HTML-klasser . I versjon 2.0, leveres også Ratchet med sin proprietære skrifttype ikon satt med navnet Ratcheticon og to pre-made UI temaer for iOS og Android .

5. Jonisk

Hvis du er bekymret for appens ytelse, er ionisk det rette rammeverket for deg. Ionic er en HTML5 mobil rammeverk med fokus på ytelse, ved å utnytte maskinvare akselerasjon, og det krever ingen tredjeparts JS bibliotek. Det fungerer best sammen med Angular.js for å bygge en interaktiv app . I likhet med Ratchet, leveres ionisk med et pent utformet skriftsymbolsett, Ionicons, og en gjeng med gjenbrukbare HTML-klasser for å bygge den mobile brukergrensesnittet.

6. Lungo

Lungo er et lett mobilt rammeverk basert på HTML5 og CSS3 . Den har veldig fine standardstiler som du kan bruke som utgangspunkt for å designe mobilappen din. Bortsett fra de mobile UI-komponentene, bringer Lungo en rekke JavaScript API til å kontrollere appen din. Lungo støtter følgende plattformer: iOS, Android, Blackberry og Firefox OS.

7. jQT

jQT er et Zepto-plugin for mobile rammer som primært er designet for webkit-nettlesere . jQT er lett tilpassbar og utvidbar . Den kommer med et tema som kan endres ved hjelp av Sass / Compass, kule 3D-overgang som kan justeres via CSS3, og utviklere kan også utvide jQT med sine egne nødvendige funksjoner.

8. Junior

Junior er også en Zepto plugin for å bygge en mobil app som ligner på jQT . Men Junior er avhengig av flere eksterne biblioteker for noen funksjoner som skal fungere, nemlig Backbone.js, Flickable.js for å lage en sveipbar skyvekontroll og Ratchet for brukergrensesnittet.

9. Jo

Jo støtter et bredt utvalg av mobile plattformer, inkludert Tizen og Chrome OS. Jo kommer også med en startpakke, som drives av CSS3, så det gjør det enkelt for webutviklere på noe nivå av erfaring å forstå og begynne å style sine apps. I tillegg kan du bruke Jo sammen med PhoneGap eller Cordova for å pakke appen din til bruk på mobil plattform.

10. Famo.us

En ny gutt på mobilrammen, Famo.us, lover å eliminere HTML5-ytelsesproblemet på mobile enheter med sin lette JavaScript-motor (kun 64k). Famo.us vil angivelig også lansere en skybasert tjeneste for å pakke appen din til å publisere til AppStore - det høres ut som Phonegap, og Sencha vil snart få en ny konkurrent. Du kan registrere deg som beta-tester på www.famo.us for å få hendene på det.

30 Interessante nettsteder du sikkert ikke har hørt om

Bortsett fra de vanlige dypene i dine favoritt sosiale medier vannhuller, er jeg sikker på at du har det utvalg av nettsteder du besøker nesten religiøst hver dag . Rutiner har den ekle vanen å bli kjedelig etter en stund, derav behovet for lister som dette. I dette innlegget finner du 30 interessante nettsteder som du sikkert aldri har hørt om.Selv

(Tekniske og design tips)

50 Awesome Kjøkken, Mat og Matlaging Ikon Sett

Når du designer restaurantwebsteder og matapplikasjoner, vil du trolig kreve å bruke mange riktige ikoner. Det er derfor vi har satt sammen en samling på 50 av de beste matikonene for å passe inn i ethvert design. Disse fantastiske ikonene inkluderer mat, desserter, drikkevarer, kjøkkenredskaper, matvarer og matlagingsverktøy for å tilfredsstille alle behov.Her er

(Tekniske og design tips)