Session Plan

Programme MCA
Client Side Scripting using Java
Title of the Course Script
Course Code MCA240212
No. of Credits 4
Total No. of Hours
60
(1 credit=15 hours)
No. of Sessions
60
(1 session=1 hour)
Marks 100
Pre-requisite Course(s) if any HTML, CSS
Specialization, if any NA
Course Revision No.
Academic Year 2024-2025
Batch (admission year) 2024
Semester number 2
Name of the Faculty Prof. Mayuri Bhnadari
Faculty Email Address [email protected]
Faculty Contact number 9763404557

Bloom's Level Mapping with PO (indicate the

Course Outcomes CO Description
(in Roman Numerals) relevant PO/POs)
Describe fundamental concepts in
Course Outcome (CO) 1 I, II
JavaScript
Create and utilize different types of
Course Outcome (CO) 2 III, IV
functions
Design and work with objects,
Course Outcome (CO) 3 III, IV
arrays, and strings
Modify DOM elements, handle
Course Outcome (CO) 4 events, and validate forms for III, IV
dynamic user interactions
Use JavaScript ES6+ features and
Course Outcome (CO) 5 evaluate the use of modern V
JavaScript frameworks
*Bloom's Taxonomy-Refer
1.https://bokcenter.harvard.edu/taxonomies-learning
2.https://uoeee.asu.edu/blooms-taxonomy

Pre- Class
Post Reflective
Homework/ Pedagogy CO1 CO2 CO3 CO4 CO5 Actual Date
Session Objective Work (Specific
Session No Topic/s Sub- Topics Duration Pre-reads (Specific (*Refer Useful reads Mapping Mapping Mapping Mapping Mapping Date Planned Conducted
(SO) Description,Provide (DD-MM-YYYY)
Description, sheet) with SO with SO with SO with SO with SO (DD-MM-YYYY)
links if any)
Provide links if any)

Unit 1 - Overview of JavaScript Understand the

definition, origins, Write a reflection
and role of on how JavaScript Strong No No No Weak
1 What is JavaScript? 1 hour Class Discussion
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction 12/24/2024
JavaScript as a fits into modern Linkage Linkage Linkage Linkage Linkage
programming web development.
language
Explore the Write examples of
importance of three scenarios
Need of JavaScript in Web JavaScript in Class Discussion Strong No No No Weak
2 1 hour where JavaScript 12/25/2024
https://www.youtube.com/watch?v=Q6bY3FvBxMk&pp=ygUvV2h5IEphdmFTY3JpcHQgaXMgRXNzZW50aWFsIGZvciBXZWIgRGV2ZWxvcG1lbnQ%3D
Development creating dynamic through probing Linkage Linkage Linkage Linkage Linkage
enhances user
and interactive interaction.
web applications.
 Learn the key
features and List three features
Class Discussion of JavaScript you
characteristics that https://www.geeksforgeeks.org/introduction-to-javascript/ Strong No No No Weak
3 Features of JavaScript 1 hour 3-Jan-25
make JavaScript a through probing find most useful Linkage Linkage Linkage Linkage Linkage
versatile and and why.
widely used
language
Explain the https://
execution www.youtube.com/ Write an
environment of watch?
Demonstration and explanation of how Strong No No No Weak
4 JavaScript Execution 1 hour JavaScript and how v=0mRyEPd6DvQ&list Guided Practice. 7-Jan-25
JavaScript executes Linkage Linkage Linkage Linkage Linkage
it integrates with =PLgks6nQq61D0lYJtY
i9KZWwYGbnjxGnhx&i in browsers.
HTML and ndex=3
browsers.
Familiarize
students with Practice adding
JavaScript comments to code
Interactive Code snippets and share Strong
keywords and the https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar No No No No
5 Keywords and Comments 1 hour 8-Jan-25
proper usage of Exploration your explanation Linkage Linkage Linkage Linkage Linkage
comments for for using each
better code comment type.
readability.
Teach methods for Practice creating
Interactive Code
displaying output https://www.w3schools.com/jsref/met_win_alert.asp and debugging Strong No No No No
6 Displaying Output 1 hour 9-Jan-25
using console.log, Exploration console logs for a Linkage Linkage Linkage Linkage Linkage
alert basic program.

https:// Write a short

Understand developer.mozilla.o explanation of the
variable rg/en-US/docs/ difference between Strong No No No No
7 Variables, Scope, Hoisting 1 hour declarations, scope Think-Pair-Share 10-Jan-25
Web/JavaScript/ global and local Linkage Linkage Linkage Linkage Linkage
rules, and the Guide/ scope with
concept of hoisting Grammar_and_types examples.
in JavaScript.
Explain
JavaScript's Create a table
dynamic typing mapping data types Strong No No No No
8 Data Types 1 hour and explore Concept Mapping
https://www.w3schools.com/js/js_datatypes.asp 14-Jan-25
to example use Linkage Linkage Linkage Linkage Linkage
primitive and cases.
reference data
types
Demonstrate the
use of arithmetic, Solve operator-
comparison, based exercises
Guided Problem Strong No No No No
9 Operators 1 hour logical, and https://www.w3schools.com/js/js_operators.asp (e.g., arithmetic and 15-Jan-25
Solving Linkage Linkage Linkage Linkage Linkage
assignment logical) and explain
operators in your solutions.
JavaScript

Write two examples

Illustrate the of valid JavaScript
creation and Guided Problem Strong No No No No
10 Expressions 1 hour expressions and 16-Jan-25
evaluation of Solving Linkage Linkage Linkage Linkage Linkage
explain their
expressions to evaluation.
compute values. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_operators

Implement a
Teach decision- program using if-
Control Structures (if, else, making constructs else and switch- Strong Weak No No No
11 1 hour Live Coding 17-Jan-25
https://www.geeksforgeeks.org/control-statements-in-javascript/#:~:text=JavaScript%20control%20statement%20is%20used,that%20satisfies%20that%20particular%20condition.
switch) for conditional case and share your Linkage Linkage Linkage Linkage Linkage
execution of code. observations about
code readability.
 Explain iterative
Write a reflection
constructs (for,
comparing the use
while, do-while) Practice-Driven Strong Weak No No No
12 Control Structures (loops) 1 hour cases of for, while,
https://www.youtube.com/watch?v=s9wW2PpJsmQ&pp=ygUZSmF2YVNjcmlwdCBMb29wcyBUdXRvcmlhbA%3D%3D 21-Jan-25
for repeated Learning Linkage Linkage Linkage Linkage Linkage
and do-while loops
execution of code
with examples.
blocks.

Unit 2- Functions
Introduce the
Write a function to
syntax and
Basic Syntax of JavaScript Direct Instruction with calculate factorial No Strong No No No
13 1 hour structure of https://www.w3schools.com/js/js_functions.asp#:~:text=A%20JavaScript%20function%20is%20defined,%2C%20parameter2%2C%20...) 22-Jan-25
Function Examples and reflect on the Linkage Linkage Linkage Linkage Linkage
functions in
logic used.
JavaScript.

Explain how to Practice writing

declare and use three functions
Problem-Based No Strong No No No
14 Function Declaration 1 hour named functions using declarations
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function 23-Jan-25
Learning Linkage Linkage Linkage Linkage Linkage
for code and share their
modularity applications.
Reinforce
understanding of Complete exercise Reflect on
Function Declaration - Practice function given on Practice-Driven challenges faced in No Strong No No No
15 1 hour 24-Jan-25
programs declarations https://javascript.in Learning practice programs Linkage Linkage Linkage Linkage Linkage
through hands-on fo/function-basics and their solutions.
practice

Write a comparison
Teach the concept table between
of function Collaborative coding function No Strong No No No
16 Function Expression 1 hour 28-Jan-25
https://www.freecodecamp.org/news/function-declaration-vs-function-expression/#:~:text=Without%20assigning%20it%20to%20a,function%20expression%20assigned%20to%20it.
expressions and task declarations and Linkage Linkage Linkage Linkage Linkage
their usage expressions with
examples.

Explore the syntax Implement two

and benefits of examples of arrow
No Strong No No Weak
17 Arrow Function 1 hour using arrow Visual Demonstration functions and write
https://www.youtube.com/watch?v=tJOJPealurs&pp=ygUaSmF2YVNjcmlwdCBBcnJvdyBGdW5jdGlvbnM%3D 29-Jan-25
Linkage Linkage Linkage Linkage Linkage
functions in about their
JavaScript benefits.
Provide practical
experience with
Function Expression and Arrow Problem-Based No Strong No No Weak
18 1 hour function https://www.w3resource.com/javascript-exercises/javascript-functions-exercises.php 30-Jan-25
Function Practice programs Learning Linkage Linkage Linkage Linkage Linkage
expressions and
arrow functions

Reflect on the
Explain the
advantages and
concept of No Strong No No Weak
19 Anonymous function 1 hour Code Challenges disadvantages of 31-Jan-25
https://www.geeksforgeeks.org/javascript-anonymous-functions/#:~:text=What%20are%20Anonymous%20Functions%3F,as%20arguments%20for%20other%20functions.
anonymous Linkage Linkage Linkage Linkage Linkage
anonymous
functions
functions

Practice creating
Demonstrate how functions with
to set default default parameters No Strong No No Weak
20 Default Parameters 1 hour Guided Coding Practice
https://www.w3schools.com/js/js_function_parameters.asp 4-Feb-25
values for function and reflect on their Linkage Linkage Linkage Linkage Linkage
parameters use in dynamic
applications

Introduce the rest

Write an example
parameter to
program using rest
handle variable No Strong No No Weak
21 Rest Parameter 1 hour Interactive Coding parameters and
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters 5-Feb-25
numbers of Linkage Linkage Linkage Linkage Linkage
describe its
function
usefulness
arguments
 Explain the
Solve problems
arguments object
involving the
and its role in Code Debugging No Strong No No Weak
22 Arguments Object 1 hour arguments object 6-Feb-25
https://www.geeksforgeeks.org/what-is-arguments-in-javascript/#:~:text=This%20object%20(arguments)%20is%20used,are%20passed%20to%20a%20function.
accessing function Session Linkage Linkage Linkage Linkage Linkage
and reflect on their
arguments
implementation
dynamically

Teach the concept Write a reflection

and on recursion
implementation of Step-by-Step challenges while No Strong Weak No No
23 Recursive Functions 1 hour https://www.youtube.com/watch?v=8NZZSgtTelc&pp=ygUXUmVjdXJzaW9uIGluIEphdmFTY3JpcHQ%3D 7-Feb-25
recursive functions Walkthroughs implementing the Linkage Linkage Linkage Linkage Linkage
for problem- Fibonacci sequence
solving program

Discuss guidelines
Reflect on three
and practices for
best practices and
Best Practices for Function writing efficient, No Strong No No No
24 1 hour Class Discussion how they improve
https://www.freecodecamp.org/news/javascript-tips-for-better-web-dev-projects/ 11-Feb-25
Design reusable, and well- Linkage Linkage Linkage Linkage Linkage
code readability
structured
and reusability
functions.

Unit 3 - Objects, Array and Strings Create an object

Explain how to representing a
create and Live Coding with student and reflect No No Strong No Weak
25 Object Creation 1 hour https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_objects 12-Feb-25
manipulate objects Examples on how objects Linkage Linkage Linkage Linkage Linkage
in JavaScript simplify data
management

Implement an
object with multiple
Explore how to
properties and
define and use No No Strong No Weak
26 Properties and Methods 1 hour Hands-On Exercises methods, and
https://www.w3schools.com/js/js_object_methods.asp 13-Feb-25
object properties Linkage Linkage Linkage Linkage Linkage
document its
and methods
application in real-
world scenarios

Illustrate the usage

Write examples of
and context-
how the this No No Strong No Weak
27 ‘this’ keyword 1 hour specific behavior of https://www.youtube.com/watch?v=gvicrj31JOM&pp=ygUuVW5kZXJzdGFuZGluZyDigJh0aGlz4oCZIGtleXdvcmQgaW4gSmF2YVNjcmlwdA%3D%3D
Visual Debugging 14-Feb-25
keyword changes in Linkage Linkage Linkage Linkage Linkage
the this keyword in
different contexts
JavaScript

Teach the concept

and Practice creating a
Guided Problem No No Strong No Weak
28 Object Constructors 1 hour implementation of https://forum.freecodecamp.org/t/constructor-from-javascript-object-basics/696397
constructor 18-Feb-25
Solving Linkage Linkage Linkage Linkage Linkage
object constructors function
for creating objects

Explain Create a prototype-

JavaScript's based inheritance
prototypal Diagram-Based hierarchy and write No No Strong No Weak
29 Prototype and inheritance 1 hour https://www.geeksforgeeks.org/javascript-concepts-for-node-js-developers/ 19-Feb-25
inheritance and Explanation about its benefits in Linkage Linkage Linkage Linkage Linkage
the use of object-oriented
prototypes programming

Demonstrate how
to use bind, call, Practice using bind,
No No Strong No Weak
30 Bind, Call, and Apply Methods 1 hour and apply to Code Experimentation call, and apply 20-Feb-25
https://www.youtube.com/watch?v=75W8UPQ5l7k&pp=ygUwSmF2YVNjcmlwdCBiaW5kKCksIGNhbGwoKSwgYW5kIGFwcGx5KCkgRXhwbGFpbmVk
Linkage Linkage Linkage Linkage Linkage
control the methods
function context.
 Introduce object-
oriented
programming Reflect on the role
Encapsulation and No No Strong No Weak
31 1 hour concepts like Real-World Analogies of encapsulation
https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Advanced_JavaScript_objects 21-Feb-25
Polymorphism Linkage Linkage Linkage Linkage Linkage
encapsulation and and polymorphism
polymorphism in
JavaScript

Teach the Convert a

structure and Data Handling JavaScript object to No No Strong No Moderate
32 JavaScript Object Notation (JSON) 1 hour 25-Feb-25
https://www.w3schools.com/whatis/whatis_json.asp#:~:text=JSON%20stands%20for%20JavaScript%20Object,server%20to%20a%20web%20page
usage of JSON for Programs execution JSON format and Linkage Linkage Linkage Linkage Linkage
data interchange back

Explain array
creation, explore
Practice array
Array - Creation, Methods, array methods, and No No Strong No Weak
33 1 hour Guided Exercises manipulation using
https://www.freecodecamp.org/news/javascript-array-tutorial-array-methods-in-js/ 26-Feb-25
Multidimensional Arrays demonstrate Linkage Linkage Linkage Linkage Linkage
various methods
multidimensional
arrays

Introduce string
Write a program
creation and No No Strong No Weak
34 String - Creation, Methods 1 hour Code Practice utilizing multiple
https://www.youtube.com/watch?v=8yg4RUEnaIk&pp=ygUiSmF2YVNjcmlwdCBTdHJpbmcgTWV0aG9kcyBUdXRvcmlhbA%3D%3D 27-Feb-25
manipulation using Linkage Linkage Linkage Linkage Linkage
string methods
JavaScript methods

Explain how to
work with dates Create a program
Scenario-Based No No Strong No Weak
35 Date - Methods, Properties 1 hour and time using that formats and
https://www.youtube.com/watch?v=8yg4RUEnaIk&pp=ygUiSmF2YVNjcmlwdCBTdHJpbmcgTWV0aG9kcyBUdXRvcmlhbA%3D%3D 28-Feb-25
Learning Linkage Linkage Linkage Linkage Linkage
JavaScript's Date manipulates dates
object

Demonstrate the
Write a reflection
usage of
on how Math
JavaScript's Math
methods simplify No No Strong No Weak
36 Math - Methods, Properties 1 hour object for Coding Challenges
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math 4-Mar-25
complex Linkage Linkage Linkage Linkage Linkage
mathematical
calculations in
operations and
JavaScript
constants

Unit 4 - DOM and Event Handling Reflect on the

Explain the
structure of a
structure of the
Interactive sample DOM tree Weak No No Strong No
37 Introduction to DOM 1 hour DOM and its role in https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction 5-Mar-25
Demonstration by analyzing a Linkage Linkage Linkage Linkage Linkage
manipulating web
webpage using
pages dynamically
developer tools
Teach methods for
Practice selecting
selecting DOM Weak No No Strong No
38 Selecting DOM Elements 1 hour Hands-On Exploration elements using
https://www.freecodecamp.org/news/the-javascript-dom-manipulation-handbook/ 6-Mar-25
elements using Linkage Linkage Linkage Linkage Linkage
different methods
JavaScript
Demonstrate how
Write examples of
to manipulate and
modifying DOM Weak No No Strong No
39 Modifying DOM Elements 1 hour modify DOM Practical exercises
https://www.youtube.com/watch?v=5fb2aPlgoys&pp=ygUbSmF2YVNjcmlwdCBET00gTWFuaXB1bGF0aW9u 7-Mar-25
elements Linkage Linkage Linkage Linkage Linkage
elements
dynamically
programmatically

Explain the
traditional method Write a program
Different Ways of Event Handling of handling events implementing Weak No No Strong No
40 1 hour Direct Coding Practice
https://www.w3schools.com/js/js_events.asp 11-Mar-25
- through HTML by directly inline event Linkage Linkage Linkage Linkage Linkage
embedding handlers
JavaScript in HTML
 Teach modern
Write about the
event handling
advantages of
using the
Different Ways of Event Handling Demonstration and addEventListener Weak No No Strong Weak
41 1 hour addEventListener https://www.youtube.com/watch?v=XF1_MlZ5l6M&pp=ygUaSmF2YVNjcmlwdCBFdmVudCBMaXN0ZW5lcnM%3D 12-Mar-25
- through AddEventListener Practice over inline event Linkage Linkage Linkage Linkage Linkage
method for
handling with
flexibility and
examples
efficiency

Explain the Reflect on scenarios

concept of event where event
bubbling and how Diagram-Based bubbling could No No No Strong No
42 Event Bubbling 1 hour 13-Mar-25
https://www.geeksforgeeks.org/event-bubbling-in-javascript/#:~:text=Event%20bubbling%20is%20a%20way,listeners%20attached%20to%20those%20parents.
events propagate Explanation cause unexpected Linkage Linkage Linkage Linkage Linkage
from child to results in
parent elements applications

Write a short
Illustrate the program
concept of event illustrating event
Diagram-Based No No No Strong No
43 Event Capturing 1 hour capturing and its capturing and
https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Scripting/Events 14-Mar-25
Explanation Linkage Linkage Linkage Linkage Linkage
role in event reflect on its
propagation differences from
bubbling
Explore mouse-
Write a reflection
related DOM
on implementing No No No Strong No
44 DOM Events–Mouse events 1 hour events such as Experimentation Tasks
https://w3schools.invisionzone.com/topic/25137-divs-and-onkeydown/ 18-Mar-25
mouse hover effects Linkage Linkage Linkage Linkage Linkage
click, mouseover,
using mouse events
and mousedown
Teach handling
keyboard-related
Write a program
DOM events like No No No Strong No
45 DOM Events – Keyboard events 1 hour Experimentation Tasks handling keypress
https://www.youtube.com/watch?v=q32skvBgxo4&pp=ygUaSmF2YVNjcmlwdCBLZXlib2FyZCBFdmVudHM%3D 19-Mar-25
keydown, Linkage Linkage Linkage Linkage Linkage
events
keypress, and
keyup

Explain the Event Write examples

object and its using the event
No No No Strong Weak
46 Event Object 1 hour properties for Code Exploration object and reflect 20-Mar-25
https://www.freecodecamp.org/news/event-bubbling-and-event-capturing-in-javascript/#:~:text=Javascript%20creates%20an%20event%20object,whenever%20the%20event%20is%20triggere
Linkage Linkage Linkage Linkage Linkage
accessing event- on its role in event
related data handling.

Reflect on how
Demonstrate how
JavaScript
to manage and Problem-Based No No Weak Strong No
47 Forms Handling 1 hour simplifies handling
https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement 21-Mar-25
process form input Learning Linkage Linkage Linkage Linkage Linkage
form input and
using JavaScript
submission

Write examples of
Teach client-side
validating form
form validation
Problem-Based fields and reflect on No No Weak Strong No
48 Forms Validation 1 hour techniques to https://www.youtube.com/watch?v=In0nB0ABaUk&pp=ygUjSmF2YVNjcmlwdCBGb3JtIFZhbGlkYXRpb24gVHV0b3JpYWw%3D 25-Mar-25
Learning the importance of Linkage Linkage Linkage Linkage Linkage
ensure data
user input
integrity
validation

Unit 5 -JavaScript ES6+ Features Explain

and Modern Frameworks asynchronous Write programs
programming in demonstrating Strong Moderate No No Moderate
49 Promises, Async/Await 1 hour Coding Practice
https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Async_JS/Promises 26-Mar-25
JavaScript using promises and Linkage Linkage Linkage Linkage Linkage
Promises and async/await
async/await
 Unit 5 -JavaScript ES6+ Features
and Modern Frameworks

Introduce
Write about the
JavaScript modules
advantages of Strong Moderate No No Moderate
50 Modules 1 hour for organizing and https://www.freecodecamp.org/news/javascript-modules-beginners-guide/
Interactive Examples 27-Mar-25
modular Linkage Linkage Linkage Linkage Linkage
reusing code
programming
effectively

Teach the use of

import and export Create small
Strong Weak No No Strong
51 Import/Export Statements 1 hour statements for Interactive Examples programs utilizing
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import 28-Mar-25
Linkage Linkage Linkage Linkage Linkage
module-based import/export
programming

Demonstrate how Write reflections on

to manage errors how error handling
Error Handling with try-catch- Strong Strong Weak Moderate Weak
52 1 hour in JavaScript using https://www.geeksforgeeks.org/how-to-handle-errors-in-javascript/
Debugging Practice improves code 1-Apr-25
finally Linkage Linkage Linkage Linkage Linkage
the try-catch- reliability through
finally construct examples

Reinforce error
handling concepts Solve exercise on Write programs to
Error Handling with try-catch- Strong Strong Weak Moderate Weak
53 1 hour through hands-on https://javascript.in Debugging Practice handle different 2-Apr-25
finally - Practice programs Linkage Linkage Linkage Linkage Linkage
programming fo/try-catch types of exceptions
exercises

Write about
Provide an
scenarios where
overview of React
Introduction to JavaScript Video Tutorials and React could No Weak Strong Moderate Strong
54 1 hour and its role in https://www.youtube.com/watch?v=N3AkSS5hXMA&pp=ygUOV2hhdCBpcyBSZWFjdD8%3D 3-Apr-25
Frameworks (React) Discussion simplify web Linkage Linkage Linkage Linkage Linkage
building modern
development
web applications
workflows

Introduce Vue.js as Reflect on the key

Introduction to JavaScript a lightweight and Video Tutorials and differences No Weak Strong Moderate Strong
55 1 hour https://www.youtube.com/watch?v=nhBVL41-_Cw&pp=ygUWSW50cm9kdWN0aW9uIHRvIFZ1ZS5qcw%3D%3D 4-Apr-25
Frameworks (Vue.js) flexible JavaScript Discussion between Vue.js and Linkage Linkage Linkage Linkage Linkage
framework React

Explain React
components and
Practice creating a
Basic Concepts of React their significance No Weak Strong Moderate Strong
56 1 hour Hands-On Projects
https://react.dev/reference/react/Component basic React 8-Apr-25
(Components) in building Linkage Linkage Linkage Linkage Linkage
component
reusable UI
elements
Explore state Write a reflection
management and on the challenges of
Basic Concepts of React (State, No Weak Strong Moderate Strong
57 1 hour data passing in Hands-On Projects managing state and
https://www.freecodecamp.org/news/react-js-for-beginners-props-state-explained/ 9-Apr-25
Props) Linkage Linkage Linkage Linkage Linkage
React using state props in a small
and props React app
Highlight the
features and
Practice using
Overview of Other Libraries applications of Weak Weak No Strong No
58 1 hour Practice examples jQuery for DOM
https://www.youtube.com/watch?v=1CFVBfH8g-g&pp=ygUWSW50cm9kdWN0aW9uIHRvIGpRdWVyeQ%3D%3D 10-Apr-25
(jQuery) jQuery for DOM Linkage Linkage Linkage Linkage Linkage
manipulation
manipulation and
AJAX

Introduce D3.js for

Write a short
creating dynamic,
Overview of Other Libraries program using D3.js Weak Weak Strong Moderate No
59 1 hour interactive data https://d3js.org/ Practice examples 11-Apr-25
(D3.js) to create a basic Linkage Linkage Linkage Linkage Linkage
visualizations in
chart
web applications
 Compare popular
JavaScript
Write a reflection
frameworks and
summarizing the Moderate Weak Strong Strong Strong
60 Comparison of Frameworks 1 hour libraries to Class Discussions
https://www.freecodecamp.org/news/angular-react-vue/ 15-Apr-25
pros and cons of Linkage Linkage Linkage Linkage Linkage
understand their
each framework
strengths and use
cases

Details
Recommended Readings

1. JavaScript A Beginner’s Guide - John Pollock, 4th Edition, Mc Graw Hill Education
2. Eloquent JavaScript - Marijn Haverbeke, 3rd Edition, No Starch Press.
Books 3. JavaScript The definitive guide – David Flanagan, 6th Edition, O’reilly
4. JavaScript Frameworks for Modern Web Development – 2nd Edition, Sufyan bin Uzayr, APress

1. International Journal of Web Engineering and Technology (IJWET).

Journals/Articles https://www.inderscience.com/jhome.php?jcode=ijwet
2. ACM Transactions on the Web (TWEB): https://tweb.acm.org/

Industry reports NIL

SBUP library resources https://web.p.ebscohost.com/ehost/results?vid=2&sid=406dc4ba-7793-4da2-a8a3-81fa0402a9ce%40redis&bquery=javascript&bdata=JmRiPW5sZWJrJmNsaTA9RlQmY2x2MD1ZJmNsaTE9TkwmY2x2MT1ZJnR5cGU9MCZzZWFyY2hNb2RlPVN0YW5kYXJkJnNpdGU9ZWhvc3QtbGl2ZQ%3d%3d

MOOCs https://www.linkedin.com/learning/javascript-essential-training?u=351586674
 Internal Assessment Plan
Assessment-CO Mapping
Assessment Bloom's Level Weightage
Assessment Marks
Description of the task Elements/Par (Indicate in (% of total marks CO1 CO2 CO3 CO4 CO5
Task No Allocated Roman numeral) allocated)
ameters

Level II
Assessment 1 20 LinkedIn Learning Level III 25% Strong Linkage Strong Linkage Strong Linkage Strong Linkage Strong Linkage
Level IV

Level I
Assessment 2 20 Class Test 25% Strong Linkage Strong Linkage No Linkage No Linkage No Linkage
Level II

Level I
Assessment 3 20 MCQ Quiz Level II 25% No Linkage No Linkage Strong Linkage Strong Linkage Strong Linkage
Level III

Level III Moderate

Assessment 4 20 Programming Test 25% No Linkage Weak Linkage Strong Linkage Strong Linkage
Level IV Linkage
*Bloom's Taxanomy-Refer 1.https://bokcenter.harvard.edu/taxonomies-learning 2.https://uoeee.asu.edu/blooms-taxonomy

Pedagogy https://www.ugc.gov.in/pdfnews/7900069_Guidelines-PEA.pdf

*Pedagogical tools(Indicative)
1 Lecture
2 Activity-based learning
3 Class Discussion
4 Flipped Classroom
5 Case Study
6 Workshop
7 Probing/Guided questionin
8 Project Work
9 Field work
10 Debate
11 Storytelling
12 Learning by design
13 Role Plays
14 Siumlation
15 Game based teaching

No Linkage ###
Weak Linka ###
Moderate Linkage
Strong Linkage
 Level I Remember UG
Level II Understand UG
Level III Apply UG/PG
Level IV Analyze PG
Level V Evaluate PG
Level VI Create PG

oeee.asu.edu/blooms-taxonomy
 Name of the Faculty: Mayuri Bhandari Semester

Session Main Topic ( As per Sub Topic ( As per Detailed Contents of

Number Session Plan) Session Plan) Sub-topic

Unit 1 - Overview of Definition, history,

1 What is JavaScript?
JavaScript evolution, and uses of JS.

Unit 1 - Overview of Need of JavaScript in Web Role of JS in interactivity

2
JavaScript Development and dynamic web apps.

Dynamic typing,
Unit 1 - Overview of
3 Features of JavaScript lightweight, event-driven
JavaScript
nature.

JS engines, client-side
Unit 1 - Overview of
4 JavaScript Execution execution, embedding in
JavaScript
HTML.

Unit 1 - Overview of Reserved keywords and

5 Keywords and Comments
JavaScript the use of comments.

Unit 1 - Overview of Using console.log, alerts,

6 Displaying Output
JavaScript and document.write.

Unit 1 - Overview of Declaring variables,

7 Variables, Scope, Hoisting
JavaScript scope, hoisting concepts.

Unit 1 - Overview of Primitive and non-

8 Data Types
JavaScript primitive types.
 Arithmetic, logical,
Unit 1 - Overview of
9 Operators comparison, and
JavaScript
assignment ops.
What is an expression
Unit 1 - Overview of and what is not an
10 Expressions
JavaScript expression with
examples

Unit 1 - Overview of Control Structures (if, else,

11 Conditional constructs.
JavaScript switch)

Unit 1 - Overview of
12 Control Structures (loops) loop constructs.
JavaScript

Syntax and structure of

Basic Syntax of JavaScript
13 Unit 2- Functions defining and calling
Function
functions.

Declaring functions with

14 Unit 2- Functions Function Declaration
examples.

Function Declaration - Programs demonstrating

15 Unit 2- Functions
Practice programs function declaration.

Creating and using

16 Unit 2- Functions Function Expression
function expressions.

Syntax and uses of arrow

17 Unit 2- Functions Arrow Function
functions.

Function Expression and Programs using function

18 Unit 2- Functions Arrow Function Practice expressions and arrow
programs functions.
 Definition and uses of
19 Unit 2- Functions Anonymous function
anonymous functions.

Using default values for

20 Unit 2- Functions Default Parameters
function parameters.

Syntax and application of

21 Unit 2- Functions Rest Parameter
rest parameters.

Properties and uses of the

22 Unit 2- Functions Arguments Object
arguments object.

Understanding recursion,
23 Unit 2- Functions Recursive Functions base cases, and call
stacks.

Best Practices for Function Principles for writing

24 Unit 2- Functions
Design clean, reusable functions.

Creating objects using

Unit 3 - Objects, Array and
25 Object Creation literals, new Object(),
Strings
and functions.

Adding, accessing, and

Unit 3 - Objects, Array and
26 Properties and Methods modifying properties and
Strings
methods of objects.

Context of this in global,

Unit 3 - Objects, Array and
27 ‘this’ keyword function, and object
Strings
scopes.

Creating objects using

Unit 3 - Objects, Array and constructors and
28 Object Constructors
Strings parameterized
constructors.
 Understanding
Unit 3 - Objects, Array and JavaScript's prototype
29 Prototype and inheritance
Strings chain and implementing
inheritance.

Using bind, call, and

Unit 3 - Objects, Array and Bind, Call, and Apply apply for function
30
Strings Methods execution and context
binding.

Encapsulation using
closures and
Unit 3 - Objects, Array and Encapsulation and
31 demonstrating
Strings Polymorphism
polymorphism in
JavaScript.

Unit 3 - Objects, Array and JavaScript Object Notation JSON syntax, parsing,
32
Strings (JSON) and stringifying objects.

Array creation, common

Unit 3 - Objects, Array and Array - Creation, Methods,
33 methods, and
Strings Multidimensional Arrays
multidimensional arrays.

String handling,
Unit 3 - Objects, Array and including slicing,
34 String - Creation, Methods
Strings concatenation, and
regular expressions.

Working with
Unit 3 - Objects, Array and JavaScript's Date object
35 Date - Methods, Properties
Strings and its properties and
methods.

Utilizing JavaScript's
Unit 3 - Objects, Array and Math - Methods, Math object for
36
Strings Properties mathematical
computations.

Understanding the DOM

Unit 4 - DOM and Event
37 Introduction to DOM structure, nodes, and tree
Handling
hierarchy.
 Methods like
getElementById,
Unit 4 - DOM and Event
38 Selecting DOM Elements querySelector, and
Handling
getElementsByClassNam
e

Changing element
Unit 4 - DOM and Event
39 Modifying DOM Elements content, attributes, and
Handling
styles dynamically.

Inline event handling

Unit 4 - DOM and Event Different Ways of Event
40 using attributes like
Handling Handling - through HTML
onclick.

Different Ways of Event

Unit 4 - DOM and Event Using addEventListener
41 Handling - through
Handling for event handling.
AddEventListener

Understanding how
Unit 4 - DOM and Event
42 Event Bubbling events propagate in
Handling
bubbling phase.

Understanding event
Unit 4 - DOM and Event
43 Event Capturing propagation in capturing
Handling
phase.

Handling mouse events

Unit 4 - DOM and Event DOM Events–Mouse
44 like click, mouseover,
Handling events
and mouseout.

Handling keyboard
Unit 4 - DOM and Event DOM Events – Keyboard
45 events like keydown,
Handling events
keyup, and keypress

Unit 4 - DOM and Event Understanding and using

46 Event Object
Handling the event object.

Accessing form elements

Unit 4 - DOM and Event
47 Forms Handling and handling form data
Handling
using JavaScript.
 Client-side validation
Unit 4 - DOM and Event
48 Forms Validation using JavaScript for input
Handling
fields.

Unit 5 -JavaScript ES6+ Concepts of

49 Features and Modern Promises, Async/Await Promises, .then, .catch,
Frameworks and async/await

Unit 5 -JavaScript ES6+ JavaScript modules,

50 Features and Modern Modules default exports, and
Frameworks named exports.
Unit 5 -JavaScript ES6+ Syntax for import and
51 Features and Modern Import/Export Statements export, default and
Frameworks named exports.
Unit 5 -JavaScript ES6+ Explanation and
Error Handling with try-
52 Features and Modern examples of try, catch,
catch-finally
Frameworks and finally
Real-life scenarios using
Unit 5 -JavaScript ES6+ Error Handling with try-
error handling, such as
53 Features and Modern catch-finally - Practice
file reading or invalid
Frameworks programs
input validation.

Unit 5 -JavaScript ES6+ Overview of React.js:

Introduction to JavaScript
54 Features and Modern purpose, features, and
Frameworks (React)
Frameworks applications.

Overview of Vue.js:
Unit 5 -JavaScript ES6+
Introduction to JavaScript features, use cases, and
55 Features and Modern
Frameworks (Vue.js) simple comparison with
Frameworks
React.
Unit 5 -JavaScript ES6+ Components in React:
Basic Concepts of React
56 Features and Modern functional and class-
(Components)
Frameworks based.

Unit 5 -JavaScript ES6+ React’s state and props

Basic Concepts of React
57 Features and Modern for managing dynamic
(State, Props)
Frameworks data and communication.

Unit 5 -JavaScript ES6+ Introduction to jQuery:

Overview of Other
58 Features and Modern purpose, basic syntax,
Libraries (jQuery)
Frameworks and DOM manipulation.
 Unit 5 -JavaScript ES6+ Introduction to D3.js for
Overview of Other
59 Features and Modern creating data
Libraries (D3.js)
Frameworks visualizations.
Compare React, Vue.js,
Unit 5 -JavaScript ES6+
Comparison of jQuery, and D3.js based
60 Features and Modern
Frameworks on performance, features,
Frameworks
and use cases.
 50 Minutes' detailing (Only for MCA)

II Course title

Learning Outcomes Pedagogy

Understand what
JavaScript is and its Class Discussion
purpose.

Explain why JavaScript Class Discussion through

is essential for web dev. probing

List key features of Class Discussion through

JavaScript. probing

Understand how JS code Demonstration and

is executed. Guided Practice.

Use comments and avoid Interactive Code

reserved keywords. Exploration

Display output using Interactive Code

different methods. Exploration

Declare variables and

Think-Pair-Share
understand scope.

Understand and use

Concept Mapping
different data types.
Perform operations using
Guided Problem Solving
appropriate operators.

Perform operations using

Guided Problem Solving
appropriate operators.

Write programs with

Live Coding
control structures.

Write programs with

Practice-Driven Learning
control structures.

Understand how to
Direct Instruction with
define and call functions
Examples
in JS.

Use function declarations

Problem-Based Learning
correctly in programs.

Apply function
declarations to solve Practice-Driven Learning
problems.

Differentiate between
function declarations and Collaborative coding task
expressions.

Use arrow functions in

concise and readable Visual Demonstration
code.

Implement arrow
Problem-Based Learning
functions effectively.
Understand use cases of
Code Challenges
anonymous functions.

Apply default parameters

Guided Coding Practice
effectively in functions.

Use rest parameters to

handle dynamic Interactive Coding
arguments.

Utilize the arguments

object for flexible Code Debugging Session
functions.

Implement and debug Step-by-Step

recursive functions. Walkthroughs

Adopt best practices for

Class Discussion
function design in JS.

Understand various
Live Coding with
methods of object
Examples
creation in JavaScript.

Use object properties and

methods in JavaScript Hands-On Exercises
programs.

Explain and correctly use

this in various JavaScript Visual Debugging
contexts.

Use constructors
effectively for object Guided Problem Solving
creation.
Explain and apply
Diagram-Based
inheritance using
Explanation
prototypes.

Effectively use bind, call,

and apply in JavaScript Code Experimentation
programs.

Apply encapsulation and

polymorphism in Real-World Analogies
JavaScript programs.

Use JSON for data Data Handling Programs

exchange in JavaScript. execution

Use arrays and their

methods to manipulate Guided Exercises
data in JavaScript.

Manipulate strings
effectively using Code Practice
JavaScript methods.

Use the Date object for

date and time Scenario-Based Learning
manipulation.

Use Math methods for

complex mathematical Coding Challenges
operations in JavaScript.

Explain the DOM and its

Interactive Demonstration
role in web development.
Select elements using
DOM methods in Hands-On Exploration
JavaScript.

Modify DOM elements

Practical exercises
using JavaScript.

Implement simple event

handling directly in Direct Coding Practice
HTML.

Attach multiple event Demonstration and

listeners dynamically. Practice

Describe and handle

Diagram-Based
event bubbling in
Explanation
JavaScript.

Explain and implement Diagram-Based

event capturing. Explanation

Implement mouse event

Experimentation Tasks
handlers in JavaScript.

Implement keyboard
event handlers in Experimentation Tasks
JavaScript.

Use the event object to

get details of triggered Code Exploration
events.

Manipulate form
elements and data Problem-Based Learning
dynamically.
Validate form inputs to
improve user experience Problem-Based Learning
and security.

Understand
asynchronous
programming and handle Coding Practice
async operations
effectively.
Organize and reuse
JavaScript code using Interactive Examples
modules.
Use import and export
effectively in JavaScript Interactive Examples
applications.
Handle runtime errors
using structured error Debugging Practice
handling techniques.

Apply error handling to

Debugging Practice
practical scenarios.

Explain the purpose and Video Tutorials and

benefits of React.js. Discussion

Understand the purpose

Video Tutorials and
of Vue.js and its
Discussion
differences from React.

Understand and use

React components in Hands-On Projects
applications.

Use state and props

Hands-On Projects
effectively in React apps.

Understand the usage of

jQuery for simplifying Practice examples
DOM manipulation.
Create simple data
visualizations using Practice examples
D3.js.
Analyze the strengths
and weaknesses of
Class Discussions
different JavaScript
frameworks.
0 Minutes' detailing (Only for MCA)

Client-side scripting using JavaScript (MCA240212)

Constructive Alignment (Detailing 50 minutes)

Detailed Description to cover activities,pedagogy,active learning strategy and broad time
appropriation .

Introduction (10 mins): Interactive discussion on what JavaScript is and its real-world
applications.
Activity (30 mins): Students research and share examples of websites using JS.
Conclusion (10 mins): Summary and Q&A.

Introduction (15 mins): Lecture on static vs dynamic websites.

Activity (25 mins): Students use a simple HTML file and embed a JS script to add
interactivity.
Reflection (10 mins): Discuss advantages of JS in web development.

Introduction (20 mins): Explanation of features with examples.

Activity (20 mins): Students identify JS features in provided code snippets.
Conclusion (10 mins): Reflection on how these features aid web development.

Lecture (20 mins): Explanation of browser execution flow and engines.

Hands-on (20 mins): Students embed JavaScript in an HTML file.
Conclusion (10 mins): Discuss execution issues and debugging strategies.

Lecture (15 mins): Explain keywords and comment types.

Activity (25 mins): Students annotate a JS program with meaningful comments.
Wrap-up (10 mins): Discuss the importance of code readability.
Introduction (10 mins): Demonstrate output methods.
Hands-on (30 mins): Students modify code to display output using each method.
Conclusion (10 mins): Discuss appropriate use cases for each method.
Lecture (20 mins): Explain let, var, const and hoisting.
Activity (25 mins): Students predict outputs for sample code snippets illustrating scope and
hoisting.
Conclusion (5 mins): Summarize best practices for variable declarations.
Introduction (15 mins): Explain data types with examples.
Activity (30 mins): Students create a program to demonstrate type conversions.
Wrap-up (5 mins): Discuss implications of type coercion.
Lecture (15 mins): Explanation of operators with examples.
Activity (30 mins): Students solve problems using different operators.
Discussion (5 mins): Reflect on operator precedence and common mistakes.

Lecture (15 mins): Explanation of expressions with examples.

Activity (30 mins): Students solve problems
Discussion (5 mins): Reflect on expressions

Overview of control structures (if else and switch).

Hands-on (30 mins): Students implement a program to solve a practical problem using
conditions.
Wrap-up (5 mins): Discuss efficiency in program logic.

Overview of control structures (loops- for, while, do-while).

Hands-on (30 mins): Students implement a program to solve a practical problem using
loops
Wrap-up (5 mins): Discuss efficiency in program logic.

Introduction (15 mins): Explain function syntax and components.

Hands-on (30 mins): Students create a simple function that calculates and returns a result.
Conclusion (5 mins): Discuss syntax errors and debugging.

Lecture (20 mins): Explain function declarations with examples.

Activity (25 mins): Students write a program using multiple declared functions.
Conclusion (5 mins): Reflect on readability and reusability of code.
Hands-on Practice (45 mins): Solve given programming problems using function
declarations (e.g., calculating factorial, checking prime numbers).
Conclusion (5 mins): Share solutions and discuss optimization techniques.

Introduction (15 mins): Explain function expressions with examples.

Hands-on (30 mins): Students modify declared functions into expressions and test outputs.
Reflection (5 mins): Discuss when to use function expressions.

Lecture (15 mins): Explain arrow function syntax and differences from regular functions.
Hands-on (30 mins): Students rewrite existing functions using arrow syntax.
Conclusion (5 mins): Discuss arrow function limitations.

Practice Session (45 mins): Solve problems requiring function expressions and arrow
functions (e.g., array filtering, sorting).
Reflection (5 mins): Discuss simplicity and benefits of arrow functions.
Lecture (15 mins): Explain anonymous functions with examples.
Activity (25 mins): Students implement an anonymous function for event handling.
Conclusion (10 mins): Discuss advantages and potential drawbacks.

Lecture (10 mins): Explain default parameter syntax.

Hands-on (35 mins): Students create programs that handle both provided and missing
parameters.
Conclusion (5 mins): Reflect on error handling with default parameters.
Lecture (10 mins): Explain rest parameters with examples.
Activity (35 mins): Students create programs to handle varying numbers of arguments.
Wrap-up (5 mins): Discuss best practices for handling dynamic arguments.

Lecture (20 mins): Demonstrate the arguments object.

Activity (25 mins): Students create a program to dynamically sum numbers using
arguments.
Conclusion (5 mins): Discuss differences between arguments and rest parameters.

Lecture (20 mins): Explain recursion with examples (e.g., factorial, Fibonacci).
Activity (25 mins): Students write a recursive program.
Reflection (5 mins): Discuss risks of stack overflow and debugging recursive logic.

Lecture (15 mins): Discuss principles (naming, modularity, readability).

Group Activity (30 mins): Review and refactor a given poorly-written code snippet.
Conclusion (5 mins): Summarize learnings and key takeaways.

Lecture (15 mins): Explain object creation methods with examples.

Activity (30 mins): Students create objects using literals and constructors.
Conclusion (5 mins): Discuss advantages of different methods.
Lecture (20 mins): Explain how to add and modify properties and methods.
Hands-on (25 mins): Students create objects with properties and methods, then interact with
them.
Conclusion (5 mins): Discuss code optimization using methods.

Lecture (20 mins): Illustrate this with examples.

Activity (25 mins): Students write and debug programs that demonstrate this in different
contexts.
Conclusion (5 mins): Discuss challenges of this in nested functions.

Lecture (15 mins): Explain constructor functions and parameterized constructors.

Hands-on (30 mins): Students create constructor functions for real-world use cases (e.g.,
Employee or Product objects).
Reflection (5 mins): Discuss constructor usage benefits.
Lecture (20 mins): Explain the prototype chain and inheritance concepts.
Hands-on (25 mins): Students implement inheritance using prototypes.
Conclusion (5 mins): Discuss trade-offs of inheritance in design.

Lecture (20 mins): Explain the purpose and syntax of bind, call, and apply.
Activity (25 mins): Students rewrite a program using these methods to manipulate this
context.
Conclusion (5 mins): Discuss their use cases and pitfalls.

Lecture (20 mins): Explain encapsulation and polymorphism concepts.

Activity (25 mins): Students implement encapsulation using closures and write
polymorphic functions.
Conclusion (5 mins): Discuss advantages of encapsulation.

Lecture (20 mins): Explain JSON syntax and methods like JSON.parse() and
JSON.stringify().
Activity (25 mins): Students convert objects to JSON strings and parse them.
Conclusion (5 mins): Discuss real-world use cases like APIs.

Lecture (20 mins): Explain array creation and methods like push(), pop(), filter(), and
map().
Activity (25 mins): Students implement operations on multidimensional arrays.
Conclusion (5 mins): Reflect on array manipulations' efficiency.
Lecture (15 mins): Explain common string methods like slice(), concat(), and match().
Activity (30 mins): Students solve problems requiring string operations (e.g., reversing a
string, finding patterns).
Conclusion (5 mins): Discuss efficiency in string manipulations.
Lecture (20 mins): Demonstrate creating and formatting dates.
Activity (25 mins): Students create programs to calculate differences between dates or
format dates for reports.
Conclusion (5 mins): Discuss practical applications of the Date object in real-world
scenarios.
Lecture (15 mins): Explain methods like Math.floor(), Math.random(), and Math.pow().
Activity (30 mins): Students write programs for tasks like generating random numbers or
performing power calculations.
Conclusion (5 mins): Reflect on efficiency and accuracy in math operations.

Lecture (15 mins): Explain DOM with diagrams.

Demonstration (25 mins): Show DOM hierarchy in browser console using developer tools.
Q&A (10 mins): Students ask and answer questions about DOM structure.
Lecture (15 mins): Explain and demonstrate selection methods.
Hands-on (25 mins): Students write a program to select and style DOM elements.
Conclusion (10 mins): Discuss practical use cases like styling or hiding elements.

Lecture (15 mins): Explain content and style modification.

Activity (30 mins): Students create a program to change button text and styles on a click.
Reflection (5 mins): Discuss real-world examples (e.g., dynamic UI updates).

Lecture (15 mins): Explain inline event handling with examples.

Activity (25 mins): Students write an HTML file with buttons triggering alert messages.
Conclusion (10 mins): Discuss advantages and disadvantages of inline handling.
Lecture (20 mins): Demonstrate addEventListener usage.
Hands-on (25 mins): Students create buttons that respond to multiple events like click and
hover.
Conclusion (5 mins): Compare addEventListener with inline event handling.

Lecture (15 mins): Explain event bubbling with examples.

Activity (30 mins): Students write code to demonstrate event propagation.
Reflection (5 mins): Discuss scenarios where bubbling is useful or problematic.

Lecture (15 mins): Explain capturing with visuals.

Hands-on (30 mins): Students write code to demonstrate event capturing in forms.
Conclusion (5 mins): Compare capturing and bubbling phases.
Lecture (15 mins): Explain mouse events.
Hands-on (30 mins): Students create a program to change styles or show tooltips on mouse
events.
Conclusion (5 mins): Discuss UX improvements using mouse events.
Lecture (20 mins): Explain keyboard event types.
Activity (25 mins): Students create a program to validate text input dynamically.
Conclusion (5 mins): Discuss scenarios where keyboard events are critical (e.g., forms,
games).

Lecture (15 mins): Explain properties of the event object.

Hands-on (30 mins): Students write a program to log event details (e.g., type, target).
Conclusion (5 mins): Discuss debugging advantages of the event object.

Lecture (20 mins): Explain accessing form elements using DOM.

Activity (25 mins): Students write a program to read and display form input on a button
click.
Conclusion (5 mins): Discuss importance in real-world applications like e-commerce.
Lecture (15 mins): Explain validation techniques like regex.
Activity (30 mins): Students create a form with real-time validation for fields like email,
phone, and password.
Conclusion (5 mins): Discuss benefits of client-side validation in UX and security.

Lecture (15 mins): Explain Promises and Async/Await with examples.

Activity (30 mins): Students write a program fetching API data using Promises and
Async/Await.
Reflection (5 mins): Discuss the importance of async operations in real-world apps.

Lecture (15 mins): Introduce modules and export/import syntax.

Activity (25 mins): Students create and use a module exporting functions.
Discussion (10 mins): Compare traditional script imports with ES6 modules.
Lecture (20 mins): Demonstrate import/export with a multi-file project.
Activity (25 mins): Students create two modules and import them in a main file.
Conclusion (5 mins): Discuss error handling in modular programming.
Lecture (15 mins): Explain the try-catch-finally construct.
Hands-on (30 mins): Students create a program that catches user input errors.
Reflection (5 mins): Discuss scenarios where error handling is critical.

Practice (40 mins): Students work on real-life error-handling tasks like validating form
inputs or file uploads.
Review (10 mins): Faculty discusses solutions and common challenges.

Lecture (20 mins): Introduce React.js and its component-based architecture.

Discussion (20 mins): Explore how React simplifies development with real-world
examples.
Q&A (10 mins): Students ask and answer questions about React.

Lecture (20 mins): Introduce Vue.js with examples.

Hands-on (25 mins): Create a simple Vue.js app with a template and reactive data.
Reflection (5 mins): Discuss where Vue.js might be a better choice than React.

Lecture (20 mins): Explain React components with examples.

Hands-on (25 mins): Students create a React app with functional components.
Discussion (5 mins): Explore the importance of reusable components in development.
Lecture (20 mins): Explain state and props with practical examples.
Activity (25 mins): Students create a React app passing data via props and modifying state
dynamically.
Discussion (5 mins): Reflect on real-world scenarios using state and props.
Lecture (20 mins): Demonstrate jQuery’s basic syntax and features.
Hands-on (25 mins): Students use jQuery to create a dynamic webpage with animations.
Reflection (5 mins): Discuss the evolution of libraries like jQuery and their relevance
today.
Lecture (20 mins): Introduce D3.js with an example of bar charts.
Hands-on (25 mins): Students create a basic chart using D3.js.
Reflection (5 mins): Discuss the importance of visualizations in data analysis.

Lecture (20 mins): Explain the comparison criteria with examples.

Group Activity (25 mins): Students discuss and summarize the frameworks' pros and cons.
Reflection (5 mins): Discuss how to choose the right framework for a project.
Credits: 4 Batch
2024-2026

Life Skills
building/enhancement
Session Assessment Resources to be Shared
(Mention two
prominent ones)

Critical Thinking,
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide
Curiosity

Analytical Thinking,
https://www.youtube.com/watch?v=Q6bY3FvBxMk&pp=ygUvV
Practical Learning

Observation, Problem-
https://www.geeksforgeeks.org/introduction-to-javascript/
solving

https://www.youtube.com/watch?
Attention to Detail, v=0mRyEPd6DvQ&list=PLgks6nQ
Technical Proficiency q61D0lYJtYi9KZWwYGbnjxGnhx
&index=3

Communication, Clarity https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refere

Adaptability, Creativity https://www.w3schools.com/jsref/met_win_alert.asp

https://developer.mozilla.org/en-
Logical Reasoning,
US/docs/Web/JavaScript/Guide/
Problem-solving
Grammar_and_types

Analytical Thinking,
https://www.w3schools.com/js/js_datatypes.asp
Observation
Problem-solving, Logical
https://www.w3schools.com/js/js_operators.asp
Reasoning

Problem-solving, Logical
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide
Reasoning

Critical Thinking,
https://www.geeksforgeeks.org/control-statements-in-javascript/#
Persistence

Critical Thinking,
https://www.youtube.com/watch?v=s9wW2PpJsmQ&pp=ygUZS
Persistence

Analytical Thinking, Review of implemented

https://www.w3schools.com/js/js_functions.asp#:~:text=A%20Ja
Attention to Detail function.

Logical Thinking, Code practice with

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refere
Problem-solving functional outputs.

Complete exercise given on

Persistence, Solution discussion and
https://javascript.info/function-
Collaboration corrections.
basics

Observation, Modified function

https://www.freecodecamp.org/news/function-declaration-vs-fun
Adaptability review.

Simplification, Logical Code reviews with arrow

https://www.youtube.com/watch?v=tJOJPealurs&pp=ygUaSmF2
Thinking syntax.

Problem-solving, Correct implementation

https://www.w3resource.com/javascript-exercises/javascript-func
Creativity of solutions.
Decision Making, Event handling
https://www.geeksforgeeks.org/javascript-anonymous-functions/
Adaptability demonstration.

Program outputs with

Precision, Resilience https://www.w3schools.com/js/js_function_parameters.asp
default values.

Logical Reasoning, Submission of rest

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refere
Adaptability parameter programs.

Analytical Thinking, Code outputs with

https://www.geeksforgeeks.org/what-is-arguments-in-javascript/
Attention to Detail dynamic sums.

Persistence, Logical Debugging recursive

https://www.youtube.com/watch?v=8NZZSgtTelc&pp=ygUXUm
Thinking logic programs.

Collaboration, Critical Refactored and optimized

https://www.freecodecamp.org/news/javascript-tips-for-better-w
Thinking code submission.

Creativity, Analytical Program demonstrating

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide
Thinking object creation.

Attention to Detail, Code demonstrating

https://www.w3schools.com/js/js_object_methods.asp
Logical Thinking object interaction.

Problem-solving, Debugging this usage

https://www.youtube.com/watch?v=gvicrj31JOM&pp=ygUuVW
Adaptability programs.

Analytical Thinking, Constructor-based object

https://forum.freecodecamp.org/t/constructor-from-javascript-ob
Creativity creation program.
 Code demonstrating
Critical Thinking,
inheritance and prototype https://www.geeksforgeeks.org/javascript-concepts-for-node-js-d
Logical Reasoning
use.

Adaptability, Problem- Submission of programs

https://www.youtube.com/watch?v=75W8UPQ5l7k&pp=ygUwS
solving using these methods.

Attention to Detail, Code with closures and

https://developer.mozilla.org/en-US/docs/Learn_web_developme
Logical Thinking polymorphic functions.

Problem-solving, Logical JSON conversion and

https://www.w3schools.com/whatis/whatis_json.asp#:~:text=JSO
Reasoning parsing exercise.

Analytical Thinking, Array manipulation

https://www.freecodecamp.org/news/javascript-array-tutorial-arr
Adaptability programs.

Creativity, Problem- String operation

https://www.youtube.com/watch?v=8yg4RUEnaIk&pp=ygUiSm
solving programs.

Logical Reasoning, Submission of date

https://www.youtube.com/watch?v=8yg4RUEnaIk&pp=ygUiSm
Attention to Detail manipulation programs.

Critical Thinking, Code demonstrating

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refere
Analytical Skills Math object applications.

Q&A session to ensure

Analytical Thinking,
conceptual https://developer.mozilla.org/en-US/docs/Web/API/Document_O
Observation
understanding.
Logical Thinking, Program selecting and
https://www.freecodecamp.org/news/the-javascript-dom-manipu
Attention to Detail styling DOM elements.

Creativity, Problem- Program demonstrating

https://www.youtube.com/watch?v=5fb2aPlgoys&pp=ygUbSmF
solving dynamic DOM updates.

Adaptability, Attention to Submission of inline

https://www.w3schools.com/js/js_events.asp
Detail event handling program.

Problem-solving, Logical Event-driven program

https://www.youtube.com/watch?v=XF1_MlZ5l6M&pp=ygUaS
Thinking using addEventListener.

Critical Thinking, Program illustrating

https://www.geeksforgeeks.org/event-bubbling-in-javascript/#:~:
Logical Reasoning event bubbling behavior.

Debugging and
Logical Thinking,
identifying capturing https://developer.mozilla.org/en-US/docs/Learn_web_developme
Problem-solving
behavior.

Attention to Detail, Mouse event-driven

https://w3schools.invisionzone.com/topic/25137-divs-and-onkey
Adaptability program.

Problem-solving, Keyboard interaction-

https://www.youtube.com/watch?v=q32skvBgxo4&pp=ygUaSm
Adaptability based program.

Analytical Thinking, Code extracting and

https://www.freecodecamp.org/news/event-bubbling-and-event-c
Observation logging event details.

Program demonstrating
Creativity, Problem-
form element https://developer.mozilla.org/en-US/docs/Web/API/HTMLForm
solving
manipulation.
Logical Thinking, Validation program with
https://www.youtube.com/watch?v=In0nB0ABaUk&pp=ygUjSm
Attention to Detail real-time feedback.

Problem-solving, Logical Program using Promises

https://developer.mozilla.org/en-US/docs/Learn_web_developme
Thinking and Async/Await.

Organization Skills, Code demonstrating

https://www.freecodecamp.org/news/javascript-modules-beginne
Adaptability module usage

Collaboration, Problem- Program using import

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refere
solving and export statements.

Critical Thinking, Program with try-catch-

https://www.geeksforgeeks.org/how-to-handle-errors-in-javascri
Logical Reasoning finally handling errors.

Problem-solving, Assessment of submitted Solve exercise on

Resilience error-handling programs. https://javascript.info/try-catch

Communication, Participation in Q&A and

https://www.youtube.com/watch?v=N3AkSS5hXMA&pp=ygUO
Analytical Thinking discussions.

Submission of a Vue.js
Adaptability, Creativity https://www.youtube.com/watch?v=nhBVL41-_Cw&pp=ygUW
demo app.

Logical Thinking, React app demonstrating

https://react.dev/reference/react/Component
Collaboration functional components.

Problem-solving, React app with state and

https://www.freecodecamp.org/news/react-js-for-beginners-prop
Creativity props

Adaptability, Attention to Program using jQuery for

https://www.youtube.com/watch?v=1CFVBfH8g-g&pp=ygUWS
Detail DOM manipulation.
Analytical Thinking, Submission of a D3.js
https://d3js.org/
Creativity visualization project.

Critical Thinking, Summarizing

https://www.freecodecamp.org/news/angular-react-vue/
Decision-Making comparisons.