Web Development Full Course

Web Development

Learn Web Development with MindGigs  Basic TO Advance

What MindGigs Offers in Web Developmnet ?


HTML Introduction

  • HTML stands for Hyper Text Markup Language
  • HTML is the standard markup language for creating Web pages
  • HTML describes the structure of a Web page
  • HTML consists of a series of elements
  • HTML elements tell the browser how to display the content
  • HTML elements label pieces of content such as “this is a heading”, “this is a paragraph”, “this is a link”, etc.

<h1>My First Heading</h1>

<p>My first paragraph.</p>

HTML Editor

Learn HTML Using Notepad or TextEdit

Web pages can be created and modified by using professional HTML editors.

However, for learning HTML we recommend a simple text editor like Notepad (PC) or TextEdit (Mac).

We believe that using a simple text editor is a good way to learn HTML.

2 . CSS

CSS Introduction

CSS is the language we use to style a Web page.

  • CSS stands for Cascading Style Sheets
  • CSS describes how HTML elements are to be displayed on screen, paper, or in other media
  • CSS saves a lot of work. It can control the layout of multiple web pages all at once
  • External stylesheets are stored in CSS files

How To Add CSS

There are three ways of inserting a style sheet:

  • External CSS
  • Internal CSS
  • Inline CSS

 External CSS

With an external style sheet, you can change the look of an entire website by changing just one file!

Each HTML page must include a reference to the external style sheet file inside the <link> element, inside the head section.

Internal CSS

An internal style sheet may be used if one single HTML page has a unique style.

The internal style is defined inside the <style> element, inside the head section.

  • Internal styles are defined within the <style> element, inside the <head> section of an HTML page:

Inline CSS

An inline style may be used to apply a unique style for a single element.

To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property.

3.Bootstrap 5

Introduction to Bootstrap 5

Bootstrap is a free front-end framework for faster and easier web development

Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins

Bootstrap also gives you the ability to easily create responsive designs

Create Your First Web Page With Bootstrap 5

  1. Add the HTML5 doctype

Bootstrap 5 uses HTML elements and CSS properties that require the HTML5 doctype.

Always include the HTML5 doctype at the beginning of the page, along with the lang attribute and the correct title and character set:

  1. Bootstrap 5 is mobile-first

Bootstrap 5 is designed to be responsive to mobile devices. Mobile-first styles are part of the core framework.

To ensure proper rendering and touch zooming, add the following <meta> tag inside the <head> element:

<meta name=”viewport” content=”width=device-width, initial-scale=1″>

The width=device-width part sets the width of the page to follow the screen-width of the device (which will vary depending on the device).

The initial-scale=1 part sets the initial zoom level when the page is first loaded by the browser.


Bootstrap 5 also requires a containing element to wrap site contents.

There are two container classes to choose from:

  1. The .container class provides a responsive fixed width container
  2. The .container-fluid class provides a full width container, spanning the entire width of the viewport


JavaScript is the world’s most popular programming language.

JavaScript is the programming language of the Web.

JavaScript is easy to learn.

How  to Add JavaScript in Html

In HTML, JavaScript code is inserted between <script> and </script> tags.


document.getElementById(“demo”).innerHTML = “My First JavaScript”;

You can place any number of scripts in an HTML document.

Scripts can be placed in the <body>, or in the <head> section of an HTML page, or in both.


  • PHP is an acronym for “PHP: Hypertext Preprocessor”
  • PHP is a widely-used, open source scripting language
  • PHP scripts are executed on the server
  • PHP is free to download and use

What Can PHP Do?

  • PHP can generate dynamic page content
  • PHP can create, open, read, write, delete, and close files on the server
  • PHP can collect form data
  • PHP can send and receive cookies
  • PHP can add, delete, modify data in your database
  • PHP can be used to control user-access
  • PHP can encrypt data

What do You need to Install PHP

To start using PHP, you need to:

  • Find a web host with PHP and MySQL support
  • Install a web server on your own PC, and then install PHP and MySQL

Basic PHP Syntax

A PHP script can be placed anywhere in the document.

A PHP script starts with <?php and ends with ?>:

The default file extension for PHP files is “.php”.

A PHP file normally contains HTML tags, and some PHP scripting code.

6. MySQL


  • MySQL is a relational database management system
  • MySQL is open-source
  • MySQL is free
  • MySQL is ideal for both small and large applications
  • MySQL is very fast, reliable, scalable, and easy to use
  • MySQL is cross-platform
  • MySQL is compliant with the ANSI SQL standard
  • MySQL was first released in 1995
  • MySQL is developed, distributed, and supported by Oracle Corporation
  • MySQL is named after co-founder Monty Widenius’s daughter: My

Who Uses MySQL?

  • Huge websites like Facebook, Twitter, Airbnb,, Uber, GitHub, YouTube, etc.
  • Content Management Systems like WordPress, Drupal, Joomla!, Contao, etc.
  • A very large number of web developers around the world

How to Use SQL

The following SQL statement selects all the records in the “Customers” table:

Some of The Most Important SQL Commands

  • SELECT– extracts data from a database
  • UPDATE– updates data in a database
  • DELETE– deletes data from a database
  • INSERT INTO– inserts new data into a database
  • CREATE DATABASE– creates a new database
  • ALTER DATABASE– modifies a database
  • CREATE TABLE– creates a new table
  • ALTER TABLE– modifies a table
  • DROP TABLE– deletes a table
  • CREATE INDEX– creates an index (search key)
  • DROP INDEX– deletes an index
Select the fields to be shown. Others will be hidden. Drag and drop to rearrange the order.
  • Image
  • SKU
  • Rating
  • Price
  • Stock
  • Availability
  • Add to cart
  • Description
  • Content
  • Weight
  • Dimensions
  • Additional information
Click outside to hide the comparison bar