WEB DEVELOPMENT L T P C

JAL1502
FRAMEWORK 2 0 2 3

COURSE OBJECTIVES:
 To describe the various components of web development framework.
 To outline the features of Node.js.
 To give an introduction on the basics of MongoDB.
 To explain the role of Express in web applications.
 To elucidate the use of Angular in web applications.

UNIT I BASICS OF WEB DEVELOPMENT FRAMEWORK AND FULL STACK 9

Understanding the Basic Web Development Framework – User – Browser – Webserver –
Backend Services – Understanding the Node.js-to-Angular Stack Components.

UNIT II NODE JS 9
Understanding Node JS – Installing Node.js – Working with Node packages – Creating a
simple Node.js application - Handling Data I/O – Using the Buffer Module to Buffer Data -
Implementing HTTP services in Node.js - Processing URLs - Processing Query Strings and
Form Parameters - Understanding Request, Response, and Server Objects.

UNIT III MONGO DB 9

Understanding NoSQL and MongoDB – Building MongoDB Environment – Administering
user accounts – Configuring access control – Administering databases – Managing collections
– Connecting to MongoDB from Node.js.

UNIT IV EXPRESS 9
Implementing Express in Node.js – Configuring routes – Using Request and Response objects
– Implementing Express middleware - Understanding Middleware - Using the query
Middleware - Serving Static Files - Handling POST Body Data - Sending and Receiving
Cookies - Implementing Sessions - Applying Basic HTTP Authentication - Implementing
Session Authentication - Creating Custom Middleware.

UNIT V ANGULAR 9
Angular – Typescript – Angular Components – Expressions – Data binding – Built-in
directives.
TOTAL: 45 PERIODS

LIST OF EXPERIMENTS:
1. Download and install Node.js, MongoDB, Express and Angular.
2. Perform the following using Node.js:
a. Set up a basic HTTP Server.
b. Read a file from the file system and write data to a file.
c. Create a simple module.
d. Make HTTP requests.
e. Create a basic CLI tool.
3. Perform the following using MongoDB:
a. Create a database and collection and insert multiple documents into the collection
b. Query and retrieve documents from a collection based on specific criteria.
c. Update and delete documents in a collection.
 d. Perform indexing on a collection.
e. Use aggregation to perform complex queries.
f. Use MongoDB with Node.js
4. Perform the following using Express:
a. Set up an Express server.
b. Create multiple routes to handle different HTTP requests.
c. Create a route to handle POST requests and send back a response.
d. Handle query parameters in a GET request.
e. Handle URL parameters in a route.
f. Serve static files using Express.
g. Implement basic error handling in Express.
5. Perform the following using Angular:
a. Set up an Angular project and create a component.
b. Demonstrate the use of interpolation and property binding.
c. Handle button click events.
d. Implement two-way data binding.
e. Use structural and attribute directives.
f. Create a service and use dependency injection to consume it in a component.
g. Set up basic routing in an Angular application.
h. Create a form and handle form submission with validation.
i. Create and implement modules and controllers and implement error handling.
6. Design and develop anyone of the following applications:
a. A portfolio website for yourself which gives details about yourself for a
potential recruiter.
b. A web application to manage the TO-DO list of users, where users can login
and manage their to-do items.
c. A food delivery website where users can order food from a particular restaurant
listed in the website.
d. A classifieds web application to buy and sell used products.
e. A leave management system for an organization where users can apply different
types of leaves such as casual leave and medical leave. They also can view
the available number of days.
f. An online survey application where a collection of questions is available and users
are asked to answer any random 5 questions.
TOTAL: 15 PERIODS

COURSE OUTCOMES:
At the end of the course, students will be able to
 Discuss about the purpose of the components of web development framework.
 Develop web applications using Node.js.
 Experiment the usage of MongoDB.
 Apply Express in designing web applications.
 Design web applications using Angular.

TEXTBOOKS:
1. Brad Dayley, Brendan Dayley, Caleb Dayley, ‘Node.js, MongoDB and Angular Web
Development’, Addison-Wesley, Second Edition, 2018.
REFERENCES:
1. Vasan Subramanian, ‘Pro MERN Stack, Full Stack Web App Development with Mongo,
Express, React, and Node’, Second Edition, Apress, 2019.
2. Chris Northwood, ‘The Full Stack Developer: Your Essential Guide to the Everyday Skills
Expected of a Modern Full Stack Web Developer’, Apress; 1st edition, 2018.
3. Kirupa Chinnathambi, ‘Learning React: A Hands-On Guide to Building Web Applications
Using React and Redux’, Addison-Wesley Professional, 2nd edition, 2018.

WEBSITE REFERENCES:
1. https://www.tutorialspoint.com/the_full_stack_web_development/index.asp
2. https://www.coursera.org/specializations/full-stack-react
3. https://www.udemy.com/course/the-full-stack-web-development/

LIST OF EQUIPMENTS FOR A BATCH OF 30 STUDENTS:

HARDWARE:
Stand-alone desktops 30 Nos. (or) Server supporting 30 terminals or more

SOFTWARE:
Web browser (Google Chrome, Microsoft Edge), Python, React.js framework, Angular
framework, Django (Python) framework, Express.js (Node.js) framework, MongoDB
(NoSQL).