UNIT 2 aligned - unit 2 app development

Downloaded by Krishnaveni Subbarayalu ([email protected])

UNIT II

NATIVE APP DEVELOPMENT USING JAVA

Native Web App, Benefits of Native App, Scenarios to create Native App, Tools for creating
Native App, Cons of Native App, Popular Native App Development Frameworks, Java
&Kotlin for Android, Swift & Objective-C for iOS, Basics of React Native, Native
Components, JSX, State, Props

Native Web App

A native app refers to a software program specifically written and created to work on
platforms and devices where it can be preinstalled, downloaded, configured, and updated to
the latest version via an app marketplace
A native application that is live on a device can be accessed through a home screen
icon. It alerts the user of notifications, and it is capable of functioning offline as well.

Benefits of Native Apps

Here are some of the most prominent native app benefits:
• Security and Reliability
• Optimal Performance
• Access to All Built-In Device Hardware Features
• Improved User Experience
• Increased Scalability
• Fewer Bugs
• Instant Updating
• Works in Offline Mode
Security and Reliability
A native application is likely to have lesser platform-specific vulnerabilities than
hybrid apps that depend highly on a browser security system.
It is robustly protected against misuse due to the multiple layers of the operating system’s
security. A native app undergoes security inspection on every one of these layers and through
each system or version upgrade.
Optimal Performance
Native apps encounter fewer bugs. Operating faster and more efficiently than with
alternative apps, a native application is generally favorably responsive and dependable.

Downloaded by Krishnaveni Subbarayalu ([email protected])

 This ensures user satisfaction. Also, because they encounter fewer bugs, users find
themselves free from worrying over the app’s shutting down amid usage.
They even have commendable offline performance. After installation and during
online operation, a native app maximizes its in-browser caching attribute, enabling
availability in offline mode derived from its cached resources.

Access to All Built-In Device Hardware Features

Since a native application has high compatibility with specified platforms, its users
can configure direct integration with the gadget’s hardware like microphone and camera.

Advanced Customization Options

Native apps have full access to operative systems or device features, which can be highly
customized.
Developers don’t have limitations; they can access all parts of hardware that help create a
unique user interface (UI) and user experience (UX).
For example, they can utilize a microphone function for sound effects or a camera for
filters.

Improved User Experience

Every platform has its own UI/UX guidelines developers must follow. With native
apps, these standards are rigorous, guaranteeing a consistent look and feel with the operating
system.
The consistency of native mobile apps provides a much more intuitive and interactive user
experience. Native apps are much faster and more efficient than web apps, which further
enhances the user experience.

Increased Scalability

Native apps offer increased scalability, they can easily handle an increase in the
number of users or amount of data being processed without sacrificing performance.

Downloaded by Krishnaveni Subbarayalu ([email protected])

This is because native apps efficiently use the hardware or given platform, with minimum
risk of crashing in case of extreme traffic increase.
Native apps can also be updated and improved over time to meet the changing needs of a
growing user base.

Fewer Bugs
Native apps are designed for a specific operating system, such as iOS and Android,
and they use programming languages and software development tools optimized for that
platform.
Compared to web apps, which are designed to run on multiple platforms and may have
compatibility issues, native apps result in fewer bugs and errors, providing a more stable and
reliable user experience and leading to higher user satisfaction and retention.

Instant Updating
Android and iOS frequently release updates and developers must instantly implement
them into the apps to preserve a satisfying user experience. This struggle doesn’t affect native
apps because they have instant updates.

Works in Offline Mode

Unlike cross-platform apps, native apps will work even when the Internet is
unavailable. For example, you are driving, and the Internet is not stable en route.

When built using the native app development approach, this app will run even though
there is no stable connection.

Drawbacks of a Native App

Cost
The overall cost involved in the development and maintenance of a native app
is considerably higher. This is due to the fact that there should be separate versions of the
same application. Even substantial amount is needed to maintain the app. But still, native
apps are cost effective in the long run.

Development
Developing a native app is a difficult process since separate developers are needed for
each platform. For an example, different developers must be hired to develop Android and

Downloaded by Krishnaveni Subbarayalu ([email protected])

IOS version of the same application. Moreover, it is not an easy task to develop native apps.
It is incorporated with tough challenges.

Time Consumption

Since native apps are developed for multiple platforms, it requires more time. Native
apps may require significant amount of time for making compared to their counterparts.
Developers of native app have to take time to write codes for specific O/S.

Updates
Developers often come up with new updates in native apps for various reasons. Most
often for fixing bugs and glitches. Hence, necessary updates needs to be implemented
in app store so that so that users will be able to download them. Now the problem comes if
the user isn’t aware of such updates or skips them to save storage space.

Download Requirement
Prior to using a native app, it is a must to download it from either App store or Plays
store. There are several process involved in downloading a native app. They must find the
app, go though the terms & conditions and then go with the download process. Sometimes
the download process can be lengthy that the users wouldn't have patience.

Frequency of Updates and Too Much Storage Requirements

While the regular introduction of newer versions and upgrades is necessary to fix
bugs and rectify errors and malfunctions, it can be tedious and disruptive for the end users.
On top of that, these updates also take up a sizeable amount of device storage space.

Monetization of a Native Application

Native app developers can charge for every download. The payment process will go
through the app store or shop which will take a percentage of the fees.

Downloaded by Krishnaveni Subbarayalu ([email protected])

 Native Apps – Pros & Cons
The benefits of Native Apps are:
• Easier & faster
• Rich functionalities
• Mutually offline & online features
• Confident, safe & secure

The disadvantages of Native Apps are:

• Expensive to maintain
• No compatibility of cross-platforms
• Affluent maintenance
• Limited apprises

Major examples of popular mobile native apps are:

• Messaging – WhatsApp
• Navigation program – Waze
• Social Media application – Twitter
• Game – Pokémon GO

Stages of App Development Process:

1. Validate the Idea to Decide the Core Concept
2. Build a User Persona to Understand the Target Audience
3. Conduct Competitor Analysis to Understand Your Competitor
4. Plan for UI/UX to Design Engaging Mobile App
5. Choose the Platform Between Native & Cross-platform
6. Identify Monetization Options to Build Profitable Mobile App
7. Make your App Secure

Validate the Idea to Decide the Core Concept

Having a concept for native mobile apps is not enough; you need to validate it for the
app market. Check if people are ready to embrace the mobile app you plan to develop.
Also, identify the following points to validate your idea clearly.

Downloaded by Krishnaveni Subbarayalu ([email protected])

• Your application will solve a real problem
• Do people consider it to be a problem
• Are they looking for a solution?
• Will they accept the mobile app as their solution?

Build a User Persona to Understand the Target Audience

It is important to understand the users for both Android and iOS mobile app
development platforms. The users will react differently to iOS and Android apps.
The initial step is to study the user, build separate personas and user insights play a
pivotal role when it comes to answering questions like how to create an app.
• How do the users move through the app?
• What are some of the things they take for granted in an app?
• How do they use the app?
• What makes them engage with native and hybrid apps?
• How do users access mobile apps?

Conduct Competitor Analysis to Understand Your Competitor

Understanding the users or the market is not enough when developing native apps;
you should also know your competition.Your competitors are not limited to native mobile
apps; they extend to cross-platform and web apps. The businesses with cross-platform apps
are your biggest competitors as they have an extensive reach.
• How are they marketing their apps?
• What are the optimization strategies?
• Why do people use apps for multiple platforms?
• What are the gaps that exist in the apps?
• What kind of feedback is the user giving?
•
Plan for UI/UX to Design Engaging Mobile App

Planning for user experience is one of the most crucial steps of native app
development. Apart from this, You should identify your users, how they operate mobile apps,
and what makes them tick.

It is equally important to know how they hold their phones, what apps they mostly use, and
what makes them love these apps.

Downloaded by Krishnaveni Subbarayalu ([email protected])

 • What are the pain points users experience?
• What makes you frustrated when using the mobile app?
• What are some things you believe should be included in an app?

Choose the Platform Between Native & Cross-platform

You have already chosen between native and cross-platform app development and the
approach you want to take. It is time to choose the particular operating system for app
development.
The cost of app development will go up because you won’t use the same code for the
operating systems. The coding and development approach will change for the particular
operating system, so choosing the operating system before you proceed with development is
better.
You can opt for a native development approach to generate good revenue. However,
if reach matters the most, you should develop a native Android app.

Identify Monetization Options to Build Profitable Mobile App

As native app developers, you can plan to have a subscription strategy or in-app
advertisements to generate revenue. You can also use the freemium method to build a more
profitable mobile app.

Whether you are building hybrid apps or developing separate apps for Android and
iOS devices, having a monetization strategy comes in handy. It will help you realize how you
aim to translate your mobile app into a profitable business.

As native app developers, you can plan to have a subscription strategy or in-app
advertisements to generate revenue. You can also use the freemium method to build a more
profitable mobile app.

Make your App Secure

The Apple app store has a clear definition of a secure app. While the underlying technology
for both Android and iOS devices is secure, you should work in sync with the guidelines laid
by the app stores.

It will help build highly secure apps for the different platforms. Native apps generally are
considered to be safe and data-protective. However, you cannot take your chances.

• Check for all the data precautions you need to take with the particular platform
• Identify the compliances you need to include in the specific operating system

Downloaded by Krishnaveni Subbarayalu ([email protected])

• Plan for security and authentication for your native mobile applications

Mobile App Development Framework

Mobile App Development Framework is a library that offers the required fundamental
structure to create mobile applications for a specific environment. In short, it acts as a layout
to support mobile app development. There are various advantages of Mobile App
Development frameworks such as cost-effectiveness, efficiency, and many more. Moreover,
mobile application frameworks can be classified majorly into 3 categories: Native Apps, Web
Apps & Hybrid Apps.

Popular native app development frameworks are:

React Native:
React Native is one of the most recommended Mobile App Frameworks in the
development industry. The framework, created by Facebook, is an open-source
framework that offers you to develop mobile applications for Android & iOS platforms.
The React Native framework is based on React and JavaScript that aims to develop native
applications over hybrid applications that run on a web view. Moreover, it is a cross-platform
development framework that uses a single code base for both Android & iOS applications.
Some of the major benefits of React Native are mentioned below:
• Code Re-usability & Cost-Effective
• Compatible with third-party plugins
• Re-usable components for optimal performance
• Provides hot deployment features
• Ease of Maintenance
There are various renowned mobile applications built with React Native such
as Instagram, Soundcloud, Uber Eats, and many more.

Xamarin:
Xamarin is also one of the most popular open-source frameworks used to develop
mobile applications. The framework, acquired by Microsoft, is based on .Net and allows you
to build native applications for Android, iOS, and Windows platforms. Xamarin comes with
almost every required tool and library needed to build native applications and offers you to
create rich experiences using native UI elements. Moreover, Xamarin also supports the

Downloaded by Krishnaveni Subbarayalu ([email protected])

feature of sharing the common codebase to make the development process more efficient and
cost-effective. There are various benefits of Xamarin, some of these are mentioned below:
• Huge Community of around 1.4 million developers
• Native API Access & UI Support
• Easier API Integration
• Target All Platforms
• Cost-Effective & Faster Development Process
Some of the most popular and renowned mobile applications that are built on Xamarin are
– OLO, Alaska Airlines, Storyo, and many more.
Flutter
Flutter is an open-source mobile app SDK that was launched by Google. It’s Google’s
UI toolkit which is used to develop beautiful, natively compiled applications for mobile, web,
and desktop through a single code base.

Features:
• Fast development
• Built-in material design
• Increased time-to-Market speed
• Rich motion APIs
• Own rendering engine
• Strong widget support
• Similar to Native app performance

Examples:
• Alibaba
• Google Ads
• Reflectly
• Cryptography

Swift Objective C

• Clean code and fewer bugs and • It is compatible with C and C++ programming
Fast speed applications languages
• High performance and rapid • Been in use for several years; has a strong
application development community
• Auto tracking of memory usage • Flexible coding environment

Downloaded by Krishnaveni Subbarayalu ([email protected])

Java
Java is the most popular, widely used, object-oriented programming
language designed by James Gosling. Using Java, we can create a variety of applications such
as desktop applications, enterprise applications, cloud-based, and web-based applications.
Usually, it is used to develop the back-end. Java is the primary choice for the developers
when it comes to Android app development. Note that Android itself is written in Java.
Pros

• Memory is managed by the JVM automatically.

• It is more secure.
• Platform independent.
• Highly secure
• Provides vast community support.
Cons

• Syntaxes in Java are complex and large.

• Verbose and complex code.
• Its performance is poor.

Kotlin
Kotlin is also an object-oriented programming language just like Java developed by
JetBrains. It is a general-purpose, open-source, sterically-typed, cross-platform pragmatic
programming language with type inference. It is particularly designed to interoperate with
Java and also to improve the existing Java models by offering solutions to API design
deficiencies.

• Kotlin is specially designed for JVM and Android.

• Kotlin's standard library totally depends on the Java class library.
• It focused on safety, clarity, and interoperability.
• It is lightweight, clean, concise, and less verbose especially for writing callbacks, data
classes, and getter/setters.

Why Kotlin?

Kotlin is a modern, concise, interoperable, and safe programming language. It provides a

productive way to write a server-side application. It is compatible with the Java ecosystem
because we can use our favorite framework and libraries with it. It also saves time and effort.

Downloaded by Krishnaveni Subbarayalu ([email protected])

 o It supporting new JVM features, like string concatenation via invokedynamic.
o Improved performance and exception handling for KMM projects.
o Experimental extensions for JDK path Path("dir") / "file.txt".

Pros

o It is compatible with existing Java code.

o It is interoperable with Java.
o It increases team productivity.
o It is easily maintainable.
o It is less buggy and more reliable.
o Provides rich API for application development.

Cons

o The compilation speed of Kotlin is slow.

o It has a small developer community.
o Memory consumption is high.

Difference Between Java and Kotlin

Features Java Kotlin

Primitive Type Primitive types in Java are not objects. Primitive types are objects.

Product It is a product of Oracle Corporation. It is a product of JetBrains.

Used For It is used to develop stand-alone applications It is used to develop server-side

and enterprise applications. applications and android application
development.

Compilation Java's compilation time is pretty fast. Its compilation time is slow in comparison
Time to Java.

File Extensions Java uses the extensions: .java (for source Kotlin uses the extensions: .kt (for Kotlin
file), .class (for class file), .jar (for archived source file), .kts (for Kotlin script
file). file), .ktm (for Kotlin module)

Checked In Java, we take care of the checked exception There is no need to catch or declare any
Exceptions by using the try-catch block. exception.

Concise The code is not concise in comparison to Kotlin. It reduces the boilerplate code.

Extension We need to create a new class and inherit the We can extend a class with new

Downloaded by Krishnaveni Subbarayalu ([email protected])

Function parent class if we want to extend the functionality by using the extension
functionality of an existing class. So, the function.
extension function is not supported by Java.

Widening Java supports the implicit conversion so we can Kotlin does not support the implicit
Conversion convert a smaller type to a bigger one. conversion. So, we cannot convert the
smaller type to a bigger one.

Code The line of code is just doubled than Kotlin. It reduces the line of code to half.
Comparison

Community Java provides a very large community. Its community is not so huge as Java.
Support

Casting In Java, we need to identify and perform the Kotlin supports the smart cast, which
casting. means that it identifies the immutable type
and performs implicit casting
automatically.

Type interface It is mandatory to specify the data type, It is not mandatory to specify the type of
explicitly. variable, explicitly.

Null Values We can assign null values to variables but We cannot assign null values to any
cannot assign null values to an object. variable and objects.

Ternary It is available in Java. It does not support ternary operator.

Operator

Coroutines Multithreading feature of Java makes it more Like Java, we can create multiple threads
Support complex because managing the multiple threads (long-running intensive operations) in
is a difficult task. Java blocks the thread if we Kotlin also but coroutine can suspend a
initiate a long-running intensive operation like thread execution at a certain point without
network I/O or CPU operations. blocking the other threads.

Functional Java is not functional programming. It is a combination of functional and

Programming procedural programming language.

Data Classes If we need a class that can hold data only, for If we want to do the same in Kotlin, we
this we need to define getter, and setter declare the class with the keyword Data.
methods, constructors, and other functions. Rest the work such as creating
constructor, getter, and setter methods for
the fields are done by the compiler.

DOM

Downloaded by Krishnaveni Subbarayalu ([email protected])

 DOM stands for 'Document Object Model'. it is a structured representation of the
HTML elements that are present in a webpage or web app. DOM represents the entire UI of
your application. The DOM is represented as a tree data structure. It contains a node for each
UI element present in the web document.
It is a programming interface that allows us to create, change, or remove elements
from the document. We can also add events to these elements to make our page more
dynamic.
Virtual DOM
A virtual DOM object is the same as a real DOM object, except that it is a lightweight
copy. This means that it cannot manipulate on-screen elements. Moreover, upon any change
of a property, it only updates the corresponding nodes and not the entire tree. That makes it a
quick and efficient alternative.

React Native LifeCycle Methods

All React class components have their own phases.

When an instance of a component is being created and inserted into the DOM, it gets
properties, or props, and from now on they can be accessed using this.props.

Downloaded by Krishnaveni Subbarayalu ([email protected])

A component’s lifecycle can be divided into 4 parts:
• Mounting— an instance of a component is being created and inserted into the DOM.
• Updating — when the React component is born in the browser and grows by
receiving new updates.
• Unmounting— the component is not needed and gets unmounted.
• Error handling —called when there is an error during rendering, in a lifecycle
method, or in the constructor of any child component.
Lifecycle Phases

Mounting
These methods are called in the following order when an instance of a component is being
created and inserted into the DOM:

• constructor()
• static getDerivedStateFromProps()
• render()
• componentDidMount()

Downloaded by Krishnaveni Subbarayalu ([email protected])

Updating

An update can be caused by changes to props or state. These methods are called in the
following order when a component is re-rendered:

• static getDerivedStateFromProps()

• shouldComponentUpdate()

• render()

• getSnapshotBeforeUpdate()

• componentDidUpdate()

Unmounting

This method is called when a component is removed from the DOM:

• componentWillUnmount()
Error Handling :

These methods are called when there is an error during rendering, in a lifecycle
method, or in the constructor of any child component.

• static getDerivedStateFromError()

• componentDidCatch()

constructor()
the constructor method is called before mounting to the DOM and rendering.

• constructor initialize state and bind event handler methods within the
constructor method.

• This is the first part of the lifecycle and is only called when it is explicitly
declared,

• so there is no need to declare it in every component you create.

• If you need to make any additional properties or subscriptions in this method,

you should use componentDidMount().

• I will introduce it later on as we are going through each method the in order they are
invoked.

Downloaded by Krishnaveni Subbarayalu ([email protected])

static getDerivedStateFromProps() :
• Instead of calling setState, getDerivedStateFromProps simply returns an object
containing the updated state.
• This function is rarely used and this function has no properties - this is
intentional.
getDerivedStateFromProps may be called multiple times for a single update,
can use componentDidUpdate, which executes only once after the component
updates.
• You can either return an object to update the state of the component or return null to
make no updates
• this method allows a component to update its internal state in response to a change in
props. The component state reached in this manner is referred to as a derived state.
Render()
• The render() method is responsible for generating the component's virtual
DOM representation based on its current props and state.
• It is called every time the component needs to be re-rendered, either because
its props or state have changed, or because a parent component has been re-
rendered.
• after the static getDerivedStateFromProps method is called, the next lifecycle
method in line is the render method.
• The render method must return a React Native component (JSX element) to
render (or null, to render nothing).
Component DidMount()
• The componentDidMount() method is called once the component has been
mounted into the DOM.
• It is typically used to set up any necessary event listeners or timers, perform
any necessary API calls or data fetching, and perform other initialization tasks
that require access to the browser's DOM API.
Updating
Each time something changes inside our component or parent component, when the
state or props are changed, the component may need to be re-rendered. In simple terms, the
component is updated.
static getDerivedStateFromProps()

Downloaded by Krishnaveni Subbarayalu ([email protected])

 Firstly, the static getDerivedStateFromProps method is invoked. That’s the first
method to be invoked for updating.
this method is invoked in both the mounting and updating phases.
shouldComponentUpdate()
• By default, or in most cases, you want a component to re-render when the state or
props change.
• But you do have control over this behaviour.
• Here is the moment React decides whether we should update a component or not.
• Within this lifecycle method, you can return a boolean and control whether the
component gets re-rendered or not, i.e upon a change in the state or props.
• This lifecycle method is mostly used for performance optimisation measures.

ComponentDidUpdate()
• componentDidUpdate() is invoked immediately after updating occurs.
• This method is not called for the initial render.
• This is also a good place to do network requests as long as you compare the current
props to previous props
• (e.g. a network request may not be necessary if the props have not changed).

Unmounting

componentWillUnmount()
• componentWillUnmount() is invoked immediately before a component is unmounted
and destroyed.
• Perform any necessary cleanup in this method, such as invalidating timers, canceling
network requests, or cleaning up any subscriptions that were created
in componentDidMount().

static getDerivedStateFromError()

• Whenever an error is thrown in a descendant component, this method is called first,

and the error thrown is passed as an argument.

• Whatever value is returned from this method is used to update the state of the
component.

Downloaded by Krishnaveni Subbarayalu ([email protected])

Downloaded by Krishnaveni Subbarayalu ([email protected])