0% found this document useful (0 votes)
18 views

Advanced Web Application Lab Programs

Lab

Uploaded by

yugi s
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
18 views

Advanced Web Application Lab Programs

Lab

Uploaded by

yugi s
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 14

ADVANCED WEB APPLICATION DEVELOPMENT LAB PROGRAMD

1. Create Node .JS application to display some message by using Client Server model

1. Methodology
Import required modules: The "require" directive is used to load a Node.js
module.
Create server: You have to establish a server which will listen to client's request
similar to Apache HTTP Server.
Read request and return response: Server created in the second step will read
HTTP request made by client which can be a browser or console and return the
response.
2. Process Steps/Description
A node.js web application contains the following steps
Open Node.js command prompt and run the following code:

node console_example1.js

How to create node.js web applications


Follow these steps:
1. Import required module: The first step is to use ?require? directive to load
http module and store returned HTTP instance into http variable. For example:
1. var http = require("http");

2. Create server: In the second step, you have to use created http instance and
call http.createServer() method to create server instance and then bind it at
port 8081 using listen method associated with server instance. Pass it a
function with request and response parameters and write the sample
implementation to return "Hello World". For example:

http.createServer(function (request, response) {


// Send the HTTP header
// HTTP Status: 200 : OK
// Content Type: text/plain
response.writeHead(200, {'Content-Type': 'text/plain'});
// Send the response body as "Hello World"
response.end('Hello World\n');
}).listen(8081);
// Console will print the message
console.log('Server running at http://127.0.0.1:8081/');

3. Combine step1 and step2 together in a file named "main.js".


File: main.js(Coding Given in Sample coding Section)
4. How to start your server:
5. Go to start menu and click on the Node.js command prompt.

Now command prompt is open:

Setpath: Here we have save


"main.js" file on the desktop.
So type cd desktop on the command prompt. After that execute the main.js to start
the server as follows:
node main.js

Now server is started.


Make a request to Node.js server:
4. Sample coding
var http = require("http");
http.createServer(function (request, response) {
// Send the HTTP header
// HTTP Status: 200 : OK
// Content Type: text/plain
response.writeHead(200, {'Content-Type': 'text/plain'});
// Send the response body as "Hello World"
response.end('Hello World\n');
}).listen(8081);
// Console will print the message
console.log('Server running at http://127.0.0.1:8081/');
5.Sample Input/Output:
Open http://127.0.0.1:8081/ in any browser.

6. Result/inference:

Thus the create a simple NodeJS and running it in VS Code editor and
the simple node is created with server and the output is verified.

2.Title : To create a simple Web application using Express.JS and running it in


VS Code editor.

Express is a fast, assertive, essential and moderate web framework of Node.js.


You can assume express as a layer built on the top of the Node.js that helps
manage a server and routes. It provides a robust set of features to develop web
and mobile applications.

1. Process Steps/Description

Step 1: Create an empty folder and move it into that folder from your VS Code
editor, use the following command.
mkdir demo
cd demo
Step 1: Create an empty folder and move it into that folder from your VS Code
editor, use the following command.
mkdir demo
cd demo
code .

Step 3: Now create a file app.js file in your folder as shown below.

Step 4: Installing Module and Express


Install the modules using the following command.

npm install express


npm install nodemon
Step 5: Write following code in express_example.js which starts a server and
listen on a local port. It only responds to homepage
Step 6: Run the application using the following command:

Step 7: Now go to http://localhost:5000/ in your browser, We will see the


following output:
3.Methodology

 It can be used to design single-page, multi-page and hybrid web


applications
 It allows to setup middlewares to respond to HTTP Requests.
 It defines a routing table which is used to perform different actions based
on HTTP method and URL.

4.Sample coding File: express_example.js

var express = require('express');


var app = express();
app.get('/', function (req, res) {
res.send('Welcome to JavaTpoint');
})
var server = app.listen(8000, function () {
var host = server.address().address
var port = server.address().port
console.log("Example app listening at http://%s:%s", host, port)
})

5.Sample Input/Output:
Open http://127.0.0.1:8000/ in browser to see the result.

6. Result/inference:
Thus the create a simple Express.JS and running it in VS Code editor and
the simple node is created with server and the output is verified.
3. Write MONGO shell basic commands and execute with proper output.

1.The MongoDB Shell, mongosh, is a fully functional JavaScript and Node.js


REPL environment for interacting with MongoDB deployments. It can be used
with the MongoDB Shell to test queries and operations directly with the
database.

2,Process Steps/Description

Basic Commands

Show current
db db
database

Select or switch use <datab


use mydb
database [1] ase name>

Display help help help

Display help on DB
db.help() db.help()
methods

Display help on db.mycol.hel


db.mycol.help()
Collection p()

Show all databases show dbs show dbs

Show all
show
collections in show collections
collections
current database

Show all users on


show users show users
current database

Show all roles on


show roles show roles
current database

4. Sample Input/Output:
Run the following command to get sample output
>db

>show dbs

>help

4. Result/inference:

Thus the above commands are executed and the output is verified
.
4. Write MONGO CRUD OPERATIONS and execute with proper output.

The following operations are used to create (C), read (R), update (U),
and delete (D) a document in MONGODB. These operations are
often referred to as CRUD operations.

2,Process Steps/Description

Create operation – Create operation or Insert operation are used to add new
documents to the collection and if the collection does not exist, it creates one.

Following command can insert a document on the collection – db.collection.insert()

Read operation – This operation reads the documents from the collection. This
process is taken place by executing a query.

The command to read the document is – db.collection.find()

Update operation – Update operation is used to modify an existing document.

The command that updates a document is – db.collection.update()

Delete operation – Delete operation erases the document from the collection.

Following command performs the operations – db.collection.remove()

3.Methodology

The following operations are used to create (C), read (R), update (U),
and delete (D) a document in MONGODB

In Mongodb the CRUD operation refers to the creating, reading, updating,


and deleting of documents.The mongo shell sends the command to the
MongoDB server.

5. Sample Input/Output:
Create operations add new documents to a collection.

There are two ways to add new documents to collections:

 db.collection.insertOne()
 db.collection.insertMany()

Here is an example of how a car can be added to the cars collection:

db.cars.insertOne(
//insert Civic 2017 into cars
{
name: "Civic"
model: "2017"
}
)

Read
Read operations retrieve documents from a collection. If there is no
collection that currently exists, it will automatically create a new one.

Here is the method to retrieve information:

 db.collection.find()

Here is an example of how a car can be found from the cars collection:

db.cars.find(
//find the 2017 models
{ model: "2017"}
)

Update
Update operations modify documents from a collection.

The three ways to add new documents to collections ar:

 db.collection.updateOne()
 db.collection.updateMany()
 db.collection.replaceOne()

Here is an example of how a car can be modified in the cars collection:


db.cars.updateMany(
//search the query
{ name: "Civic" }
//update the query
{ $set: {model: "2020"} }
)

Delete
Delete operations delete documents from a collection.

There are two ways to add new documents to collections:

 db.collection.deleteOne()
 db.collection.deleteMany()

Here is an example of how a car can be deleted from the cars collection:

db.cars.updateMany(
//delete all cars from 2017
{ name: "Civic" }
)

5. Result/inference:

Thus the above commands are executed and the output is verified

5. Write HTML code using AngularJS to generate the following output

i.BCA
ii.BCA
III. MCA
IV. BBA
V.MBA
VI.M.Com
SAMPLE CODE

<!DOCTYPE html>

<html>

<head>
<script src="C:\angular-1.8.0\angular-1.8.0\angular.js"></script>

<style>

div {

border: 1px solid green;

width: 100%;

height: 100px;

display: block;

margin-bottom: 10px;

text-align:left;

background-color:yellow;

</style>

</head>

<body ng-app ng-init="courses=['BBA(CA)','BCA(Science)','B.Sc(Computer Science)’]”>

<h1> Undergraduate Courses </h1>

<ol type=i>

<li ng-repeat="name in courses">

{{name}}

</li>

</ol>

<h1> Post Graduate Courses </h1>

<div ng-init="postcourses=['MCA','M.Sc(CA)','M.Sc(Computer Science)']">

<ol type=i>

<li ng-repeat="name in postcourses ">

{{name}}

</li>

</ol>

</div>

</body></html>

You might also like