Mobile JS Frameworks

50 %
50 %
Information about Mobile JS Frameworks
Technology

Published on February 17, 2014

Author: iersoy

Source: slideshare.net

Description

"Mobile JS Frameworks" presentation from C# Corner Istanbul's 'Tizen,Mobile Linux and JS Development Day' seminar on 16th of Feb

Mobile JS Frameworks IBRAHIM ERSOY MOBILE DEVELOPER @ SIMTERNET

Agenda Introduction • Mobile Apps • Native vs Hybrid vs Mobile Web • Platforms/Stores • App Builders • PhoneGap JS Frameworks • Jquery Mobile • iUI JS Demo • jQuery Mobile ThemeRoller Smartface • Smartface Pros • Smartface Cons

What is a ‘Mobile App’ ? Mobile apps are software programs you can download and access directly using your phone or tablet « Mobile App -> Software that runs on your mobile device »

Native vs Hybrid vs Mobile Web  Native : Platform-based Programming Language,UI & libraries  Hybrid : Native-based HTML/JS mobile web apps.  Mobile Web : Websites that run responsive on mobile devices

Responsive Design

What is ‘Hybrid’ ?  What are mobile web applications? • Increasingly popular way to deliver content and business applications to mobile devices • Alternative to developing native mobile apps • Run on any OS, desktop, tablet, smartphone • Easy to develop using standard web technologies and frameworks • Advances in HTML, CSS and JavaScript allow for shifting more functionality to the browser, providing richer user experience and better performance • Easy to maintain and easy roll out of upgrades

Limitations of Hybrid  Browsers do not typically have access to advanced functions of a device, like GPS, camera, address book...  Web apps are often slower than native apps  Mobile web apps require permanent Internet connection  Using offline web application caching and platforms like PhoneGap, Titanium, etc. provides ways to address these limitations

Platforms & Marketplaces • iOS – iTunes Store • Android – Google Play • Blackberry – AppWorld • Windows Phone & Windows 8 – Windows Store • Tizen – Tizen Store

App Builders  Easy to use, No Coding skill required  AppyPie.com  appery.io  TheAppBuilder  MobinCube  ShoutEm

PhoneGap  build.phonegap.com or Standalone  Apache Cordova  Packaging in the Cloud  Github Support

JS FRAMEWORKS

jQuery Mobile and iUI’s Cons jQuery Mobile iUI • Page Transitions • Documentation • Large JS Files • No Native Support • Canvas Animations

jQuery Mobile and iUI’s Pros jQuery Mobile • Familiarity with jQuery • Design & Layout iUI • iOS UI

jQuery Mobile • Touch-optimized JavaScript framework for smartphones & tablets • Built on jQuery and jQuery UI foundation • Unified user interface system across all popular mobile platforms • Responsive design techniques allow the same underlying codebase to automatically scale from smartphone to tablet and desktop-sized screens • AJAX-based navigation system to enable animated page transitions while maintaining back button

Differences between jQuery and jQuery Mobile • jQuery: Library that makes it easier to write JavaScript through selectors • jQuery Mobile: Framework built on top of jQuery Used by developers to build mobile interfaces Coding is done using plain HTML markup for the most part jQuery Mobile automatically applies styles and add functionality to widgets

ThemeRoller for jQuery Mobile • Customizable user interface • Built-in theming framework • ThemeRoller application http://themeroller.jquerymobile.com/

Supported Platforms 3-level graded platform support system, supported platforms include: • Apple iOS (iPhone, iPod Touch, iPad) • Android • Windows Phone • Blackberry

iUI – iOS User Interface http://www.iui-js.org/

“ jQuery Mobile ThemeRoller Demo ”

Smartface

Smartface Pros             WYSIWYG design editor JavaScript code editor On Device Emulator Memory Management Network Components Wizards Ready to Use Libraries (Animation, Security…) Single Code Based Testing On Device Debugging Solving Device Specific Problems New OS Updates doesnt cause Fragmentation Problems Plug-In JavaScript Power  Customized JS Engine inside  Certified by Symantec  NATIVE and Cross-Platform

Smartface Cons  No game, no utilities  Some apps need more knowledge  Mac and Linux support  Dependency

Questions?

“ Thanks for coming! ”

Add a comment

Related presentations

Related pages

A Touch-Optimized Web Framework - jQuery Mobile

JQuery Mobile is a HTML5 based user interface system designed to make responsive web sites and apps that are accessible in the vast majority of smartphone ...
Read more

Top 10 Mobile Web Development JavaScript Frameworks

Using JavaScript frameworks for mobile web development can ... zepto.js. zepto.js is a mobile JavaScript framework built specifically for mobile WebKit ...
Read more

Comparison of JavaScript frameworks - Wikipedia, the free ...

Comparison of JavaScript frameworks There are many ... Backbone.js: 1.2.1 ... (1.34.7 runtime mobile, minified, zipped)
Read more

5 Best Mobile Web App Frameworks: Ionic (AngularJS ...

5 Best Mobile Web App Frameworks: Ionic (AngularJS) ... I was reading this post when I was looking for a mobile app CSS framework to use with Ember JS.
Read more

Mobile Frameworks Comparison Chart

The Mobile Frameworks Comparison Chart lets you compare all major mobile frameworks.
Read more

Mobile Angular UI - Angular JS Mobile UI framework with ...

Mobile Angular UI is a mobile UI framework just like Sencha Touch or jQuery Mobile. If you know Angular JS and Twitter Bootstrap you already know it!
Read more

The Top 7 Hybrid Mobile App Frameworks - SitePoint

The Top 7 Hybrid Mobile App Frameworks. ... jQuery Mobile alongside KnockOut.js or AngularJS is a nice combination. Once you are done with your code, ...
Read more

Phone JS

Mobile Development; Web Development; What's New; Documentation; Demos; Support; Theme Builder; Blogs; Buy; ... Optimized HTML 5 JavaScript SPA Framework ...
Read more

Ionic: Advanced HTML5 Hybrid Mobile App Framework

Ionic makes it incredibly easy to build beautiful and interactive mobile apps using HTML5 and AngularJS.
Read more

10 JavaScript frameworks to improve your mobile ...

10 JavaScript frameworks to improve your mobile ... Mobilize.js is one such JavaScript framework that automatically detects mobile browsers ...
Read more