IP QB Sol

1. Explain client-server communication in detail

Client: When we talk the word Client, it mean to talk of a person or an organization
using a particular service. Similarly in the digital world a Client is a computer
(Host) i.e. capable of receiving information or using a particular service from the
service providers (Servers).
Servers: Similarly, when we talk the word Servers, It mean a person or medium
that serves something. Similarly in this digital world a Server is a remote computer
which provides information (data) or access to particular services
So, its basically the Client requesting something and the Server serving it as long as
its present in the database.
There are few steps to follow to interacts with the servers a client.
 User enters the URL(Uniform Resource Locator) of the website or file.
The Browser then requests the DNS(DOMAIN NAME SYSTEM) Server.
 DNS Server lookup for the address of the WEB Server.
 DNS Server responds with the IP address of the WEB Server.
 Browser sends over an HTTP/HTTPS request to WEB Server’s
IP (provided by DNS server).
 Server sends over the necessary files of the website.
 Browser then renders the files and the website is displayed. This rendering
is done with the help of DOM (Document Object Model)
interpreter, CSS interpreter and JS Engine collectively known as
the JIT or (Just in Time) Compilers.

2. Explain features of html5

HTML5 is the next major revision of the HTML standard superseding HTML 4.01, XHTML
1.0, and XHTML 1.1. HTML5 is a standard for structuring and presenting content on the World
Wide Web.
HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web
Hypertext Application Technology Working Group (WHATWG).
The new standard incorporates features like video playback and drag-and-drop that have been
previously dependent on third-party browser plug-ins such as Adobe Flash, Microsoft
Silverlight, and Google Gears.
HTML5 introduces a number of new elements and attributes that can help you in building
modern websites. Here is a set of some of the most prominent features introduced in HTML5.
 New Semantic Elements − These are like <header>, <footer>, and <section>.
  Forms 2.0 − Improvements to HTML web forms where new attributes have
been introduced for <input> tag.
 Persistent Local Storage − To achieve without resorting to third-party plugins.
 WebSocket − A next-generation bidirectional communication technology for
web applications.
 Server-Sent Events − HTML5 introduces events which flow from web server
to the web browsers and they are called Server-Sent Events (SSE).
 Canvas − This supports a two-dimensional drawing surface that you can
program with JavaScript.
 Audio & Video − You can embed audio or video on your webpages without
resorting to third-party plugins.
 Geolocation − Now visitors can choose to share their physical location with
your web application.
 Microdata − This lets you create your own vocabularies beyond HTML5 and
extend your web pages with custom semantics.
 Drag and drop − Drag and drop the items from one location to another location
on the same webpage.

3. Diff bet html & html5

4. Structure of html5
5. Explain html5 control elements/semantics
6. WAP to insert media elements
(img,audio,video,hyperlink)
HTML5 introduced 5 most popular media element tags i.e. <audio>, <video>,
<source>, <embed>, <track>. These media element tags changed the entire
development using HTML.
Media Tags:
 <audio>: It is an inline element that is used to embed sound files into a
web page.
 <video>: It is used to embed video files into a web page.
 <source>: It is used to attach multimedia files like audio, video, and
pictures.
 <embed>: It is used for embedding external applications which are
generally multimedia content like audio or video into an HTML
document.
 <track>: It specifies text tracks for media components audio and video.
<audio> Tag: It is a useful tag if you want to add audio such as songs, or any sound
files into your webpage.
 Syntax:
 <audio>
 <source src="sample.mp3" type="audio/mpeg">
 </audio>
<video>: It is a standard way to embed a video into your web page.
 Syntax:
 <video src="" controls> </video>
<embed>: It is used as a container for embedding plug-ins such as flash animations.
 Syntax:
 <embed attributes>
<img src="filename.extension">

7. What is css3. State adv

CSS3 stands for Cascading Style Sheet level 3, which is the advanced version of
CSS. It is used for structuring, styling, and formatting web pages. Several new
features have been added to CSS3 and it is supported by all modern web browsers.
The most important feature of CSS3 is the splitting of CSS standards into separate
modules that are simpler to learn and use.
We will see the advantages of CSS3 over CSS, and also discuss why CSS3 gained
such huge popularity in a short amount of time.
 Responsiveness: CSS3 inherently supports responsive design, and is
equipped to handle media queries. Media queries help in making a website
responsive as we can apply personalized CSS properties for different
screen widths. Thus, the website looks good in every device it is accessed
from.
 Colors: New color formats like RGBA(Red, Green, Blue, Alpha),
HSL(Hue, Saturation, Lightness), HSLA(Hue, Saturation, Lightness,
Alpha) were added. It helps the web designers as it helps them in applying
styling and different color effects into their pages. The gradient and
opacity properties were also added.
 Reduced the Alignment Problems: The box-sizing has fixed some
annoying alignment problems as now the developers can give appropriate
size to the divisions using properties like padding, margin, etc. It helps in
creating complex web page structures. The CSS grid helps in creating
responsive web pages without using the table rows and columns. Thus, the
alignment problems were solved and making the websites mobile friendly
became easier.
 Animations: CSS requires the developer to create animation using a
scripting language. On the other hand, CSS3 introduced animation
 features like text-shadow. It reduced the workload of the developers as
applying such animations were difficult earlier but with the introduction of
these new CSS properties, it becomes much easier.
 Compatibility: As already discussed earlier, at the time of its release,
CSS3 was not supported by many browsers and thus it took a while for the
developers to use to get a hold of this. But nowadays, every modern
browser supports CSS3 and that’s the reason why every website that is
built nowadays uses CSS3 instead of vanilla CSS.
 JavaScript Independence Faster Loading: As already discussed above,
earlier the developers had to mix JavaScript and CSS to provide even
simple decorations like text-shadow, etc. With the introduction of CSS3,
the dependence of CSS on JS got reduced, as a result of which, the loading
time of the web pages decreased.
 Testing: Earlier versions of CSS were a bit complex when it came to the
testing part. However, CSS3 has been divided into smaller modules which
makes it easier for the user to run compatibility tests and test the parts
individually. Therefore, bug detection becomes easier and it saves a lot of
time and energy for the hassle.
 Platform Friendly: CSS3 is compatible with all the platforms or devices
like mobile phones, tablets, etc.
 Border Radius: The border-radius CSS property helps in making the
borders of the images and the div elements rounded in shape, an effect that
required a lot of formatting and photoshop work to achieve before.
Another biggie is its support of rounded image corners. Other properties
like shadowing have also been added.

8. List down types of css3. Explain any 1 with eg

Inline CSS
Inline CSS is used to style a specific HTML element. Add a style attribute to each
HTML tag without using the selectors. Managing a website may difficult if we use
only inline CSS. However, Inline CSS in HTML is useful in some situations. We have not
access the CSS files or to apply styles to element.

In the following example, we have used the inline CSS in <p> and <h1> tag.

1. <!DOCTYPE html>
2. <html>
3. <body style="background-color:white;">
4. <h1 style="color:Red;padding:20px;">CSS Tutorials</h1>
5. <p style="color:blue;">It will be useful here.</p>
6. </body>
 7. </html>

Pros of inline CSS:

o We can create CSS rules on the HTML page.

o We cannot create and upload a separate document in inline CSS.

Cons of inline CSS:

o Inline CSS, adding CSS rules to HTML elements is time-

consuming and messes up the HTML structure.
o It styles multiple elements at the same time which can affect the page size and
download time of the page.

Module 2

1. Explain characteristics of javascript

JavaScript (js) is a light-weight object-oriented programming language which is used
by several websites for scripting the webpages. It is an interpreted, full-fledged
programming language that enables dynamic interactivity on websites when applied
to an HTML document. It was introduced in the year 1995 for adding programs to the
webpages in the Netscape Navigator browser. Since then, it has been adopted by all
other graphical web browsers. With JavaScript, users can build modern web
applications to interact directly without reloading the page every time. The traditional
website uses js to provide several forms of interactivity and simplicity.

Although, JavaScript has no connectivity with Java programming language. The name
was suggested and provided in the times when Java was gaining popularity in the
market. In addition to web browsers, databases such as CouchDB and MongoDB uses
JavaScript as their scripting and query language.

Features of JavaScript
There are following features of JavaScript:

1. All popular web browsers support JavaScript as they provide built-in execution
environments.
 2. JavaScript follows the syntax and structure of the C programming language. Thus, it is
a structured programming language.
3. JavaScript is a weakly typed language, where certain types are implicitly cast
(depending on the operation).
4. JavaScript is an object-oriented programming language that uses prototypes rather
than using classes for inheritance.
5. It is a light-weighted and interpreted language.
6. It is a case-sensitive language.
7. JavaScript is supportable in several operating systems including, Windows, macOS, etc.
8. It provides good control to the users over the web browsers.

Application of JavaScript
JavaScript is used to create interactive websites. It is mainly used for:

o Client-side validation,
o Dynamic drop-down menus,
o Displaying date and time,
o Displaying pop-up windows and dialog boxes (like an alert dialog box, confirm dialog
box and prompt dialog box),
o Displaying clocks etc.

JavaScript Example
1. <script>
2. document.write("Hello JavaScript by JavaScript");
3. </script>
Features of Javascript
Scripting
Javascript executes the client-side script in the browser.

Interpreter
The browser interprets JavaScript code.
Event Handling
Events are actions. Javascript provides event-handling options.

Light Weight
As Javascript is not a compiled language, source code never changes to byte code before
running time. Low-end devices can also run Javascript because of its lightweight feature.

Case Sensitive
In Javascript, names, variables, keywords, and functions are case-sensitive.

Control Statements
Javascript has control statements like if-else-if, switch case, and loop. Users can write complex
code using these control statements.
Objects as first-class Citizens
Javascript arrays, functions, and symbols are objects which can inherit the Object prototype
properties. Objects being first-class citizens means Objects can do all tasks.

Supports Functional Programming

Javascript functions can be an argument to another function, can call by reference, and can
assign to a variable.

Dynamic Typing
Javascript variables can have any value type. The same variable can have a string value, an
integer value, or any other.
Client-side Validations
Javascript client-side validations allow users to submit valid data to the server during a form
submission.

Platform Independent
Javascript will run in the same way in all systems with any operating system.

Async Processing
Javascript async-await and promise features provide asynchronous nature. As the processes
run in parallel, it improves processing time and responsiveness.

Prototype-based
Javascript follows 'Object.prototype' functions instead of class inheritance.

2. Diff bet client side & server side scripting language

 3. Explain embedded JS in html page
You can embed JavaScript in an HTML document in the following ways:

 As statements and functions within a <SCRIPT> tag. See the following

section, "Using the SCRIPT tag".
 By specifying a file as the JavaScript source (rather than embedding the
JavaScript in the HTML). See "Specifying a file of JavaScript code".
 By specifying a JavaScript expression as the value for an HTML attribute.
See "Using JavaScript expressions as HTML attribute values".
 As event handlers within certain other HTML tags (mostly form elements).
See "Scripting event handlers".

Unlike HTML, JavaScript is case sensitive.

Using the SCRIPT tag
The <SCRIPT> tag is an extension to HTML that can enclose any number of
JavaScript statements as shown here:
<SCRIPT>
JavaScript statements...
</SCRIPT>
A document can have multiple SCRIPT tags, and each can enclose any number of
JavaScript statements

4. List down handling events in JS (not for iat)

5. Write syntax of JSON(JS object notation) along with
its features
 o JSON stands for JavaScript Object Notation.
o JSON is an open standard data-interchange format.
o JSON is lightweight and self-describing.
o JSON originated from JavaScript.
o JSON is easy to read and write.
o JSON is language independent.
o JSON supports data structures such as arrays and objects.

Features of JSON
o Simplicity
o Openness
o Self-Describing
o Internationalization
o Extensibility
o Interoperability
Why do we use JSON?
Since JSON is an easy-to-use, lightweight language data interchange format in
comparison to other available options, it can be used for API integration. Following are
the advantages of JSON:

o Less Verbose: In contrast to XML, JSON follows a compact style to improve its users'
readability. While working with a complex system, JSON tends to make substantial
enhancements.
o Faster: The JSON parsing process is faster than that of the XML because the DOM
manipulation library in XML requires extra memory for handling large XML files.
However, JSON requires less data that ultimately results in reducing the cost and
increasing the parsing speed.
o Readable: The JSON structure is easily readable and straightforward. Regardless of the
programming language that you are using, you can easily map the domain objects.
o Structured Data: In JSON, a map data structure is used, whereas XML follows a tree
structure. The key-value pairs limit the task but facilitate the predictive and easily
understandable model.

Module 3
1. Explain java servlet architecture
2. Explain lifecycle of servlet
 3. What is servlet & explain adv
Servlet technology is used to create a web application (resides at server side and
generates a dynamic web page).

Servlet technology is robust and scalable because of java language. Before Servlet,
CGI (Common Gateway Interface) scripting language was common as a server-side
programming language. However, there were many disadvantages to this technology.
We have discussed these disadvantages below.

There are many interfaces and classes in the Servlet API such as Servlet, GenericServlet,
HttpServlet, ServletRequest, ServletResponse, etc.

What is a Servlet?
Servlet can be described in many ways, depending on the context.

o Servlet is a technology which is used to create a web application.

o Servlet is an API that provides many interfaces and classes including documentation.
 o Servlet is an interface that must be implemented for creating any Servlet.
o Servlet is a class that extends the capabilities of the servers and responds to the
incoming requests. It can respond to any requests.
o Servlet is a web component that is deployed on the server to create a dynamic web
page.

There are many advantages of Servlet over CGI. The web container creates threads for
handling the multiple requests to the Servlet. Threads have many benefits over the
Processes such as they share a common memory area, lightweight, cost of
communication between the threads are low. The advantages of Servlet are as follows:

1. Better performance: because it creates a thread for each request, not process.
2. Portability: because it uses Java language.
3. Robust: JVM manages Servlets, so we don't need to worry about the memory
leak, garbage collection, etc.
4. Secure: because it uses java language.