Hybrid app in ionic framework overview
Download as PPTX, PDF6 likes1,958 views
The document discusses hybrid application development, comparing native and web applications. It outlines the architecture and features of hybrid apps, emphasizing their use of web technologies alongside native APIs for cross-platform compatibility. Key technologies mentioned include HTML5, CSS3, JavaScript, Cordova, AngularJS, and Ionic.
Hybrid app in ionic framework overview
- 3. Native Applications •Downloaded directly to the device and stored locally. •Interfaces directly with the mobile OS. •It can access all the API’s that are made available by the OS. •Developer writes source code and includes images, audio files and puts in into a binary executable file. •These tools are included in the Software Development Kit(SDK).
- 4. Application Programming Interface(API) •It is a set of routines, protocols, and tools for building software applications. Low-level APIs •The app can interact directly with the touch screen or keyboard, render graphics, connect to networks, process audio received from the microphone, play sounds through the speaker or headphones, or receive images and videos from the camera. High-level APIs •Browsing the web, managing the calendar, contacts, photo album and, of course, the ability to make phone calls or send and receive text messages.
- 5. APIs for various platforms
- 6. Web Applications •A web application or web app is any software that runs in a web browser. •It is created in a browser-supported programming language such as the combination of JavaScript, HTML and CSS. •HTML5 provides access to rich media, geolocation services and offline availability.
- 8. Overview of Hybrid Approach •The hybrid approach combines native development with web technology. •Developers write significant portions of their application in cross-platform web technologies, while maintaining direct access to native APIs when required. •The native portion of the app can be developed independently, whereas the web portion of the app can be either a web page that resides on a server.
- 12. Architecture of Hybrid Apps
- 14. Hybrid App Features • Platform independent (iOS, Android etc.) • HTML5, CSS3 & JS • Quick development • Direct access to native APIs with Cordova Hybrid Apps
- 16. Cordova , Angular JS and Ionic
- 23. Thank you!
Editor's Notes
- #3: It’s a world of smartphones. A huge percentage of population use this technology. Our focus 2day is to introduce various mobile app developing techniques for various platforms and to showcase an optimum technique for it.
- #4: The installation process can be initiated by the user or vendor company. The most popular way to download a native app is by visiting an app store, such as Apple’s App Store, Android’s Marketplace or BlackBerry’s App World, but other methods exist and are sometimes provided by the mobile vendor. Add examples such as Angry Birds, Retrica(camera app).
- #5: Once the native application is installed on the mobile device and launched by the user, it interacts with the mobile operating system through proprietary API calls that the operating system exposes. These can be divided into two groups: low-level APIs and high-level APIs.
- #6: SWIFT language for ios and macos app development
- #7: some companies go even further and enhance the user experience by creating a mobile website that looks like a native app and can be launched from a shortcut that is indistinguishable from that used to launch native apps. One of the most prominent advantages of a web app is its multiplatform support and low cost of development. Most mobile vendors utilize the same rendering engine in their browsers, WebKit—an open-source project led mainly by Google and Apple that provides the most comprehensive HTML5 web apps run within the browser Add examples such as Google docs, icloud.
- #8: The hybrid approach combines native development with web technology. The native portion of the application uses the operating system APIs to create an embedded HTML rendering engine that serves as a bridge between the browser and the device APIs. This bridge enables the hybrid app to take full advantage of all the features that modern devices have to offer.
- #9: The native portion of the application uses the operating system APIs to create an embedded HTML rendering engine that serves as a bridge between the browser and the device APIs. This bridge enables the hybrid app to take full advantage of all the features that modern devices have to offer.
- #10: Explain from knowledge of previous slides notes
- #11: Hybrid Uses device APIs Dynamic updates HTML, CSS, JS Platform independent Native Optimum use of device APIs Installed by vendor or website Platform dependent
- #13: The native portion of the application uses the operating system APIs to create an embedded HTML rendering engine that serves as a bridge between the browser and the device APIs. App developers can choose between coding their own bridge or taking advantage of ready-made solutions such as PhoneGap(Cordova)— open-source library that provides a uniform JavaScript interface to selected device capabilities that is consistent across operating systems. The native portion of the app can be developed independently, but some solutions in the market provide this type of a native container as part of their product.