MET Institute of Engineering

Title of Seminar

REACT NATIVE

Presented By :-

AKSHAY BHUJBAL

Guided By –
Prof. M.V. KHOND

Department of MCA
 MET Institute of Engineering

CONTENT

1 3 5 7
2 4 6 8
INTRODUCTION WHY
COMPONENTS REFERENCE
REACT NATIVE REACT NATIVE
REACT NATIVE DEPLOYEMENT
PROS & CONS CONCLUSION
EXAMPLES PROCESS
 MET Institute of Engineering

REACT NATIVE INTRODUCTION

React Native is a popular JavaScript-based mobile app framework that allows you to build natively-rendered
mobile apps for iOS and Android.

The framework lets you create an application for various platforms by using the same codebase.

React Native was first released by Facebook as an open-source project in 2015. In just a couple of years, it
became one of the top solutions used for mobile development.

React Native uses a modular architecture that allows developers to use third-party libraries and tools to add
features and functionality to their apps.

Facebook Ads Manager is
an app used by advertisers
to create and manage their
Facebook ad campaigns,
using React Native to
ensure that the app works
well across different
platforms.
Examples of React Native Apps:
Tesla's mobile app, which
allows users to control
their cars and view
charging information, was
built using React Native to
ensure that it is responsive
and works well on both iOS
and Android.
MET Institute of Engineering
Walmart's app, which Airbnb is a popular app
allows users to shop used for booking
online, find deals, and vacation rentals. Airbnb
view their order history, rebuilt its app using
was built using React React Native to make it
Native to ensure that it faster and more efficient.
works well on both iOS
and Android.
 MET Institute of Engineering

OBJECTIVE C
22%

JAVA SCRIPT
40%

REACT NATIVE CORE

REACT NATIVE IS MADE WITH THESE

JAVA
31%
C/C++
7%
 MET Institute of Engineering

React Native Development Process

Adding
Fetching
Animations
Data from
APIs
Handling
Styling with User Input
UI Design with
React Native
StyleSheet 5
components 4
3
2
1

5-Step Ordering Process

 MET Institute of Engineering

WHY TO CHOOSE REACT NATIVE FOR MOBILE APP DEVELOPMENT

JavaScript High
Language Efficiency

Code Reusability Performance

REACT NATIVE
Support
Improved
Third-Party
UI/X
Libraries

Save Time & Great

Money Performance
 MET Institute of Engineering

Core Components and APIs

React Native provides a number of built-in Core Components ready for you to use in our app.

Basic Components 1

User Interface 2

List Views 3

Android-specific 4

OTHERS 5
 MET Institute of Engineering

Basic Components

Most apps will end up using one of these basic components.

VIEW TEXT TEXTINPUT

The most fundamental 2 A component for displaying A component for
1 3
component for building a text. inputting text into the
UI. app via a keyboard.

IMAGE
4 A component for
displaying images.
STYLESHEET
Provides an abstraction
5 6
layer similar to CSS
stylesheets.
SCROLLVIEW
Provides a scrolling
container that can host
multiple components and
views.
 MET Institute of Engineering

User Interface

These common user interface controls will render on any platform.

BUTTON SWITCH

A basic button component for

handling touches that should Renders a boolean input.
render nicely on any platform.
 MET Institute of Engineering

List Views

Unlike the more generic ScrollView, the following list view components
only render elements that are currently showing on the screen. This makes
them a performant choice for displaying long lists of data.

FLATLIST SECTIONLIST
A component for Like FlatList, but for
rendering sectioned lists.
performant

scrollable lists.

 MET Institute of Engineering

Android Components

and APIs
Many of the following components provide wrappers for commonly used
Android classes.

BUTTON SWITCH

A basic button component for

handling touches that should Renders a boolean input.
render nicely on any platform.

 MET Institute of Engineering

Android Components

and APIs
Many of the following components provide wrappers for commonly used
Android classes.

BackHandler DrawerLayoutAndroid PermissionsAndroid ToastAndroid

Detect Provides
hardware Renders a access to the Create an
button DrawerLayou permissions Android
presses for t on Android. model Toast alert.
back
introduced in

navigation.
Android M.
 MET Institute of Engineering

Others

These components may be useful for certain applications. For an exhaustive list of components and APIs,
check out the sidebar to the left (or menu above, if you are on a narrow screen).

Displays a circular loading

ACTIVITYINDICATOR Provides a general interface to
indicator.
LINKING interact with both incoming and
outgoing app links.

Launches an alert dialog

ALERT with the specified title and Component to control the app's
message. STATUSBAR status bar, typically at the top of the
screen..

A library for creating fluid,

ANIMATED powerful animations that are REFRESHCONTROL
This component is used inside a
easy to build and maintain. ScrollView to add pull to refresh
functionality.
 MET Institute of Engineering

PROS & CONS

BUILDS CROSS- BUILDS MOBILE APPS HELPS IN BUILDING

COST AND EFFORT-
USING WEB TECH RESPONSIVE AND UI-RICH
PLATFORM APPS SAVING
APP

NO LONG-TERM DOESN'T SUPPORT HIGHER

NO CLEAR PATENT RIGHTS DOESN'T SUPPORT
COMMITMENT ENSURED BY SECURITY
OF THE PLATFORM DECIMALS
FACEBOOK PROTOCOLS

 MET Institute of Engineering

REFERENCE

1
Brainstorming
and
https://www.google.com/
Idea Generation

2
Brainstorming
and
https://reactnative.dev/
Idea Generation
 MET Institute of Engineering

CONCLUSION

React Native has the highest performance among other frameworks.

Apps with this technology have a native look and feel. Indeed, React
Native is better & unique than other similar platforms.

Brainstorming and
Idea Generation
 MET Institute of Engineering

THANK YOU..