UNIVERSITY EXAMINATIONS: 2023/2024

EXAMINATION FOR THE DEGREE OF BACHELOR OF SCIENCE IN

INFORMATION COMMUNICATION TECHNOLOGY
BCT 2303:
SERVICE ORIENTED COMPUTING
CAT 2
EMMANUEL OUMA ODONDI
2105925
DATE: 12 MARCH, 2024 TIME: 1:30 HOURS

INSTRUCTIONS: Attempt all Questions

a) KCAU takes orders from customers, allow the customer to cancel the
orders and to view the outstanding orders. Explain the most effective
services to identify. (2 marks)
KCAU requires an Order Management System (OMS) as the foundation for order processing, which
includes order capture, tracking, inventory checks, and, perhaps, cancellation requests. A client
Relationship Management (CRM) system can be integrated with the OMS to manage client information
and history. A specified order cancellation protocol with clear criteria and customer contact is critical.
Finally, order reporting and analytics enable KCAU to discover trends and optimize operations.

b) Explain the web application development life cycle. (1 mark)

The web application development life cycle (WADLC) offers an organized way to developing web
applications.

1. Plan and Strategize: Determine your goals, target audience, features, and technology.

2. Design & Prototype: Create UI mockups and wireframes to help visualize the application.

3. Develop: Developers turn designs into practical web applications.

4. Test & Deploy: Thorough testing assures a high-quality application before launch.

5. Maintain and update: Continuous monitoring, issue corrections, and new features depending on
user feedback.

1
 c) With the aid of a diagram, explain the SOA communication infrastructure.
(2
marks)

SOA Communication Infrastructure.

Service-Oriented Architecture (SOA) is based on well-defined communication among independent

services. Here's a diagram that describes the major components:

Components:

1. Service Provider: A service that provides certain functionality (e.g., Order Processing).

2. Service Consumer: The application that requests functionality from the service (for example, the
KCAU web app).

3. Service Registry (Optional): A central repository of available services and access information.

4. Service Bus (Optional) is a middleware component that routes communications between services.

5. Communication Protocol: A standardized language for sharing data (such as SOAP or REST).

Data Flow:

1. The Service Consumer detects a required service and obtains its data via the Service Registry (if
applicable) or directly.

2. The Consumer sends a request message to the Service Provider over the Communication Protocol
of their choice.

3. The Provider receives the request, executes the function, and generates a response message.

4. The response message is transmitted back to the Consumer via the same communication channel.

2
3
 d) Discuss any three principles of user Interface Design that you would apply
to improve the quality of user interface design. (1.5 marks)
1. Consistency: Users form mental models of how an interface works based on their first
interactions. Maintaining uniformity in layout, navigation, vocabulary, and visual style across
all parts results in a more familiar and predictable experience. This decreases cognitive stress
and helps users to concentrate on getting jobs done efficiently.

2. clarity and simplicity: A clear, uncluttered design is easy to understand and use.
Emphasize clear labeling, accessible iconography, and a well-organized layout. Prioritize the
most important information and actions to prevent overloading users with unnecessary
functionality or visual clutter.

3. User Control and Feedback. Empower users to feel in charge of their experiences. Provide
clear and useful feedback on actions, including progress indicators, confirmation messages,
and problem handling, to encourage users toward successful completion of tasks

e) Using examples explain the following: (1.5 marks)

i. HTML tag
ii. HTML link
iii. HTML frames.

I. HTML tag.

An HTML tag is a building block that specifies the structure and meaning of material in an
HTML document. Tags are often written as opening and closing components that surround
the content to which they apply. Example:

<b>This text is bold</b> ```

ii.HTML Link
An HTML link creates a connection between your web page and another resource, typically another
web page, image, or file. The `<link>` tag specifies the relationship and location of the linked
resource. Here's an example linking to an external stylesheet:

```html
<link rel="stylesheet" href="style.css">
Iii. HTML Frames
HTML frames, while no longer encouraged, were originally used to partition a browser window into
many portions, each with its own HTML document. This enabled a set layout with designated regions
for navigation, content, and other features. However, frames have accessibility and responsiveness
concerns on contemporary devices. Example:
<frameset rows=”100px, ”>

<frame src=”header.html” name=”topFrame”>

<frame src=”content.html” name=”mainFrame”>
</frameset>
4
 iv. Using at least two examples explain the function of event handlers in
JavaScript. (1 marks)
In JavaScript, event handlers are functions that are designed to execute in
response to specific events generated by the user’s interaction with a web
page or the web page itself. Here are two instances that demonstrate their
function:

1. Button-Click Event:

I Considered a button on a webpage that, when clicked, displays an alert message. Here is the
HTML code for the button.
<button id="myButton">Click Me</button>
JavaScript code with the event handler:

// Get a reference to the button element

Const button = document.getElementById(“myButton”);

// Define the event handler function

Function handleClick() {
Alert(“The button was clicked!”);
}

// Attach the event handler to the button’s click event

Button.addEventListener(“click”, handleClick);

2. Form Submission Event:

example

<form id=”myForm”>
<input type=”text” name=”userName” placeholder=”Enter your name”>
<button type=”submit”>Submit</button>
</form>
JavaScript can be used to prevent the default form submission behavior and perform custom
actions instead
// Get a reference to the form element
const form = document.getElementById("myForm");

// Define the event handler function

function handleFormSubmit(event) {
// Prevent default form submission
event.preventDefault();

// Access form data (e.g., get username from input field)

const userName = document.getElementById("userName").value;

5
 // Perform custom logic with the form data (e.g., display username)
alert("Hello, " + userName);
}

// Attach the event handler to the form's submit event

form.addEventListener("submit", handleFormSubmit);

v. Using a diagram State and explain the three-layer web architecture.

(2 marks)
State Explanation:
User Interaction: The user interacts with the online application via the user interface, which is often a
web page created with HTML, CSS, and JavaScript.
Presentation Tier: The user interface receives user input (e.g., form data, button clicks) and transfers
it to the application layer.
Application layer: This layer handles the user’s input. It may entail validating user input.
Performing computations or business logic based on input.
Accessing the data layer to retrieve or update data.
The application tier communicates with the data tier to access and alter data. This could include a
relational database, a NoSQL database, or other data storage options.
Response: The data tier provides the requested data or confirms the changes.
Application Tier: The application tier receives the data from the data layer and prepares a response
for the user interface. This could involve preparing data for display or creating dynamic content.
Presentation Tier: The application tier passes the response data to the presentation layer.
User Interface: The presentation tier updates the web page with response data, delivering feedback to
the user and optionally allowing for additional interaction.

6
 vi. State and explain the approaches used to speed up application
development. (2 marks)
Approaches:

Agile Methodology: Iterative development using short cycles (sprints) and continual feedback to
enable faster adaption.
Low-Code/No-Code: Pre-built components and visual tools to speed up the construction of small
applications.
Code Reuse and Libraries: Using existing, well-tested code can help you save time on
development.
API Integration: Use APIs to access pre-built functionality and save time on development.
DevOps Practices: Dev & Ops collaboration allows for the automation of processes and
deployments, resulting in speedier release cycles.

vii. With aid of examples describe three types of popup boxes that can be
used to get data or present a message to the user in a java script.
(2 marks

1. Alert Box (Informational):

- Used for displaying simple messages to the user.

- User interaction is limited to acknowledging the message by clicking "OK".

- No data retrieval possible.

Example

```javascript

alert("This is an informational message.");

2. Confirm Box (Confirmation):

- Used to get confirmation from the user before proceeding with an action.

- Offers "OK" and "Cancel" buttons.

- Returns `true` if the user clicks "OK" and `false` if they click "Cancel".

7
Example

```JavaScript

const confirmed = confirm("Are you sure you want to delete this item?");

if (confirmed) {

// Perform deletion logic here

} else {

// User canceled the deletion

3. Prompt Box (Data Input):

- Used to get user input through a text field.

- Offers "OK" and "Cancel" buttons.

- Returns the entered text if the user clicks "OK" and `null` if they click "Cancel".

Example

```JavaScript

const name = prompt("Please enter your name:");

if (name) {

alert("Hello, " + name + "!");

} else {

alert("You didn't enter a name.");