SlideShare a Scribd company logo
Building modern applications in the
cloud
Olsi Karapici
Modern applications
New Trends & Needs
● Small business owner trying to implement technology for client engagement
● Small budget, one man staff
● He wants to start small and then if business grows be able to scale up according to his needs
● He wants an app for all major mobile platforms and possibly also a web application, all of them in
the shortest time possible and the lowest cost.
Meet Apu
● She is a young and bright freelance software developer very experienced in front end web
development and UX design.
● She has a great app idea.
● No experience on IT infrastructure and operations.
● Very low budget.
Meet Lisa
● He uses his smartphone all the time.
● He wants the prettiest, greatest, full of functionalities app and he wants it NOW.
● The app better be available and engaging all the time, otherwise is just a tap away from being
uninstalled.
● He is always right!
Meet Bart
Modern apps
● Cross-platform support
● A great, seamless and engaging UX
design
● Real time synchronization across
user’s devices
● Offline Capabilities
● Vertical Scalability
● A lot of work !
● A lot of resources !!
● A lot of time !!!
● And yet a lot of work :/
...or not :)
● “Work Smarter...Not Harder”
Requirements
Apps development
Hybrid vs Native
● Demand for mobile experiences has grown exponentially.
● The number of mobile phone users in the world is expected to pass the five billion mark by 2019*
● By 2022, 70% of all enterprise software interactions are expected to occur on mobile devices**.
Why mobile in the first place?
* https://www.statista.com/statistics/274774/forecast-of-mobile-phone-users-worldwide/
** Market Guide for Mobile ApplicationTesting Services - Gartner, June 2017
● Hybrid apps are essentially just apps :)
● They’re downloaded from a platform’s app store or marketplace, and access the same native
features and hardware-based performance acceleration as any app built with a native SDK.
● Hybrid apps are built using open web technologies like JavaScript, HTML, and CSS, rather than the
proprietary or specialized languages used by iOS, Android, and others.
● Hybrid apps run in a full-screen browser, called a webview, that is invisible to the user.
● Hybrid-built apps can run on any platform or device, all from a single codebase, while still
delivering a native look and feel.
What is a Hybrid App?
Keep in mind that the decision to choose hybrid or native should be based on the unique goals of your
organization, the circumstances of a given project, and composition of your existing development
team.
Comparing Hybrid vs. Native
● Write Once, Run Anywhere
○ Users get a great experience across platforms and devices
○ One codebase to worry about
● Use the skills that you already have
○ The web developer community is greater in size
○ HTML, CSS and JavaScript is easier to master (?)
● The Best UX Across Platforms
○ a great UX means a consistent app experience as your users move between platforms, devices, and modes of
interaction, including mobile and desktop browsers.
Why Hybrid?
Ionic Framework
Introduction
● Website: http://ionicframework.com/
● Ionic is a powerful open source HTML5 SDK that helps you build native-feeling mobile apps and
Progressive Web Apps using web technologies like HTML, CSS, and Javascript.
● #1 most widely used hybrid mobile hybrid framework
What is Ionic ?
● Apache Cordova + Twitter Bootstrap + Angular
● Think of Ionic as the front-end UI framework that handles all of the look and feel and UI
interactions
● “Bootstrap for Native,” but with support for a broad range of common native mobile components,
slick animations, and beautiful design.
What is Ionic ?
Framework Stack
Native SDK
Cordova
Angular
Ionic
Your App
Native Wrapper
WebView
Your Code
(Html/Js)
Top Down View
Cordova
API
Plugins
PaaS / BaaS
Ease the development and deployment process
● The emergence of cloud computing represents a new paradigm of servitization, where a physical
product (software or hardware) is transformed into a service.
● SaaS, IaaS and PaaS
○ Software as a Service is servitization of software programs. (ex. Microsoft Office 365, Google Docs)
○ Infrastructure as a Service is servitization of infrastructures (ex. Amazon AWS, Google Compute Engine,
Azure Virtual Machines)
○ Platform as a Service is servitization of development platforms, (ex. Google App Engine, Azure Cloud
Services, Amazon AWS & Lambda)
Cloud Services
● BaaS
○ Backend as a Service is servitization of backend functionalities ( Firebase, Parse, Kinvey etc.)
● Being an intermediate architecture between PaaS and SaaS, the essence of creating BaaS is to
meet the rapid development needs of the mobile Internet and to provide backend capabilities as
services
● With BaaS, developers can utilize the serviced backend capabilities to develop their software
solutions.
● While PaaS simplifies the application deployment process, BaaS simplifies the application
development process
BaaS - The Improvement of PaaS
Firebase
Introduction
● A powerful BaaS platform for your mobile or web application.
○ Scalable, real-time, and flexible backend for your application
○ Develop without the hassle of managing servers or writing server-side code
● Focus on the user
○ Focus on creating extraordinary user experiences. Firebase will take care of the rest
○ Firebase can power your app's backend, including data storage, user authentication, static hosting, and more.
● Build for any device and build it fast!
○ Build cross-platform native & hybrid mobile and web apps with Android, iOS and JavaScript SDKs
○ With Firebase, you can store data and authenticate users in your app with just a few lines of code.
What is Firebase ?
Building modern applications in the cloud
Firebase Features
Analytics
● Free and unlimited analytics solution
● Unlimited reporting of 500 event
types, each with up to 25 attributes
● One dashboard to view user behavior
and cross-network campaign
performance
● Demographic segmentation, including
age, gender, and location, available
out-of-the-box
Firebase Features
Develop
● Realtime Database
○ Store and sync app data in realtime
● Authentication
○ Reduce friction with robust
authentication
● Cloud Messaging
○ Deliver and receive messages across
platforms reliably
● Storage
○ Store files with ease
Firebase Features
Develop
● Hosting
○ Deliver web content faster through
Google Cloud CDN
● Test Lab
○ Test in the lab, not on your users
● Crash Reporting
○ Keep your app stable
Firebase Features
Grow
● Notifications
○ Engage with users at the right
moment
● Remote Config
○ Customize your app on the fly
● App Indexing
○ Drive organic search traffic to your
app
Firebase Features
Grow
● Dynamic Links
○ Send users to the right place inside
your app
● Invites
○ Empower your users to share your
app
● AdWords
○ Acquire users with the reach of
Google
Firebase Features
Earn
● AdMob
○ Monetize through engaging ads
Demo 1: ToDo App
Demo 2: tChat
Questions?

More Related Content

PPTX
Achieve Responsive Web Applications With Ease Using Kendo UI
PDF
Intel AppUp Day Bologna
PPTX
Getting Started with ASP.NET vNext
PDF
Mobile App Development Services @PixelCrayons
PPTX
Oracle APEX, Low Code for Data Driving Apps
PPTX
Phonegap vs Sencha Touch vs Titanium
PPTX
Drag and Drop Application Development with Progress Rollbase
PPTX
Rho mobile v4 - DroidCon Paris 18 june 2013
Achieve Responsive Web Applications With Ease Using Kendo UI
Intel AppUp Day Bologna
Getting Started with ASP.NET vNext
Mobile App Development Services @PixelCrayons
Oracle APEX, Low Code for Data Driving Apps
Phonegap vs Sencha Touch vs Titanium
Drag and Drop Application Development with Progress Rollbase
Rho mobile v4 - DroidCon Paris 18 june 2013

What's hot (20)

PDF
Crossing the low-code and pro-code chasm: a platform approach
PPTX
Build Hybrid Mobile Applications for Nokia Lumia Devices
PDF
Is php dying?
PDF
Mobilizing your Existing Enterprise Applications
PDF
Busting myths about business apps, low code style
ODP
Hybrid application development
PPTX
Low code vs. No code: Which is better for web and app development?
PPTX
Server Side Responsive Layouts for ASP.NET WebForms using Telerik UI for ASP....
PPTX
DevOps World / Jenkins World - Lisbon - Jenkins for Low-Code Apps - Andy Pemb...
PPTX
Introduction to Indigo.Design App Builder
PPTX
GAIBT Pune - Future of AI.pptx
PPTX
Microsoft Low Code / No Code Business Process Automation
PDF
[API World 2021 ] - Understanding Cloud Native Deployment
PPTX
Build Mobile Applications with Headless Drupal 8 - DrupalConAsia 2016
PDF
Best Tools for Business
PPTX
React native
PPTX
Building Visual Studio LightSwitch Application
PPTX
appMobi HTML5 Gaming
PDF
apidays LIVE London 2021 - Federating the Content Layer by Jamie Barton, Grap...
PDF
Low Code Capabilities of Digital Product Design Platforms
Crossing the low-code and pro-code chasm: a platform approach
Build Hybrid Mobile Applications for Nokia Lumia Devices
Is php dying?
Mobilizing your Existing Enterprise Applications
Busting myths about business apps, low code style
Hybrid application development
Low code vs. No code: Which is better for web and app development?
Server Side Responsive Layouts for ASP.NET WebForms using Telerik UI for ASP....
DevOps World / Jenkins World - Lisbon - Jenkins for Low-Code Apps - Andy Pemb...
Introduction to Indigo.Design App Builder
GAIBT Pune - Future of AI.pptx
Microsoft Low Code / No Code Business Process Automation
[API World 2021 ] - Understanding Cloud Native Deployment
Build Mobile Applications with Headless Drupal 8 - DrupalConAsia 2016
Best Tools for Business
React native
Building Visual Studio LightSwitch Application
appMobi HTML5 Gaming
apidays LIVE London 2021 - Federating the Content Layer by Jamie Barton, Grap...
Low Code Capabilities of Digital Product Design Platforms
Ad

Similar to Building modern applications in the cloud (20)

PPTX
Hybrid Mobile App
PPTX
Hybrid mobile app
PDF
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
PPTX
Hybrid mobile application with Ionic
PDF
I knew there had to be a better way to build mobile apps
PPTX
Developing a native mobile apps using Ionic&Cordova
PPTX
Hybrid Mobile application
PPTX
Hybrid Mobile Development with Apache Cordova,AngularJs and ionic
PDF
Hybrid app development with ionic
PDF
6 Best JavaScript Framework for Mobile Apps Trending in 2023.pdf
PPTX
10 Useful Frameworks to Build Hybrid Mobile Apps
DOCX
Decide if PhoneGap is for you as your mobile platform selection
PDF
5 Reasons To Select Ionic Apps Development For Your Next Project
PDF
Hybrid mobile development vs. Native using ionic
PPTX
Mobile Enablement And Intelligence
PPTX
Ionic and Azure
PDF
Web, Native & Hybrid Apps Overview
PDF
What is hybrid mobile app development? | Nitor Infotech
PDF
Why do developers prefer ionic to build progressive web apps
PDF
Whitepaper - Native App or HTML5
Hybrid Mobile App
Hybrid mobile app
Hire Ionic Developer to Build Cross-platform, Feature-rich, and most advanced...
Hybrid mobile application with Ionic
I knew there had to be a better way to build mobile apps
Developing a native mobile apps using Ionic&Cordova
Hybrid Mobile application
Hybrid Mobile Development with Apache Cordova,AngularJs and ionic
Hybrid app development with ionic
6 Best JavaScript Framework for Mobile Apps Trending in 2023.pdf
10 Useful Frameworks to Build Hybrid Mobile Apps
Decide if PhoneGap is for you as your mobile platform selection
5 Reasons To Select Ionic Apps Development For Your Next Project
Hybrid mobile development vs. Native using ionic
Mobile Enablement And Intelligence
Ionic and Azure
Web, Native & Hybrid Apps Overview
What is hybrid mobile app development? | Nitor Infotech
Why do developers prefer ionic to build progressive web apps
Whitepaper - Native App or HTML5
Ad

More from Commit Software Sh.p.k. (18)

PPTX
Building real time app by using asp.Net Core
PDF
Let's talk about GraphQL
PPTX
Arduino and raspberry pi for daily solutions
DOCX
Lets build a neural network
PPTX
Hacking a WordPress theme by its child
PPTX
Magento 2 : development and features
PPTX
Design patterns: Understand the patterns and design your own
PPTX
Blockchain - a simple implementation
PPTX
Laravel and angular
PPTX
Drupal 7: More than a simple CMS
PPTX
Intro to Hybrid Mobile Development && Ionic
PDF
Wordpress development 101
PPTX
Ruby on rails
ODP
Cloud Computing
PDF
Web apps in Python
PPTX
Laravel - The PHP framework for web artisans
PDF
Automation using RaspberryPi and Arduino
PPTX
ASP.NET - Building Web Application..in the right way!
Building real time app by using asp.Net Core
Let's talk about GraphQL
Arduino and raspberry pi for daily solutions
Lets build a neural network
Hacking a WordPress theme by its child
Magento 2 : development and features
Design patterns: Understand the patterns and design your own
Blockchain - a simple implementation
Laravel and angular
Drupal 7: More than a simple CMS
Intro to Hybrid Mobile Development && Ionic
Wordpress development 101
Ruby on rails
Cloud Computing
Web apps in Python
Laravel - The PHP framework for web artisans
Automation using RaspberryPi and Arduino
ASP.NET - Building Web Application..in the right way!

Recently uploaded (20)

PDF
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
PDF
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
PDF
Approach and Philosophy of On baking technology
PPTX
20250228 LYD VKU AI Blended-Learning.pptx
PDF
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
PPTX
Detection-First SIEM: Rule Types, Dashboards, and Threat-Informed Strategy
PPTX
Spectroscopy.pptx food analysis technology
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PPT
Teaching material agriculture food technology
PDF
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
PDF
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
PDF
cuic standard and advanced reporting.pdf
PDF
NewMind AI Weekly Chronicles - August'25 Week I
PDF
Building Integrated photovoltaic BIPV_UPV.pdf
PPTX
Effective Security Operations Center (SOC) A Modern, Strategic, and Threat-In...
PDF
TokAI - TikTok AI Agent : The First AI Application That Analyzes 10,000+ Vira...
PPTX
sap open course for s4hana steps from ECC to s4
PDF
Spectral efficient network and resource selection model in 5G networks
PDF
Chapter 3 Spatial Domain Image Processing.pdf
PDF
Unlocking AI with Model Context Protocol (MCP)
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
Approach and Philosophy of On baking technology
20250228 LYD VKU AI Blended-Learning.pptx
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
Detection-First SIEM: Rule Types, Dashboards, and Threat-Informed Strategy
Spectroscopy.pptx food analysis technology
Per capita expenditure prediction using model stacking based on satellite ima...
Teaching material agriculture food technology
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
cuic standard and advanced reporting.pdf
NewMind AI Weekly Chronicles - August'25 Week I
Building Integrated photovoltaic BIPV_UPV.pdf
Effective Security Operations Center (SOC) A Modern, Strategic, and Threat-In...
TokAI - TikTok AI Agent : The First AI Application That Analyzes 10,000+ Vira...
sap open course for s4hana steps from ECC to s4
Spectral efficient network and resource selection model in 5G networks
Chapter 3 Spatial Domain Image Processing.pdf
Unlocking AI with Model Context Protocol (MCP)

Building modern applications in the cloud

  • 1. Building modern applications in the cloud Olsi Karapici
  • 3. ● Small business owner trying to implement technology for client engagement ● Small budget, one man staff ● He wants to start small and then if business grows be able to scale up according to his needs ● He wants an app for all major mobile platforms and possibly also a web application, all of them in the shortest time possible and the lowest cost. Meet Apu
  • 4. ● She is a young and bright freelance software developer very experienced in front end web development and UX design. ● She has a great app idea. ● No experience on IT infrastructure and operations. ● Very low budget. Meet Lisa
  • 5. ● He uses his smartphone all the time. ● He wants the prettiest, greatest, full of functionalities app and he wants it NOW. ● The app better be available and engaging all the time, otherwise is just a tap away from being uninstalled. ● He is always right! Meet Bart
  • 6. Modern apps ● Cross-platform support ● A great, seamless and engaging UX design ● Real time synchronization across user’s devices ● Offline Capabilities ● Vertical Scalability ● A lot of work ! ● A lot of resources !! ● A lot of time !!! ● And yet a lot of work :/ ...or not :) ● “Work Smarter...Not Harder” Requirements
  • 8. ● Demand for mobile experiences has grown exponentially. ● The number of mobile phone users in the world is expected to pass the five billion mark by 2019* ● By 2022, 70% of all enterprise software interactions are expected to occur on mobile devices**. Why mobile in the first place? * https://www.statista.com/statistics/274774/forecast-of-mobile-phone-users-worldwide/ ** Market Guide for Mobile ApplicationTesting Services - Gartner, June 2017
  • 9. ● Hybrid apps are essentially just apps :) ● They’re downloaded from a platform’s app store or marketplace, and access the same native features and hardware-based performance acceleration as any app built with a native SDK. ● Hybrid apps are built using open web technologies like JavaScript, HTML, and CSS, rather than the proprietary or specialized languages used by iOS, Android, and others. ● Hybrid apps run in a full-screen browser, called a webview, that is invisible to the user. ● Hybrid-built apps can run on any platform or device, all from a single codebase, while still delivering a native look and feel. What is a Hybrid App?
  • 10. Keep in mind that the decision to choose hybrid or native should be based on the unique goals of your organization, the circumstances of a given project, and composition of your existing development team. Comparing Hybrid vs. Native
  • 11. ● Write Once, Run Anywhere ○ Users get a great experience across platforms and devices ○ One codebase to worry about ● Use the skills that you already have ○ The web developer community is greater in size ○ HTML, CSS and JavaScript is easier to master (?) ● The Best UX Across Platforms ○ a great UX means a consistent app experience as your users move between platforms, devices, and modes of interaction, including mobile and desktop browsers. Why Hybrid?
  • 13. ● Website: http://ionicframework.com/ ● Ionic is a powerful open source HTML5 SDK that helps you build native-feeling mobile apps and Progressive Web Apps using web technologies like HTML, CSS, and Javascript. ● #1 most widely used hybrid mobile hybrid framework What is Ionic ?
  • 14. ● Apache Cordova + Twitter Bootstrap + Angular ● Think of Ionic as the front-end UI framework that handles all of the look and feel and UI interactions ● “Bootstrap for Native,” but with support for a broad range of common native mobile components, slick animations, and beautiful design. What is Ionic ?
  • 16. Native Wrapper WebView Your Code (Html/Js) Top Down View Cordova API Plugins
  • 17. PaaS / BaaS Ease the development and deployment process
  • 18. ● The emergence of cloud computing represents a new paradigm of servitization, where a physical product (software or hardware) is transformed into a service. ● SaaS, IaaS and PaaS ○ Software as a Service is servitization of software programs. (ex. Microsoft Office 365, Google Docs) ○ Infrastructure as a Service is servitization of infrastructures (ex. Amazon AWS, Google Compute Engine, Azure Virtual Machines) ○ Platform as a Service is servitization of development platforms, (ex. Google App Engine, Azure Cloud Services, Amazon AWS & Lambda) Cloud Services
  • 19. ● BaaS ○ Backend as a Service is servitization of backend functionalities ( Firebase, Parse, Kinvey etc.) ● Being an intermediate architecture between PaaS and SaaS, the essence of creating BaaS is to meet the rapid development needs of the mobile Internet and to provide backend capabilities as services ● With BaaS, developers can utilize the serviced backend capabilities to develop their software solutions. ● While PaaS simplifies the application deployment process, BaaS simplifies the application development process BaaS - The Improvement of PaaS
  • 21. ● A powerful BaaS platform for your mobile or web application. ○ Scalable, real-time, and flexible backend for your application ○ Develop without the hassle of managing servers or writing server-side code ● Focus on the user ○ Focus on creating extraordinary user experiences. Firebase will take care of the rest ○ Firebase can power your app's backend, including data storage, user authentication, static hosting, and more. ● Build for any device and build it fast! ○ Build cross-platform native & hybrid mobile and web apps with Android, iOS and JavaScript SDKs ○ With Firebase, you can store data and authenticate users in your app with just a few lines of code. What is Firebase ?
  • 23. Firebase Features Analytics ● Free and unlimited analytics solution ● Unlimited reporting of 500 event types, each with up to 25 attributes ● One dashboard to view user behavior and cross-network campaign performance ● Demographic segmentation, including age, gender, and location, available out-of-the-box
  • 24. Firebase Features Develop ● Realtime Database ○ Store and sync app data in realtime ● Authentication ○ Reduce friction with robust authentication ● Cloud Messaging ○ Deliver and receive messages across platforms reliably ● Storage ○ Store files with ease
  • 25. Firebase Features Develop ● Hosting ○ Deliver web content faster through Google Cloud CDN ● Test Lab ○ Test in the lab, not on your users ● Crash Reporting ○ Keep your app stable
  • 26. Firebase Features Grow ● Notifications ○ Engage with users at the right moment ● Remote Config ○ Customize your app on the fly ● App Indexing ○ Drive organic search traffic to your app
  • 27. Firebase Features Grow ● Dynamic Links ○ Send users to the right place inside your app ● Invites ○ Empower your users to share your app ● AdWords ○ Acquire users with the reach of Google
  • 28. Firebase Features Earn ● AdMob ○ Monetize through engaging ads

Editor's Notes

  • #4: He owns a small business and wants to create a new app to showcase his products and increase his business presence on the web He can't afford buying server infrastructure, neither renting server infrastructure and having a dedicated employee to maintain it. He wants to start small and then if business grows be able to scale up according to his needs He wants to have an app for all major mobile platforms and possibly also a web application, all of them in the shortest time possible and the lowest cost.
  • #5: but to be the first on the market she needs to develop the app the quickest way possible for all major platforms. She needs a solid backend infrastructure for developing,testing and deploying her app but has nothing more than a laptop that her parents bought her as a graduation gift.