KNOWLEDGE INSTITUTE OF TECHNOLOGY (AUTONOMOUS)

B.E/B.Tech. DEGREE EXAMINATIONS

Month & Year of Examinations.
Question Paper Code: :……………
Department INFORMATION TECHNOLOGY Semester V Regulation 2021
Sub Code & Sub
CCS332 & APP DEVELOPMENT
Name

PART A

Q. No. Answer Marks

1. Define web and mobile application.

One is for making mobile apps that function on the Google Play and App Store, while the other is
2
for developing web pages that run "on the web as well as on the Google Play and App Store."
Mobile Apps are software programs that run on smart phones and tablets.

2. Define frameworks.
A mobile development framework is a software framework that is designed to support mobile
2
app development. It is a software library that provides a fundamental structure to support the
development of applications for a specific environment.
3. Show that the importance of settings permissions in app development?
• Permissions allow certain restrictions to be imposed primarily to protect data and code. 2
Without these, codes could be compromised, resulting to defects in functionality.
4. What is Progressive Web App
A progressive web app (PWA) is an app that's built using web platform technologies, but that 2
provides a user experience like that of a platform-specific app. Like a website, a PWA can run on
multiple platforms and devices from a single codebase.
5. What is native app development?
The term native mobile app development refers to building a mobile app exclusively for a single
2
platform. The app is built with programming languages and tools that are specific to a single
native platform – iOS or Android
6. List the use of native applications.
 Better Performance.
 Advanced Customization
 Enhanced User Experience 2
 Greater Security
 Fewer Bugs
 Improved Scalability
7. What are native components? 2
Native components are user interface elements built into an operating system. They can be

Page 1 of 11
 applied in the application without writing custom code, making them very useful for developers.
8. What is the importance of having an emulator within the Android environment?
The emulator lets developers "play" around an interface that acts as if it were an actual mobile
device. They can write and test codes, and even debug. Emulators are a safe place for testing 2
codes especially if it is in the early design phase.

9. Write the examples of Hybrid Web App?

 Evernote.
 Amazon App Store.
 Instagram.
 Uber. 2
 Gmail.
 Twitter.
 Remote POS.
 Microsoft Teams.
10. Write the Features of hybrid applications

 The ability to function whether the device is connected or not;

 Integration with the mobile device's file system; 2

 Integration with web-based services

 An embedded browser to improve access to dynamic online content

PART B
11. (a) Explain in detail about native application development with example? 13
Native App
A native app is developed specifically for one platform. It can be installed through an
application store (such as Google Play Store or Apple’s App Store).
Example − Whatsapp, Facebook.
Benefits
o Native Apps live on the device and are accessed through icons on the
device home screen.
o They can take full advantage of all the device features − they can use
the camera, the GPS, the accelerometer, the compass, the list of contacts, and so
on.
o They can also incorporate gestures (either standard operating-system
gestures or new, and app-defined gestures).
o Native apps can use the device’s notification system and can work
offline.
o Publishers can make use of push-notifications, alerting users every time
a new piece of content is published or when their attention is required.
o Native Apps maintain UI design of each operating system, thus they
offer the best user experience.
o For example, a Native App can have a left-aligned header in Android
and a center-aligned header in iOS.
o Redistribution is easy, as it is found in app store.

Downside

Page 2 of 11
 o High cost for building the app : Native apps developed for one platform will not
run on another platform. An App built for Android will not run on iOS.
o We need to build a different App altogether for iOS.
o Because of this reason, we need to maintain multiple versions of the App.
o Even though you might publish native Apps, you’ll want to keep the mobile
website well maintained, as mobile brings more traffic.
o So maintenance is higher.
(Or)
(b) Discuss in detail about hybrid application development with example?
Hybrid App
Hybrid Apps are a way to expose content from existing websites in App format. They can
be well described as a mixture of Web App and Native App.
Example − Instagram, Wikipedia.
Benefits
o Developing a Hybrid App is cheaper than developing a Native App. It
can be built for cross-platforms, i.e., reduced cost for App development.
o Maintenance is simple, as there are not many versions to be maintained.
o It can take advantage of a few features available in the device.
o It can be found in the App Store, which makes the distribution easy.
o It has a browser embedded within the app only.
Downside
o Graphics are less accustomed with the operating system as compared to Native
Apps.
o Hybrid Apps are slower than Native Apps.

12. (a) Describe in detail about cross platform application development with example?
What is cross-platform mobile development?
 Cross-platform mobile development is an approach to developing software
applications that are compatible with multiple mobile operating systems (OSes) or
platforms.
 These apps are platform-agnostic, meaning they can be used regardless of the
OS powering the mobile device.
The need for cross-platform mobile development
 Originally, the complexity of mobile app development was compounded by the
difficulty of building out a back end that worked across multiple platforms.
 Although it was time-consuming and expensive, it was often easier to build native
applications for each mobile OS.
 The problem was that the code built for one operating system could not be
repurposed for another OS.
 Cross-platform development provides a solution to those challenges.
Native vs. cross-platform development
 Native applications are loyal (or native) to a particular OS.
 Thus, native apps created for Android devices will not work on iOS devices, and
vice versa. For the app to run on other platforms, developers must create multiple
versions, which requires additional coding effort.
 This effort adds to development time as well as costs.
 In addition to accommodating a particular OS, native apps are coded in a particular
programming language.
 Often, the language is Objective-C or Swift for iOS, and Java, C or C++ for
Android.

Page 3 of 11
 Even though native apps have several disadvantages, they do have some benefits as well,
including the following:
 More reliable performance on the intended mobile OS.
 Can fully use the features and capabilities of the device.
 More responsive.
 Can have a more intuitive interface.
 Often deliver a better user experience (UX).
Benefits of cross-platform mobile development
 Cross-platform apps have shareable code that can be reused across multiple
platforms.
 A single codebase speeds up development and cuts development costs,
particularly for repetitive tasks like data serialization and API calls.
 Faster development usually translates to faster time to market.
 Adopting the cross-platform approach enables project managers to use their
development resources more effectively since they don't have to assign separate
resources for developing apps for different platforms.
Drawbacks of cross-platform mobile development
 Performance glitches are the most common issue with cross-platform apps.
 Many such apps have limited functionality since they cannot support many native-
only functions of mobile devices, such as advanced graphics.
 Poor design is another common problem, resulting in poor UX.
That said, improvements to development technologies and frameworks are helping to
overcome these issues and create cross-platform apps that have the following
characteristics:
 Flexible.
 Adaptable.
 Stable.
 High performing.
 Highly functional.
 Able to deliver good UX.
Popular cross-platform development frameworks
 Xamarin.
 Flutter.
 React Native.
 Ionic.
 Sencha.
(Or)
(b) Explain in detail about Progressive Web Apps with example?
 The web is an incredible platform.
 Its mix of ubiquity across devices and operating systems, its user-centered security
model, and the fact that neither its specification nor its implementation are controlled
by a single company makes the web a unique platform to develop software on.
 Combined with its inherent link ability, it's possible to search it and share what
you've found with anyone, anywhere.
 Whenever you go to a website, it's up-to-date, and your experience with that site can
be as ephemeral or as permanent as you'd like.
 Web applications can reach anyone, anywhere, on any device with a single codebase.
 Platform-specific applications are known for being incredibly rich and reliable.
 They're ever-present, on home screens, docks, and taskbars.
 They work regardless of network connection.
 They launch in their own standalone experience.

Page 4 of 11
  They can read and write files from the local file system, access hardware connected
via USB, serial port, or blue tooth, and even interact with data stored on your device,
such as contacts and calendar events.
 In these applications, you can do things such as take pictures, see playing songs listed
on the home screen, or control song playback while in another app.
 Platform-specific applications feel like part of the device they run on.

 Capabilities vs. reach of platform-specific apps, web apps, and progressive web apps.
 If you think about platform-specific apps and web apps in terms of capabilities and
reach, platform-specific apps represent the best of capabilities whereas web apps
represent the best of reach.
 So where do Progressive Web Apps fit in?
 Progressive Web Apps (PWA) are built and enhanced with modern APIs to deliver
enhanced capabilities, reliability, and installability while reaching anyone, anywhere,
on any device with a single codebase.
The three app pillars #
Progressive Web Apps are web applications that have been designed to be capable,
reliable, and installable. These three pillars transform them into an experience that feels
like a platform-specific application.
Capable #
 The web is quite capable in its own right today.
 For example, you can build a hyper-local video chat app using WebRTC,
geolocation, and push notifications.
Reliable #
 A reliable Progressive Web App feels fast and dependable regardless of the
network.
 Speed is critical for getting users to use your experience.
Installable #
 Installed Progressive Web Apps run in a standalone window instead of a browser
tab.
 They're launchable from on the user's home screen, dock, taskbar, or shelf.

13. (a) Discuss in detail about Benefits, Scenarios and Tools for creating Native App with
example?
What is native app development?
The term native mobile app development refers to building a mobile app exclusively for a
single platform. The app is built with programming languages and tools that are specific to
a single platform. For example, you can develop a native Android app with Java or Kotlin

Page 5 of 11
 and choose Swift and Objective-C for iOS apps
Benefits of Native App:
 Better Performance - better performance than cross-platform or hybrid solutions.
 Advanced Customization. ...
 Enhanced User Experience. ...
 Greater Security. ...
 Fewer Bugs. ...
 Improved Scalability. ...
 Easier Launch to the Market. ...
 Instant Updating
Scenarios to create Native App
Example :
 Facebook
 Walmart - online retailer
 Instagram
 Gyroscope - health app
 Wix - provides web hosting and website design services.
 navigation programs, such as Waze, to social apps, such as Twitter, or games,
such as Pokemon GO.
Tools for creating Native App
 Appcelerator - Appcelerator is a mobile app development tool which speeds up
time to market with cross-platform development and testing and simplified access
to date via optimised APIs
 Xamarin.

 Adobe PhoneGap

 Ionic.

 React Native

 MobiLoud.

 Ninox.

 Sencha.
(Or)
(b) Explain in detail about Native App Development Frameworks with example?
Native App Development Frameworks

 Native Script is an accessible framework that uses Angular, Typescript, JavaScript,

and CSS to develop native mobile applications.
 The native mobile app development is the most common type of mobile apps.
 They are built for a specific platform and with the tools for this platform.
 iOS and Android platforms also have different mobile application design.
 Android requires coding in Java or Kotlin, using Android Studio for the
environment.
 iOS requires coding in Objective-C or Swift and the IDE is Xcode.
 Therefore, this approach requires at least two developers or even development teams
to build the two versions of one application.

Page 6 of 11
14. (a) Describe in detail about core components and native components in Native App with
example?
Native Components

In Android development, you write views in Kotlin or Java; in iOS development, you use
Swift or Objective-C. With React Native, you can invoke these views with JavaScript using
React components. At runtime, React Native creates the corresponding Android and iOS
views for those components. Because React Native components are backed by the same
views as Android and iOS, React Native apps look, feel, and perform like any other apps.
We call these platform-backed components Native Components.

React Native comes with a set of essential, ready-to-use Native Components you can use to
start building your app today. These are React Native's Core Components.

React Native also lets you build your own Native Components for Android and iOS to suit
your app’s unique needs. We also have a thriving ecosystem of these community-
contributed components. Check out Native Directory to find what the community has been
creating.
Core Components

React Native has many Core Components for everything from controls to activity indicators.
You can find them all documented in the API section. You will mostly work with the
following Core Components:

Page 7 of 11
 (Or)
(b) Discuss in detail about JavaScript XML in detail?
React JSX
 As we have already seen that, all of the React components have a render function.
 The render function specifies the HTML output of a React component.

 JSX(JavaScript Extension), is a React extension which allows writing JavaScript code

that looks like HTML.

 In other words, JSX is an HTML-like syntax used by React that extends ECMA Script
so that HTML-like syntax can co-exist with JavaScript/React code. The syntax is used
by pre processors to transform HTML-like syntax into standard JavaScript objects that
a JavaScript engine will parse.

 JSX provides you to write HTML/XML-like structures (e.g., DOM-like tree structures)
in the same file where you write JavaScript code, then pre processor will transform
these expressions into actual JavaScript code.

 Just like XML/HTML, JSX tags have a tag name, attributes, and children.

Example

Here, we will write JSX syntax in JSX file and see the corresponding JavaScript code
which transforms by pre processor.

JSX File

<div>Hello JavaTpoint</div>

Corresponding Output

1. React.createElement("div", null, "Hello JavaTpoint");

The above line creates a react element and passing three arguments inside where the first
is the name of the element which is div, second is the attributes passed in the div tag, and
last is the content you pass which is the "Hello JavaTpoint."

Why use JSX?

 It is faster than regular JavaScript because it performs optimization while
translating the code to JavaScript.
 Instead of separating technologies by putting markup and logic in separate files,
React uses components that contain both. We will learn components in a further
section.

 It is type-safe, and most of the errors can be found at compilation time.

 It makes easier to create templates.

Nested Elements in JSX

To use more than one element, you need to wrap it with one container element. Here, we
use div as a container element which has three nested elements inside it.

Page 8 of 11
 App.JSX

1. import React, { Component } from 'react';

2. class App extends Component{

3. render(){

4. return(

5. <div>

6. <h1>JavaTpoint</h1>

7. <h2>Training Institutes</h2>

8. <p>This website contains the best CS tutorials.</p>

9. </div>

10. );

11. }

12. }

13. export default App;

15. (a) Explain in detail about the working model of hybrid application?
How hybrid applications work
 Hybrid apps work in the same manner as web apps, but are downloaded to the device
like native apps.
 Similar to web apps, developers typically write hybrid apps in HTML5, CSS and
JavaScript.
 Hybrid apps run code inside a container.
 The device's browser engine renders HTML, JavaScript and native APIs to access
device-specific hardware.
 Although a hybrid app will typically share similar navigation elements as a web app,
whether the application can work offline depends on its functionalities.
 If an application does not need support from a database, developers can make it
function offline.

Page 9 of 11
 (Or)
(b) Explain in detail about the Criteria need for creating Hybrid Application?
Criteria for creating Hybrid App

1)Platform Support:
 Identify target platforms (iOS, Android, Windows, etc.).
 Choose a hybrid framework that supports the desired platforms.
 Ensure seamless functionality and user experience across all supported platforms.
2)User Experience:
 Aim for a seamless and native-like UX.
 Prioritize performance and responsiveness.
 Implement smooth animations for a positive user experience.
 Ensure consistent behavior across different platforms.
3) App Complexity:
 Assess the app's complexity and feature requirements.
 Determine if a hybrid approach can fulfill all functionalities.
 Consider whether certain features might benefit from native development.
 Balance trade-offs between hybrid development efficiency and native capabilities.
4) Development Speed:
 Hybrid apps have shorter development time due to code reusability.
 Consider time-to-market for faster app deployment.
 Utilize a single codebase to expedite development across platforms.
 Leverage pre-designed UI components for quicker UI development.
5) Developer Skillset:
 Consider the development team's expertise in web technologies (HTML, CSS,
JavaScript).
 Proficiency in web technologies makes a hybrid approach more suitable.
 Utilize existing skills for building the app's frontend using web technologies.
 Minimize the learning curve for the development team.
6) App Performance:
 Evaluate performance, particularly for resource-intensive tasks.
 Optimize the app to ensure smooth operation on different devices.
 Test the app on various devices and operating systems for performance
consistency.
 Address bottlenecks and implement efficient algorithms for improved performance.
7) Community and Support:
 Assess the community and support for the chosen hybrid framework.
 Active community support can provide valuable assistance during development.
 Access to forums, documentation, and tutorials aids problem-solving.

Page 10 of 11
  Consider the framework's popularity and active development community.
PART C
Apply the looping statement in android application display the number of items.

% design pattern
for i = start_value:by_count:finish_value
do something
end

16. (a)
% example: sum numbers from 1 to 10
total = 0;
for i = 1 : 10
total = total + i;
end

(Or)
Apply the looping statement in android application to create of student database.

(b)

Signature with name BOS Chairperson/HoD

Page 11 of 11