SlideShare a Scribd company logo
Mobile application
development
React native
Harut Abgaryan
Do you know?
“In 2020 Expected Growth of Mobile App Revenue is 101 Billion US
Dollars.”
This statistic presents information on the projected mobile app revenues
from 2015 to 2020. In 2015, global mobile app revenues amounted to
41.1 billion U.S. dollars. In 2020, consumers are projected to spend over
101 billion U.S. dollars on mobile apps via app stores.
Mobile Application Development Process
● INITIATION
● DESIGN
● DEVELOPMENT
● ACCEPTANCE
● SUPPORT
INITIATIONS
Initiations talks about the transition of the project from sales
team to technical team, where they do initial project kick off
with the client and sales team to understand the requirement.
DESIGN
PROCESS FLOW : The Process Flow chart provides a visual
representation of the steps in a process. Flow charts are also
referred to as ProcessMapping or Flow Diagrams.
WIRE FRAME : Elements visible on
each of the screen of the mobile
application are discussed and noted
down as wireframes
DESIGN
STORYBOARD : Everything including the images to be shown, icons
appearing, theme, color, background, etc is a part of storyboard.
ARCHITECTURE DESIGN : Planning and development of application
architecture is performed. Coding is done to give life to the
application.
TEST PLANNING : The application is tested
for bugs by running various programs,
performing checks at different conditions
to ensure it is robust and flawless.
DEVELOPMENT
PROTOTYPE : The app is still in proof-of-concept phase and only
core functionality, or specific parts of the application are working.
Major bugs are present.
ALPHA : Core functionality is generally
code- complete (built, but not fully tested).
Major bugs are still present, outlying
functionality may still not be present.
DEVELOPMENT
BETA : Most functionality is now complete and has had at least light
testing and bug fixing. Major known issues may still be present.
RELEASE CANDIDATE : All functionality is complete and tested.
Barring new bugs, the app is a candidate for release to the wild.
TESTING
FINAL BUILD : It’s incredibly important to test your application early
and often on actual devices. Even devices with the same hardware
specs can vary widely in their behavior.
FINAL RELEASE : The thoroughly tested and checked application is
finally made available to end users.
SUPPORT
Customer support is a range of customer services to assist customers
in making cost effective and correct use of a product. It includes
assistance in planning, installation, training, troubleshooting,
maintenance, upgrading, and disposal of a product.
React Native
● Javascript framework for creating native applications
● Released in 2015 by Facebook
● Open source!
● Allows to create iOS, Android and UWP applications
REACT NATIVE
React-Native is a programming language that allows developers to build cross-platform mobile
apps using JavaScript. With React-Native it’s possible to develop an app once and deploy it on
both iOS and Android. Although the apps are written in JavaScript, the apps will use the native
features of your device. This means that the app will have the look, the feel, and the
performance that matches the native platform. This is done by bridging these features to
JavaScript. Therefore, these apps are performant and truly native. React-Native is developed by
Facebook and used by big (tech) companies such as Walmart, Instagram, Airbnb, Tesla and
UberEATS. With a large community behind React-Native the platform is evolving every day.
What is React-Native?
I've heard that somewhere...
Ahhh, Apache Cordava, Phonegap, Ionic
Mobile application development React Native - Tidepool Labs
So what are the differences?
● No WebView/UIWebView
● No Hybrid applications
● Uses native components
This is love!!!
GET STARTED
● Buy Mac install Xcode/ or use Expo
● Install Node.js, npm
● npm install -g react-native-cli
● react-native init yourProject
● Open yourProject.xcodeproj and hit run in Xcode
● Open index .ios.js in text editor and edit some line
● Good luck
What is Expo?
Expo is a free and open-source toolchain around
React-Native to help developers build native iOS and
Android apps. The toolchain includes over the air
updates, easy build tooling and a lot of extra API’s on
top of React-Native.
Simple Code
Architecture
React Component
render: function(){
Return <div>Hi!</div>
}
React Component
render: function(){
Return <view>Hi!</view>
}
React js
React
native
Browser
DOM
IOS
Android
So this is cool.
But why? What’s its value?
Native is hard.
Native is necessary.
We want to build mobile
apps that feel native.
But we want to do it with
technologies we already
know
I don’t think you’ll be
disappointed.
Mobile application development React Native - Tidepool Labs

More Related Content

PDF
Building beautiful apps with Google flutter
PDF
Intro To React Native
PDF
Intro to react native
PPTX
React Native
PDF
Getting started with flutter
PPTX
How native is React Native? | React Native vs Native App Development
PDF
Mobile App Development
PDF
Introduction to react native
Building beautiful apps with Google flutter
Intro To React Native
Intro to react native
React Native
Getting started with flutter
How native is React Native? | React Native vs Native App Development
Mobile App Development
Introduction to react native

What's hot (20)

PPTX
Introduction to Android Development
PPTX
React native
PPTX
PPTX
Android app development
PPTX
PDF
React Native
PPTX
ReactJS presentation.pptx
PPTX
What is Flutter
PPTX
React Native
PDF
API for Beginners
PPTX
Hybrid Mobile App
PPTX
Appium ppt
PDF
Pune Flutter Presents - Flutter 101
PDF
Getting started with appium
PPT
Native, Web or Hybrid Mobile App Development?
PPTX
Top 11 Mobile App Development Frameworks
PDF
What is flutter and why should i care?
PPTX
Introduction to mobile application development
PPTX
Flutter workshop
Introduction to Android Development
React native
Android app development
React Native
ReactJS presentation.pptx
What is Flutter
React Native
API for Beginners
Hybrid Mobile App
Appium ppt
Pune Flutter Presents - Flutter 101
Getting started with appium
Native, Web or Hybrid Mobile App Development?
Top 11 Mobile App Development Frameworks
What is flutter and why should i care?
Introduction to mobile application development
Flutter workshop
Ad

Similar to Mobile application development React Native - Tidepool Labs (20)

PDF
10 stages of mobile app development process 2022
PDF
When to choose and avoid react native for mobile app development
PDF
React Native is the right fit for your mobile app development project_.pdf
PDF
How to Build a Hybrid App: A Detailed Outline
PDF
Reason to Choose React Native for App Development!.pdf
PDF
Guide to Create React Native App for Android & iOS Platforms
PDF
Top Mobile App Development Frameworks in 2022.pdf
PPTX
Presentation
PDF
Hybrid mobile application
PPTX
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
PDF
React Native Market Overview for Cross-Platform App Development.pdf
PPTX
Mobile Application Development Process
PDF
React Native App Development_ The Ultimate Guide In 2022.pdf
PDF
React Native App Development.
PPT
DroidCon 2011: Developing HTML5 and hybrid Android apps using Phonegap
PDF
The Complete React Native App Development Journey.pdf
PDF
This is the Ultimate Guide to React Native App Development.pdf
DOCX
What is Mobile Application Development_.docx
PPTX
Best cross platform app development frameworks for 2021
PDF
Why big organizations like tesla, facebook, walmart, skype are using react na...
10 stages of mobile app development process 2022
When to choose and avoid react native for mobile app development
React Native is the right fit for your mobile app development project_.pdf
How to Build a Hybrid App: A Detailed Outline
Reason to Choose React Native for App Development!.pdf
Guide to Create React Native App for Android & iOS Platforms
Top Mobile App Development Frameworks in 2022.pdf
Presentation
Hybrid mobile application
MOBILE APPLICATIONS DEVELOPMENT AND SERVICES.pptx
React Native Market Overview for Cross-Platform App Development.pdf
Mobile Application Development Process
React Native App Development_ The Ultimate Guide In 2022.pdf
React Native App Development.
DroidCon 2011: Developing HTML5 and hybrid Android apps using Phonegap
The Complete React Native App Development Journey.pdf
This is the Ultimate Guide to React Native App Development.pdf
What is Mobile Application Development_.docx
Best cross platform app development frameworks for 2021
Why big organizations like tesla, facebook, walmart, skype are using react na...
Ad

Recently uploaded (20)

PPTX
IOT PPTs Week 10 Lecture Material.pptx of NPTEL Smart Cities contd
PPTX
Geodesy 1.pptx...............................................
PPTX
Lesson 3_Tessellation.pptx finite Mathematics
PPTX
Engineering Ethics, Safety and Environment [Autosaved] (1).pptx
PPTX
UNIT-1 - COAL BASED THERMAL POWER PLANTS
PPTX
Fluid Mechanics, Module 3: Basics of Fluid Mechanics
PPTX
Welding lecture in detail for understanding
PDF
ETO & MEO Certificate of Competency Questions and Answers
PPTX
Strings in CPP - Strings in C++ are sequences of characters used to store and...
PPTX
CH1 Production IntroductoryConcepts.pptx
PDF
Embodied AI: Ushering in the Next Era of Intelligent Systems
PPTX
Unit 5 BSP.pptxytrrftyyydfyujfttyczcgvcd
PDF
Digital Logic Computer Design lecture notes
PPTX
MET 305 2019 SCHEME MODULE 2 COMPLETE.pptx
PDF
Operating System & Kernel Study Guide-1 - converted.pdf
PPTX
OOP with Java - Java Introduction (Basics)
PDF
July 2025 - Top 10 Read Articles in International Journal of Software Enginee...
PPTX
MET 305 MODULE 1 KTU 2019 SCHEME 25.pptx
PPTX
web development for engineering and engineering
PPT
Drone Technology Electronics components_1
IOT PPTs Week 10 Lecture Material.pptx of NPTEL Smart Cities contd
Geodesy 1.pptx...............................................
Lesson 3_Tessellation.pptx finite Mathematics
Engineering Ethics, Safety and Environment [Autosaved] (1).pptx
UNIT-1 - COAL BASED THERMAL POWER PLANTS
Fluid Mechanics, Module 3: Basics of Fluid Mechanics
Welding lecture in detail for understanding
ETO & MEO Certificate of Competency Questions and Answers
Strings in CPP - Strings in C++ are sequences of characters used to store and...
CH1 Production IntroductoryConcepts.pptx
Embodied AI: Ushering in the Next Era of Intelligent Systems
Unit 5 BSP.pptxytrrftyyydfyujfttyczcgvcd
Digital Logic Computer Design lecture notes
MET 305 2019 SCHEME MODULE 2 COMPLETE.pptx
Operating System & Kernel Study Guide-1 - converted.pdf
OOP with Java - Java Introduction (Basics)
July 2025 - Top 10 Read Articles in International Journal of Software Enginee...
MET 305 MODULE 1 KTU 2019 SCHEME 25.pptx
web development for engineering and engineering
Drone Technology Electronics components_1

Mobile application development React Native - Tidepool Labs

  • 2. Do you know? “In 2020 Expected Growth of Mobile App Revenue is 101 Billion US Dollars.” This statistic presents information on the projected mobile app revenues from 2015 to 2020. In 2015, global mobile app revenues amounted to 41.1 billion U.S. dollars. In 2020, consumers are projected to spend over 101 billion U.S. dollars on mobile apps via app stores.
  • 3. Mobile Application Development Process ● INITIATION ● DESIGN ● DEVELOPMENT ● ACCEPTANCE ● SUPPORT
  • 4. INITIATIONS Initiations talks about the transition of the project from sales team to technical team, where they do initial project kick off with the client and sales team to understand the requirement.
  • 5. DESIGN PROCESS FLOW : The Process Flow chart provides a visual representation of the steps in a process. Flow charts are also referred to as ProcessMapping or Flow Diagrams. WIRE FRAME : Elements visible on each of the screen of the mobile application are discussed and noted down as wireframes
  • 6. DESIGN STORYBOARD : Everything including the images to be shown, icons appearing, theme, color, background, etc is a part of storyboard. ARCHITECTURE DESIGN : Planning and development of application architecture is performed. Coding is done to give life to the application. TEST PLANNING : The application is tested for bugs by running various programs, performing checks at different conditions to ensure it is robust and flawless.
  • 7. DEVELOPMENT PROTOTYPE : The app is still in proof-of-concept phase and only core functionality, or specific parts of the application are working. Major bugs are present. ALPHA : Core functionality is generally code- complete (built, but not fully tested). Major bugs are still present, outlying functionality may still not be present.
  • 8. DEVELOPMENT BETA : Most functionality is now complete and has had at least light testing and bug fixing. Major known issues may still be present. RELEASE CANDIDATE : All functionality is complete and tested. Barring new bugs, the app is a candidate for release to the wild.
  • 9. TESTING FINAL BUILD : It’s incredibly important to test your application early and often on actual devices. Even devices with the same hardware specs can vary widely in their behavior. FINAL RELEASE : The thoroughly tested and checked application is finally made available to end users.
  • 10. SUPPORT Customer support is a range of customer services to assist customers in making cost effective and correct use of a product. It includes assistance in planning, installation, training, troubleshooting, maintenance, upgrading, and disposal of a product.
  • 12. ● Javascript framework for creating native applications ● Released in 2015 by Facebook ● Open source! ● Allows to create iOS, Android and UWP applications REACT NATIVE
  • 13. React-Native is a programming language that allows developers to build cross-platform mobile apps using JavaScript. With React-Native it’s possible to develop an app once and deploy it on both iOS and Android. Although the apps are written in JavaScript, the apps will use the native features of your device. This means that the app will have the look, the feel, and the performance that matches the native platform. This is done by bridging these features to JavaScript. Therefore, these apps are performant and truly native. React-Native is developed by Facebook and used by big (tech) companies such as Walmart, Instagram, Airbnb, Tesla and UberEATS. With a large community behind React-Native the platform is evolving every day. What is React-Native?
  • 14. I've heard that somewhere...
  • 15. Ahhh, Apache Cordava, Phonegap, Ionic
  • 17. So what are the differences? ● No WebView/UIWebView ● No Hybrid applications ● Uses native components
  • 19. GET STARTED ● Buy Mac install Xcode/ or use Expo ● Install Node.js, npm ● npm install -g react-native-cli ● react-native init yourProject ● Open yourProject.xcodeproj and hit run in Xcode ● Open index .ios.js in text editor and edit some line ● Good luck
  • 20. What is Expo? Expo is a free and open-source toolchain around React-Native to help developers build native iOS and Android apps. The toolchain includes over the air updates, easy build tooling and a lot of extra API’s on top of React-Native.
  • 22. Architecture React Component render: function(){ Return <div>Hi!</div> } React Component render: function(){ Return <view>Hi!</view> } React js React native Browser DOM IOS Android
  • 23. So this is cool. But why? What’s its value?
  • 26. We want to build mobile apps that feel native.
  • 27. But we want to do it with technologies we already know
  • 28. I don’t think you’ll be disappointed.