Integral University, Lucknow

Effective from Session: 2023-2024

Course Code CA225 Title of the Course Full Stack Development Using MERN (Paper-I) L T P C
Year II Semester IV 3 1 0 4
Pre-Requisite Co-requisite
• To understand how Mern Stack makes things perform.
• To build applications mainly using the JavaScript language only.
• Enable students with a comprehensive understanding of the MERN Stack, encompassing MongoDB, Express.js,
React, and Node.js.
Course Objectives
• To learn how to design user-friendly interfaces with React, develop server-side applications with Node.js, and
manage data using MongoDB.
• Students will learn about the most advanced web-app development environments with immense exposure on
practicality

Course Outcomes
CO1 Able to understand HTML5 Basics and its applications in Full Stack web development
CO2 Designed to enable responsive development of mobile-first websites
CO3 Understand Features of ECMAScript 6 and in what way ES6 makes JavaScript coding easier and more maintainable.
CO4 Able to understand and use the AngularJS Framework
CO5 Able to understand and use the React Framework

Unit Contact Mapped

Title of the Unit Content of Unit
No. Hrs. CO
HTML syntax to structure websites, HTML boilerplate and HTML doctypes, HTML tags,
HTML lists, Display images, create hyperlinks, multi-page websites, HTML best practices
1 HTML5 Introduction to HTML5, Semantic Elements, Form Elements, Form Input Types, Form 8 CO1
Attributes, Media Elements, Canvas Element, video and audio elements, SVG, Drag and
Drop, Geolocation, Web Storage, App Cache, Web Workers, SSE
Introduction to Bootstrap, native CSS tools and external frameworks, installation of
Bootstrap framework, Need of Bootstrap, History of Bootstrap, Advantages of Bootstrap
Framework, Responsive Design, Major Features of Bootstrap, Bootstrap components:
2 Bootstrap buttons, carousels, cards and navigation bars, Access and incorporate designer icons 8 CO2
Bootstrap Grid - Advantages of Bootstrap Grid, 12 column layout system, Bootstrap
Typography, Bootstrap Themes, Bootstrap Tables, Bootstrap Form Layout, Bootstrap CSS,
Bootstrap Plugins
JavaScript ES6: const keyword, let keyword, arrow functions, Template literal, Object and
Array, descructure objects in JavaScript, Default Parameters, Classes, Rest parameter and
spread operator, for/of Loop, JavaScript Maps and Sets, Promises, Symbol, String Methods,
JavaScript ES6, Array Methods, Object Entries, JavaScript Modules
3 8 CO3
Typescript, AJAX Typescript: Introduction, installation of TypeScript, variables, Identifiers and Keywords,
Data types, Numbers, String, Interfaces, Class, Enums, Tuples, Union, aliases, assertions,
function, modules, TypeScript Arrays
Ajax Development: Create XMLHttp, Request Object, Manage Ajax Requests
Introduction, Installation, project setup, Angular CLI, Components and modules, Data
binding and Event binding, Dependency Injection, Templates and Directives, Pipes,
4 AngularJS Routing, Validators, RxJs, Parent child communication, Services, Asynchronous event 8 CO4
handling, HTTP Service and HTTP Client, Forms, Angular animations and materials,
AngularJS and REST Services.
Introduction, Installation, Environment Setup, project setup, Features, Angular vs ReactJS,
JSX, Components, Functional component, Class component, Render Lists, Conditional
5 ReactJS render, State and Props, Component lifecycle, React Forms and Form Validation, 8 CO5
Controlled components, overwhelm rest apis via axios, Events, Routing - React router,
Redux, Deploy React App to the Web, Test React apps with JEST
Reference Books:
1. Eddie Pickford, “Full Stack Development with MERN", Eddie Pickford
2. Eddy Wilson Iriarte Koroliova, “MERN Quick Start Guide", Packt Publishing
3. Nabendu Biswas, “Ultimate Full-Stack Web Development with MERN", AVA Technical Books
e-Learning Source:
1. Institutional Learning Management System i.e Integral Learning Initiative (ILI)
2. NPTEL Video Lectures
 Course Articulation Matrix: (Mapping of COs with POs and PSOs)
PO-
PSO PO1 PO2 PO3 PO4 PO5 PO6 PO7 PO8 PO9 PO10 PO11 PO12 PSO1 PSO2 PSO4 PSO5 PSO6 PSO7
CO
CO1 3 1 1 1
CO2 3 1 1 1 1
CO3 2 2 3 1 2
CO4 3 1 1 1 1
CO5 3 1 1 1 1
1- Low Correlation; 2- Moderate Correlation; 3- Substantial Correlation