Full Stack Web Development – HTML5, CSS3, JS, Bootstrapping, PHP with MySQL

Curriculum

Module 1: Web Development Introduction

• Introduction
• What is Server? Discuss LAMP/WAMP/XAMP?
• Difference between global server and local server?
• Configuration of local server.
• Role of HTTP over the network/Internet.
• Terminologies
  • Web client
  • Web server
  • Web browser
  • Webpage
  • Website
• Discuss Client-server architecture.

Module 2: HTML

• HTML Basics
  • Understand the structure of an HTML page.
  • Understanding HTML Elements.
  • Creating and saving the first web page.
  • Defining the title on the webpage.
  • Showing the icon on the webpage.
  • Use of HTML Attributes.
  • Syntax to use attribute in HTML.
  • Using background image.
  • Defining marquee in HTML.
  • Empty HTML element.
  • Creating horizontal line.
• Text and link on web page
  • Discussion on font formatting.
  • Creating Headings in HTML.
  • Creating and styling Paragraphs.
  • Using different color coding.
  • Comments in HTML.
  • Linking webpages using hyperlink.
  • Creating different types of hyperlink.
  • Creating image on webpage.
• HTML Tables and basic layout
  • Showing data in tabular form.
  • Creating tabular data in different format.
  • Discussion on different properties of table and its impact.
  • Formatting on table.
  • Initial layout management of website using table.
  • Discussion on div and span.
• HTML Lists
  • Creating list on web page to show the details of product.
  • Creating different types of List.
  • Properties of numbered list.
  • Properties of bulleted list.
  • Creating HTML description Lists.
• HTML Forms
  • Discussion on form.
  • Attribute related to form.
  • Method of posting form on to server.
  • Discussion on binary data posting.
  • Creating textbox, checkbox, radio button, etc. control.
  • Differentiation between checkbox, radio button, and drop down list.
  • Discussion on taking long text from user like feedback, address, etc.

Module 3: CSS

• CSS Basics
  • Introduction of CSS.
  • Advantages of using CSS over HTML.
  • Properties and its value in CSS.
  • Ways to use CSS.
  • Why external CSS.
  • Comment in CSS.
• Selectors in CSS
  • Discussion on selector.
  • Different types of selectors:
    • Tag selector
    • Defining and using multi-selector.
    • Defining and using class selector.
    • Multiple classes on particular tag.
    • Defining and using ID selector.
    • Defining and using universal selector.
    • Why universal selector.
    • Defining and using attribute selector.
  • Use and advantage of using pseudo-class.
  • Defining nested selector.
  • Discussion on Pseudo element.
• Text formatting using CSS
  • Defining the color, size of text.
  • Discussion on different measurement units.
  • Removing underline from hyperlink.
  • Use of text transformation.
  • Creating text shadow.
• Page formatting using CSS
  • Defining the background.
  • Managing image in background.
  • Managing layout of page using position.
  • Differentiate absolute, relative, and fixed layout.
  • Defining margin and padding.
  • Setting individual margin and padding on page.
  • Create transparent box.
• Table formatting using CSS
  • Defining the separate and collapse border.
  • Managing image in background.
  • Generate different structures of table.
  • Create striped table.
• Border formatting using CSS
  • Defining border width.
  • Define the individual border width.
  • Defining different kinds of border styles.
  • Define the individual border style.
  • Defining border color.
  • Define the individual border color.
  • Defining the radius of the border.
• List formatting
  • Setting list style.
  • Showing image as a list.
  • Positioning list.
  • Creating navigation bar.
  • Generating different views of navigation bar.

Module 4: JavaScript

• Introduction to JavaScript
• Basics of JavaScript
• Function in JavaScript
• JavaScript event handling
• Object in JavaScript
• String in JavaScript
• Number in JavaScript
• Array in JavaScript
• Error object in JavaScript
• Type conversion in JavaScript
• Form control in JavaScript
• DOM
  • Introduction to DOM.
  • Discuss DOM over JavaScript.
  • Ways to access HTML elements using DOM.
  • Accessing style using DOM.
  • Add event listener using DOM.
  • Add event handler to an element.
  • Remove event listener.
  • Create new HTML element using DOM.
  • Remove HTML element using DOM.
  • Discuss collection object.
• Introduction to Ajax
  • Introduction to AJAX.
  • Introduction to XMLHttpRequest Object.
  • Method and Properties of XMLHttpRequest.
  • Implementation of Ajax techniques on webpages.

Module 5: Responsive design using Bootstrap

• Introduction to Bootstrap
  • Introduction of Bootstrap.
  • Discussion of responsive websites.
  • Discussion on different sizes of screen.
  • Difference between Bootstrap 3 and Bootstrap 4.
  • Discussion on different containers and its limitations.
  • Ways to use Bootstrap.
  • Discussion on CDN over downloaded version.
• Layout management in Bootstrap
  • Managing layout of webpage using Bootstrap.
  • Differentiate container and container-fluid class.
  • Creating and manipulating sections in container.
  • Generating responsive text on webpage.
• Text in Bootstrap
  • Discussion on size of different heading in Bootstrap.
  • Generating lighter and secondary text in Bootstrap.
  • Discussion on block quotes, description list, code snippets, etc.
  • Different text formatting in Bootstrap.
  • Generating contextual text color and background in Bootstrap.
• Table in Bootstrap
  • Showing records in tabular format with basic styling.
  • Showing striped style on Bootstrap table.
  • Showing bordered table and applying hover format.
  • Contextual classes on table.
  • Generating responsive website.
• Icons in Bootstrap
  • Discussion on glyphicon.
  • Use of glyphicon over normal text.
  • Limitation of glyphicon.
  • Showing icons on form controls like user, lock, etc.
• Pagination in Bootstrap
  • Discuss pagination. Why it is required.
  • Creating pagination with active link.
  • Showing pagination with different sizes.
  • Showing current page’s location within a navigational hierarchy.
• Modal in Bootstrap
  • Understanding modal.
  • Create and open modal.
  • Different classes used for modal.
  • Defining the size of modal.
  • Showing login and registration page on modal.
• Image in Bootstrap
  • Creating responsive image.
  • Defining the rounded image.
  • Creating circle image.
  • Creating thumbnail image.
  • Image with caption.
  • Creating responsive video with scale to parent element.
  • Image with media class.
  • Defining alignment of media object.
  • Showing nested media object.
• Button in Bootstrap
  • Generate different styles of buttons.
  • Generate different sizes of buttons in Bootstrap.
  • Meaning of large button, small button, and block level button.
  • Using different states of button in Bootstrap.
• Button group in Bootstrap
  • Creating horizontal button group.
  • Horizontal button group with different sizes.
  • Creating vertical button group.
  • Defining justified button group.
  • Nesting button and creating drop-down.
  • Defining different sections in drop-down.
• Progress bar in Bootstrap
  • Creating progress bar in Bootstrap.
  • Showing progress bar with label.
  • Progress bar with different colors.
  • Create striped progress bar.
  • Create animated progress bar.
  • Create stacked progress bar.
• Alert message in Bootstrap
  • Generating different types of alert messages.
  • Generating different types of alert messages as links.
  • Generating different types of alert messages with close button.
  • Generating different types of alert messages with animation.
• Badges and Spinner in Bootstrap
  • What do you mean by badges?
  • Generating different types of badges.
  • Badges with contextual classes.
  • What do you mean by Spinner?
  • Creating different sizes and types of Spinner.
• Panel and collapsible panel in Bootstrap
  • What do you mean by panel?
  • Panel with heading.
  • Panel with footer.
  • Create panel group.
  • Panel with contextual class.
  • Create basic collapsible.
  • Create collapsible panel.
• List group in Bootstrap
  • Creating list group.
  • List group with badges.
  • Creating active list in list group.
  • Showing list group with link.
  • Showing disabled item in list group.
  • List group item with contextual classes.
  • List group with custom content.
  • List group in collapsible panel.
• Pager in Bootstrap
  • Using pager class with list.
  • Aligning link in page.
• Menu and navigation bar in Bootstrap
  • Creating menu as tab and pills.
  • Differentiating tab and pills.
  • Creating tabs as drop-down menu.
  • Showing horizontal and vertical pills.
  • Creating pills with drop-down menu.
  • Showing centered tabs and pills.
  • Creating toggleable tabs.
  • Creating dynamic tabs.
  • Creating toggleable pills.
  • Creating dynamic pills.
  • Creating navigation bar.
  • Defining inverted navigation bar.
  • Designing navigation bar with drop-down menu.
  • Aligning menus in navigation bar.
  • Creating fixed navigation bar.
  • Create collapsing navigation bar in Bootstrap.
• Form in Bootstrap
  • Creating form.
  • Discussion on form control default setting.
  • Creating form with different layout.
  • Discussion on default layout of form.
  • Creating text box in Bootstrap.
  • Taking long string in text area.
  • Checkbox and radio button in Bootstrap.
  • Creating drop-down list.
  • Grouping input control on form.
  • Creating static control on form.
  • Using state of control on form.
  • Showing text box in different size.
  • Showing help text with form controls.
• Carousel in Bootstrap
  • What do you mean by carousel?
  • Creating carousel.
  • Discussion of different carousel classes.
  • Defining carousel with caption.

Module 6: PHP

• Introduction
  • Introduction to PHP.
  • History of PHP.
  • Why PHP?
  • Discuss web server, also discuss LAMP/WAMP/XAMP.
  • Environment setup and its requirements.
  • Discuss about IP and port number.
  • Discuss configuration related to service issues.
  • Introduction of PHP interpreter.
  • Execution of PHP script.
• PHP Basics
  • How to write PHP script.
  • Displaying message using PHP.
  • Saving and running the first code.
  • Difference between echo and print.
  • Discuss comments in PHP.
  • What do you mean by PHP identifier?
  • Naming convention of identifier in PHP.
  • Discussion on PHP variable type.
  • Displaying output in various formats.
  • Concatenation operator in PHP.
  • String in single quotation and in double quotation.
  • What is type juggling?
  • Showing the type of variables.
  • Creating and accessing constants in PHP.
  • Difference between constant and variable.
  • Demonstration and discussion on magic constant in PHP.
• Operators in PHP
  • What do you mean by operator?
  • Types of operators.
  • Discuss operators on the basis of the number of operands.
• Decision making
  • What do you mean by selection construct or decision-making construct?
  • Explanation and demonstration on if-else, nested-if, and else-if ladder.
  • Discuss and demonstrate switch-case.
• Looping
  • What do you mean by loop?
  • Different looping statements in PHP.
  • Demonstration on while, do-while, for, and foreach loop in PHP.
  • Discuss break and continue statement with demonstration.
• Array
  • What do you mean by array?
  • How PHP array differs from arrays in other languages.
  • Discuss array functions.
  • How many types of arrays are available in PHP.
  • Discuss numerical array and associative array as multidimensional array.
  • Demonstrate sorting in array elements.
  • Discuss other functions that manipulate or access array elements.
• String
  • What is string?
  • How many ways to define a string in PHP.
  • Differentiate implode and explode.
  • Demonstration on converting plain text into cipher text.
  • Finding the length of string.
  • Converting string into different cases.
  • Replacing string in PHP.
  • Comparing strings.
  • String repetition function and repetition operator.
  • Discuss various string-related functions.
• Function
  • What do you mean by function?
  • Types of functions.
  • Creating user-defined functions.
  • Ways to create user-defined functions.
  • Local and global scope of variables.
  • Role of default argument in PHP function.
  • How to return multiple values from a function.
  • Creating variable functions in PHP.
  • Including and managing external static and dynamic resources.
  • Demonstrating built-in functions.
• Reusing Code in PHP
  • include statement.
  • include_once statement.
  • require statement.
  • require_once statement.
• File Handling
  • What is a file? Differentiate file with directory.
  • Why file is required?
  • Opening and closing files in PHP.
  • Discuss different modes of opening files.
  • Writing files using PHP.
  • Reading files in PHP.
  • Removing and renaming files in PHP.
  • Copying file content in PHP.
  • Opening directories in PHP.
  • Reading content from directories.
  • Getting and changing directories.
  • Creating and removing directories in PHP.
  • File Uploading using PHP.
  • File Downloading using PHP.
• Form Handling
  • Discuss GET and POST method of form.
  • Using $_GET[] and $_POST[] super global variables.
  • Discuss use of $_REQUEST[].
  • Discussion on binary data posting.
  • Action attribute of form tag.
  • Demonstration of sending form data to PHP script.
  • Discussion on $_PHP_SELF.
  • Writing PHP script in the same page.
  • Validating control and showing error messages using PHP.
• State management
  • What do you mean by state management?
  • Discuss HTTP as a stateless protocol.
  • Discussion on request and response
  • What is a query string? How can we use it?
  • Advantages and disadvantages of query strings.
  • Understanding sessions and cookies:
  • Difference between sessions and cookies.
  • Demonstrating the creation of a session and how to remove it.
  • Removing all created sessions in PHP.
  • Advantages of using sessions in PHP.
  • The role of session_start().
  • How to turn on sessions automatically.
  • Discussion on the default path and time of a session.
  • How to get the current session ID.
  • Maximum data size PHP session can hold.
  • Demonstration of creating and removing sessions.
  • Creating and removing cookies in PHP.
  • Discussion of the size of cookies.
  • Types of cookies in PHP.
  • Creating a login page with user credentials.
  • Demonstrating how to secure the login.
• APIs in PHP
  • API Basics: What are APIs?
  • Creating a RESTful API.
  • Use of RESTful API.
  • Introduction to Postman.
  • Creating and sending API requests using Postman.
  • Testing APIs using Postman.

Module 7: Database Programming in PHP using MySQL

• Database
  • Introduction to database.
  • Advantages of using a database over a file-oriented approach.
  • What is a database?
  • What is DBMS?
  • Difference between DBMS and RDBMS.
  • Discussion of terminologies used in RDBMS.
  • What is SQL?
  • What do DDL, DML, and DQL statements mean?
  • What is a query?
• CRUD operation.
• Steps to connect with a database.
• Differentiating MySQL with MySQLi.
• Demonstration of connecting with a server.
• Checking server connection.
• Showing records of a table using PHP script.

 Module 8: Project

• Hands-on project to apply the concepts learned.
• Full-stack application development from frontend to backend.