Hybrid Mobile Application - Hybrid apps combine elements of native and web apps, allowing them to be installed locally but also work across platforms. - Popular hybrid frameworks discussed include React Native, Ionic, Framework7, and PhoneGap. - Ionic is one of the most popular frameworks; it uses HTML5, CSS, JavaScript and Angular to create mobile apps with native-style UI elements that can be built once and deployed across platforms. - To use Ionic, developers first install Node.js and the Ionic and Cordova command line interfaces, then generate an Ionic project and run it for testing using the 'ionic' commands.

1. Hybrid Mobile Application
Subject : Mobile Application
Guide : Miss Anita

2. What we will cover today
• What is Hybrid Mobile Application?
• Introduce Hybrid Mobile Application Frameworks
• What is Ionic?
• How can we use it?
• Creating demo Application
• Conclusion

3. What Hybrid Mobile Application?
• Combines elements of both native and web applications
• Native applications are developed for a specific platform and install on a device
• Web applications are generalized for multiple platforms and not install in locally
• Integration with a device’s file system
• Integration with Web-based services

4. Introduce Hybrid Mobile Application
Frameworks
React Native
Open-source, Reusable Components. Developed by
Facebook developer. Used by Facebook, Instagram, Uber
Food etc. easily integrate native feature with Hybrid.
Ionic
Open Source SDK, Offers all of the functionalities like native
mobile development SDKs.
Framework 7
No external dependency& A Lots of UI elements and
widgets.
PhoneGap
Native Functionality, Can be extended with native plug-ins&
open-source.
Onsen UI
Powerful CLI, Versatile, Flexible & Open Source.

5. What is Ionic?
• Most popular & favorite framework on the list for Hybrid App Development
• HTML5 mobile app development framework designed with native-styled UI
element
• Has rich set of advanced features such as mobile components, typography, and
extensible base theme
• Use technologies like HTML, CSS, JavaScript, and Angular JS
• Support Angular material design
• Wrapping Angular Framework
• Platform independent
• Open source & free

6. How can we use it?
• Install latest version of Node Js (Current 10.9.0)
• Run following commands
$ npm install -g ionic
$ npm install -g cordova
$ ionic start myApp tabs

7. How can we use it?
• To run application
$ cd myApp
$ ionic serve

8. Creating Demo application

9. Any Questions ?
By : Mr. Sanjay Patel