Upgrade to Pro — share decks privately, control downloads, hide ads and more …

12 Frameworks for Mobile Hybrid Apps

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →

12 Frameworks for Mobile Hybrid Apps

Mobile hybrid frameworks enable quickly prototyping and creating cross-platform mobile applications for iOS, Android, and even for the web and desktop.

Here's a list of 12 of the best ones to use in your next project.

Avatar for Jscrambler

Jscrambler

March 29, 2019

Other Decks in Programming

Transcript

  1. 12 Frameworks for Mobile Hybrid Apps 2 Why Hybrid Mobile

    Development? Making Your Life Easier • Write code only once. • Build mobile apps that run on the main platforms with no extra effort. • Open the door for PWAs (they’re growing fast!). Let’s look at 12 useful Frameworks!
  2. 12 Frameworks for Mobile Hybrid Apps 3 1. Xamarin Language

    • C# shared codebase Highlights • Open-source framework by Microsoft available under the MIT license. • Use Xamarin tools to write native Android, iOS, and Windows apps with native user interfaces, including Windows and MacOS. • Design an amazing experience for glass with the Android SDK and GDK.
  3. 12 Frameworks for Mobile Hybrid Apps 4 2. PhoneGap Language

    • HTML5, CSS, JavaScript Highlights • From the team behind Apache Cordova, the Adobe PhoneGap framework is an open source distribution of the Cordova framework. • Reuse existing web development skills to quickly make hybrid applications built with HTML, CSS, and JavaScript. • Embeds the HTML5 code inside a native WebView on the device. • Can be extended with native plug-ins to access device features.
  4. 12 Frameworks for Mobile Hybrid Apps 5 3. Ionic Framework

    Language • HTML5, CSS, JavaScript Highlights • 100% free and open-source SDK built on top of Apache Cordova. • Has over 120 native device features like Bluetooth, Finger Print Auth, and more with Cordova plugins and TypeScript extensions. • Several features like deep linking, AoT Compiling, and Ionic Native. • Since version 4, it’s framework-agnostic and has official support for React, Preact, Angular, and Vue, as well as for Web Components.
  5. 12 Frameworks for Mobile Hybrid Apps 6 4. Framework7 Language

    • HTML5, CSS, JavaScript Highlights • 100% free and open-source framework. • Focused on iOS and Google Material design to bring the best UX. • Comes with Vue & React components to bring components-syntax, structured data and data bindings with power and simplicity. • Several features like native scrolling, library agnostic, pages transition animation, multiple views support, route pages by using the combination of XHR, caching, browser history and preloading.
  6. 12 Frameworks for Mobile Hybrid Apps 7 5. Appcelerator Titanium

    Language • JavaScript, custom XML Highlights • 100% free and open-source framework. • Mixed development environments provided by Xamarin and PhoneGap. • Uses Alloy, an MVC framework to enable rapid mobile development. • Apps are written in JavaScript but you must use a custom XML and Appcelerator's API to support some native features. • The Titanium SDK is equipped with a number of mobile platform APIs and Cloud service to use as an app backend.
  7. 12 Frameworks for Mobile Hybrid Apps 8 6. Mobile Angular

    UI Language • HTML5, CSS, JavaScript Highlights • 100% free and open-source framework. • Extension to Bootstrap 3 without any dependencies of Bootstrap JS libs or jQuery (which both are default dependencies in Bootstrap 3). • All you need to use are some AngularJS directives to create awesome mobile user experiences. • Several UI components like overlays, switches, sidebars, scrollable areas and absolute positioned navbars.
  8. 12 Frameworks for Mobile Hybrid Apps 9 7. Onsen UI

    Language • HTML5, CSS, JavaScript Highlights • 100% free and open-source framework under Apache license. • Framework-agnostic with support for Angular, React, Vue.js and Meteor or pure JavaScript. • Large collection of ready-to-use responsive components. • Uses PhoneGap and Cordova for building the app.
  9. 12 Frameworks for Mobile Hybrid Apps 10 8. Sencha Ext

    JS Language • HTML5, CSS, JavaScript Highlights • Fit to build data-intensive, cross-platform web and mobile applications. • Built-in support for Angular and React. • Includes several high-performance UI components like HTML5 calendar, grids, pivot grid, D3 adapter, trees, lists, forms, menus, toolbars, panels, windows, and much more.
  10. 12 Frameworks for Mobile Hybrid Apps 11 9. Kendo UI

    Language • HTML5, CSS, JavaScript Highlights • Free and open-source framework under the Apache v2 license. • Built-in compatibility for jQuery, Angular, React, and Vue. • Several UI components like charts, sliders, maps, diagrams, media players, calendar, chat, spreadsheets, and notifications.
  11. 12 Frameworks for Mobile Hybrid Apps 12 10. Quasar Language

    • HTML5, CSS, JavaScript Highlights • 100% free and open-source framework under the MIT license. • Powered by Vue.js, it enables using a single code base to deploy for web (SPA, PWA, SSR), mobile (iOS, Android), and Desktop. • Follows Google’s Material Design 2.0 guidelines. • Built-in tools like minification, cache busting, tree shaking, source mapping, code-splitting & lazy loading, ES6 transpiling, and linting.
  12. 12 Frameworks for Mobile Hybrid Apps 13 11. NativeScript Language

    • JavaScript, TypeScript, CSS Highlights • 100% free and open-source framework under the Apache v2 license. • Builds fully native iOS and Android apps which use the same APIs as if they were developed in Xcode or Android Studio. • Enable re-purposing third-party libraries from Cocoapods, Android Arsenal, Maven, and npm.js without the need for wrappers. • Built-in support for Angular and Vue. • Results in mobile apps with native performance.
  13. 12 Frameworks for Mobile Hybrid Apps 14 12. React Native

    Language • JavaScript (React) Highlights • 100% free and open-source framework under the MIT license. • Builds fully native iOS and Android apps which are indistinguishable from apps built using Objective-C or Java. • Uses the same UI building blocks as regular iOS and Android apps. • Showed the highest satisfaction levels in the State of JS 2018 survey.
  14. 12 Frameworks for Mobile Hybrid Apps 15 Final Thoughts Hybrid

    is Power! • Mobile hybrid frameworks will save you time and effort and you can reuse the code for creating a web application version too. • The hybrid model is not the perfect solution for all use cases (especially if performance is a crucial concern). • Because these frameworks use JavaScript, your code can be easily retrieved and stolen or tampered with – make sure you use a JavaScript security solution like Jscrambler (more details on the next slides).
  15. 12 Frameworks for Mobile Hybrid Apps 16 Hybrid Mobile Apps

    are Vulnerable to Client-Side Attacks JavaScript resides in the client-side, so anyone can access and tamper with it. This poses major client-side security risks: Counterfeit Applications Malware Injection Man-in-the-Browser Attacks Information Leakage Code Theft and Reuse Piracy & License Violations
  16. 12 Frameworks for Mobile Hybrid Apps 17 Jscrambler Ensures Your

    Mobile Hybrid App is Protected Tamper-proof apps that work exactly how you develop them Jscrambler protects your application from runtime code modifications and ensures your app’s integrity, making sure your users are safe and have the experience they expect. Apps remain safe and able to defend against attacks Your JavaScript application will have self- defensive capabilities and will be able to fight any reverse-engineering or tampering attempts that can hurt your revenue and business. App logic and data contained in the code are concealed Jscrambler transforms the JavaScript in your application, reducing visibility and making it extremely hard to understand. This means your algorithm and data are hidden and away from prying eyes.
  17. 12 Frameworks for Mobile Hybrid Apps 18 How we Protect

    Your Mobile Hybrid App Polymorphic JavaScript Obfuscation We are the only solution that offers the most advanced JavaScript Obfuscation techniques that combined with polymorphic behavior. Self-Defending Your web application will have self-defensive capabilities, detecting and reacting to any tampering, debugging or poisoning attempts. Code Locks With Jscrambler, you can restrict when, where and by whom the application can be executed. Real-Time Notifications You can set Jscrambler to warn you if your application is being tampered or used in a different environment or date other than the one you have defined.
  18. 12 Frameworks for Mobile Hybrid Apps 19 Source Code Captured

    and Protected by Jscrambler • (function() { • function add1(element, index, array) { • array[index]=element+1; • } • function apply(8functions, integers) { • if(!Array.isArray(functions)) { • integers.forEach(functions); • } • 1 • 2 • 3 • 4 • 5 • 6 • 7 • 8 • 9 • 10 • 11 • 12 • 13 • /*...*/ ff)<<W);s=this[a](s,B);s=((s&0x1ff` = A)|(s>>>Q` <)f);P^=s;P=((P&0x7` H\"y)|(P>>>h);P=(P*z+((129.,0x187)<(91,0x1E0)? (0x72,0xe6546b64):(120.7E1,0x35)))|R8H.j3H;}s= ` ##switch (t%x){case X:s=(J[I](H+v)&0xff)<<c;` 8 v:s|` 5$R8H.t3H` ;$e` >!` 0\"` ?&` ;\";s=this[a](s,B);s=((s&0x1ff` [ A)|(s>>>Q` <)f);P^=s;}P^=t;P^=P>>>c;P` :$P,0x85ebca6b` G P>>>y` 2*c2b2ae35` 8$c;return P;}};var r=K.T(\"3af\")?\"\":{\'F\':{(49.80E1>(0xAF,13. )?(22.40E1,0):65.>(137.8E1,0x209)?(74,0x84):(0 x1AF,46` K )),E=L>o,G;for (;n0N<l0N.length;n0N++) /*...*/ • 1 • 2 • 3 • 4 • 5 • 6 • 7 • 8 • 9 • 10 • 11 • 12 • 13
  19. 12 Frameworks for Mobile Hybrid Apps 20 Easy Integration with

    your Build Setup And many more... Compliant Like no Other And many more... Fully Integrated in your Build/CI Workflow
  20. 12 Frameworks for Mobile Hybrid Apps 21 What About Performance?

    Safe, Flexible and Always Up to Date! #1 The performance hits are manageable and depend a lot on the application you are trying to protect. #2 You can fine-tune your protection on the most sensitive parts and increase it where it is most needed. #3 You can instrument the code to apply different levels of protection according to the importance of the code (ignore code blocks and code annotations feature).