BANGLADESH TECHNICAL EDUCATION BOARD

SYLLABUS FOR THE SHORT COURSE

IN

Web Design & Development

1
Total Duration: 360 hours

2
 Index

Sl. No. Subject Page No.

01 Introduction 02
02 Objectives 02
03 Course Outline 02
04 Basic Competencies 03
05 Course Contents 03-21
06 Job List 21
07 Entry Qualification 21
08 Employment Opportunities 22
09 List of Tools/Equipment 22
10 Book Reference 22

1
Introduction:
This is an introductory level course which offers students interested in gaining insight into the
field of Web Design & Development. Topics include how web sites are architected, how does
communication work, what is involved in building a website, and what all the terminology really
means. At the end of the course, students will have a clear understanding of all that is required to
build, maintain, and use a website. There are no pre-requisites for this introductory course.

Objectives:
After completion of the course the students will be able to

 Understand the importance of the web as a medium of communication.

 Understand the principles of creating an effective web page, including an in-depth

consideration of information architecture.

 Become familiar with graphic design principles that relate to web design and learn
how to implement these theories into practice.

 Develop skills in analyzing the usability of a web site.

 Learn the language of the web: Client & Server Side.

 Be able to embed social media content into web pages.

 Implement and understand how to interpret basic web analytics.

Course Outline:

Name of Duration of Course Entry

Course Qualification
Total 360 hrs 5 days per week, Per day 3
Web Design hrs
Minimum
& English = 60 hrs Theory = 1 hr per lesson
SSC Pass
Development Theory = 60 hrs Practice = 2 hrs per practice
Practical = 240 hrs Total = 3 hrs per working day

2
Basic Competencies:

 Receive and respond, Participate and Lead to workplace communication:

o Work with others, Team Environment and Lead small Teams:
o Demonstrate work values, Practice career professionalism and Develop & Practice
o Negotiation skills.
o Practice housekeeping procedures. Occupational health and safety procedure and
o Solve problems related to work Activities:
o Use Mathematical Concepts & Techniques and Use Relevant Technologies:
o Personal Manner
 Efficiently communicate in English
o Speak in English with confidence.
o Communicate with target persons effectively.
o Understand the speech of English users.
o Achieve better professional performance

Course Contents:
Communication English (60 Hours)

 Interpret the meaning of given words (by the teachers) - Vocabulary.

 Speaking on a specific Situation.
 Public speaking.
 Exchanging views with target persons.
 Introducing one self.
 Describing & narrating events, places, objects etc.

Related Subject-10 hours and General Subject- 20 hours 1 hour/period on the completion of this
course trainees will be able to:

1. Speak in English with confidence

2. Communicate with target persons effectively.
3. Understand the speech of English users.
4. Achieve better professional performance.
No. of Tropics- Conversational Situation hours
period
01 Speaking English – Getting Information & Finding one’s way 2
02 Speaking English – About Tools and Equipments 2
03 Speaking English – About meeting someone & participating in class. 2
04 Speaking English – Daily Activities & Asking About Activities 2
05 Speaking English – Evening Activities and about theoretical contents. 2
06 Speaking English – Meeting at the Train station & Asking Question at the 2
Train station.
07 Speaking English – Meeting at the Airport & Getting information at the 2
Airport’s
08 Speaking English – About different type of Measuring Tools and Cutting 2
3
 Tools
09 Speaking English – Getting to the Hotel & Asking direction. 2
10 Speaking English – Asking about Buses & Traveling by bus. 2
11 Speaking English - About Practical Class. 2
12 Speaking English – Going by Taxi and Asking the time. 2
13 Speaking English – Arriving early or late and Time and the calendar. 2
14 Speaking English – Living in an Apartment. 2
15 Speaking English – Using the Telephone. 2
16 Speaking English – Getting help in stores and talking about shopping. 2
17 Speaking English – Sending and Receiving Letters. 2
18 Speaking English – Talking about the Weather & Trips and sight-seeing. 2
19 Speaking English – Talking about Eating & Dinner Conversation. 2
20 Speaking English – About Machines and Materials. 2
21 Speaking English – Common Health problem and Quitting & Finding Jobs. 2
22 Speaking English – Office Details and Office Conversation. 2
23 Speaking English – About Practical Job. 2
24 Speaking English – On a specific situation & Public speaking. 2
25 Speaking English – About Exchanging view with a Persons & Introducing 2
oneself.
26 Speaking English – Describing and Narrating events, place, Objects etc. 2
27 Speaking English – About different type of computer, operating system, 8
system and operating software, add remove software, DBM, Email and
internet.

Practical:
1. Speaking on a specific Situation.
2. Public Speaking.
3. Exchanging views with target persons.
4. Introducing one self.
5. Describing & Narrating events, places, objects etc.
6. Producing the meaning of given words (by the teachers)-Vocabulary.
7. Prepared speech.

Theory & Practical Course Overview (300 Hours)

Sl. Topics Hours

1 Basic Concepts 10
2 Html/Html5 40
3 CSS/CSS3 30
4 Responsive Web Design 20
5 JavaScript/JQuery 30
6 Graphics 20
7 PHP 75
8 MySQL 40
9 Domain & Hosting Management 15
10 Final Project 20

4
Sl. Topics Hours
1 Html Overview 2
 What is HTML?
 HTML Editors
2 Html Tags, Elements & Attributes 3
Sl.  Heading Tags, Paragraph Tag, Line Break Tag, Centering Content,
Topics Hours
1 Horizontal Lines
History, Purpose & Future of Web 3
 HTML
What iselements,
WWW &HTML Tag vs. Element, Nested HTML Elements
Internet?
 Core Attributes(Id,
Elaborate Class,
the history Title), The href Attribute ,The Lang
of Web
Attribute, Size Attributes
 Elaborate the purpose of Web
3 Html Formatting
Elaborate&the Styling
future of Web 3
 HTML Formatting Elements(<b>, <strong>, <em>, <mark>,
2 Web Protocols 1
<small>, <del>,<ins>,<sub>,<sup>)
 Describe the types of web protocols
 The HTML Style Attribute, HTML Background Color, HTML Text
 Functions of web protocols (Http, Https, Ftp)
Color, HTML Fonts, HTML Text Size, HTML Text Alignment
3 Concept of Domain & Hosting 1
4 Html Tables 3
 What is Domain & Hosting?
 Basic HTML tables
 Describe different types of Domain & Hosting
 A table with borders
4 Types & Structure of a Web Site 4
 A table with collapsed borders
 Describe different types of website structure
 A table with cell padding
 Describe about static & dynamic website
 A table with headings
5 Kinds of Web Browsers 1
 A table with left-aligned headings
 Describe different types
Horizontal/Vertical tableof web browser
headings
 Describe weba browser
A table with caption usability
 Table cells that span more than one column
 Table cells that span more than one row
 A table with cell spacing
 A table with HTML tags inside
 Tables with different style using id I, Tables with different style
using id II
 Tables with different style using class I, Tables with different style
using class II
5 Html Links & Events 3
 Linking, using an absolute URL
 Linking, using a relative URL
 Changing the color of links
 Removing the underline from links
 Changing the target of a link
 An image as a link
 Creating a bookmark link
 A link that breaks out of a frame
 A mailto link
 A mailto link with subject
 Global Event Attributes, Window Event Attributes, Form Events,
Keyboard & Mouse Events
6 Html Lists, FRAMES & IFRAMES 3
 An unordered list (default)
 An unordered list with disc bullets
 An unordered list with circle bullets
 An unordered list with square bullets
 An unordered list without bullets
 An ordered list (default)
 An ordered list with numbers
5
 An ordered list with letters
 An ordered list with lowercase letters
 An ordered list with roman numbers
 CSS/CSS3 (30 Hours)

Sl. Topics Hours

1 CSS Overview & Syntax 1
 What is CSS?
 CSS How To
 The element selector
 The id selector
 The class selector (for all elements)
 The class selector (for only <p> elements)
 Grouping selectors
2 CSS Colors & Background 2
 Color Names
 RGB (Red, Green, Blue)
 Hexadecimal Colors
 Set the background color of a page
 Set the background color of different elements
 Set an image as the background of a page
 How to repeat a background image only horizontally
 How to position a background image
 A fixed background image (this image will not scroll with the rest
of the page)
 All the background properties in one declaration
 Advanced background example

6
3 CSS Text, Fonts & Links 2
 Set the text color of different elements
 Align the text
 Remove the line under links
 Decorate the text
 Control the letters in a text
 Indent text
 Specify the space between characters
 Specify the space between lines
 Set the text direction of an element
 Increase the white space between words
 Disable text wrapping inside an element
 Vertical alignment of an image inside text
 Set the font of a text
 Set the size of the font
 Set the size of the font in px
 Set the size of the font in em
 Set the size of the font in percent and em
 Set the style of the font
 Set the variant of the font
 Set the boldness of the font

 All the font properties in one declaration

 Add different colors to visited/unvisited links
 Use of text-decoration on links
 Specify a background color for links
 Add other styles to hyperlinks
 Advanced - Create link boxes
 Advanced - Create link boxes with borders
4 CSS Margins, Padding & Borders 2
 Specify different margins for each side of an element
 Let the left margin be inherited from the parent element
 The margin shorthand property
 Set margin to auto to center the element within its container
 Set the left padding of an element
 Set the right padding of an element
 Set the top padding of an element
 Set the bottom padding of an element
 All the padding properties in one declaration
 Set the width of the four borders
 Set the style of the four borders
 Set the color of the four borders
 All the border properties in one declaration
 Add rounded borders to an element
 Set different borders on each side

5 CSS Tables & Lists 2

 Specify a black border for table, th, and td elements
 Use of border-collapse
7
  Single border around the table
 Specify the width and height of a table
 Set the horizontal alignment of content (text-align)
 Set the vertical alignment of content (vertical-align)
 Specify the padding for th and td elements
 Horizontal dividers
 Hover able table
 Striped tables
 Specify the color of the table borders
 Set the position of the table caption
 Responsive Table
 An unordered list (default)
 An unordered list with disc bullets
 An unordered list with circle bullets
 An unordered list with square bullets
 An unordered list without bullets
 An ordered list (default)
 An ordered list with numbers
 An ordered list with letters
 An ordered list with lowercase letters
 An ordered list with roman numbers
 An ordered list with lowercase roman numbers
 A description list
 A nested list I
 A nested list II
 A horizontal list
 A horizontal list menu
6 CSS Forms 3
 Form with text input
 Form with radio button input
 Form with text fields and a submit button
 Form with a text fields without a name attribute
 Grouping Form Data
 Send e-mail from a form
 Input type text
 Input type password
 Input type radio
 Input type checkbox
 Input type button
 Input type number - with restrictions
 Input type number - with steps
 Input type date - with date picker
 Input type date - with restrictions
 Input type color - with color picker
 Input type range
 Input type month
 Input type week
 Input type time
 Input type date time
 Input type date time-local
8
  Input type email
 Input type search
 Input type tel
 Input type url
7 CSS Outline, Background & Box Model 2
 Demonstrating the box model
 Specify an element with a total width of 250px
 Draw a line around an element (outline)
 Set the style of an outline
 Set the color of an outline
 Set the width of an outline
8 CSS Display, Dimension & Overflow 2
 Set the height and width of an element
 Set max-width of an element
 Set the height and width of different elements
 Set the height and width of an image using percent
 Set min-width and max-width of an element
 Set min-height and max-height of an element
 How to hide an element (visibility: hidden)
 How to not display an element (display: none)
 How to display a block-level element as an inline element
 How to display an inline element as a block-level element
 How to use CSS together with JavaScript to show hidden content
9 CSS Floating & Positioning 3
 Position an element relative to the browser window
 Position an element relative to its normal position
 Position an element with an absolute value
 Overlapping elements
 Set the shape of an element
 How to create a scroll bar when an element's content is too big to
fit
 How to set the browser to automatically handle overflow
 Set the top edge of an image using a pixel value
 Set the bottom edge of an image using a pixel value
 Set the left edge of an image using a pixel value
 Set the right edge of an image using a pixel value
 Change the cursor Position image text (top left corner)
 Position image text (top right corner)
 Position image text (bottom left corner)
 Position image text (bottom right corner)
 Position image text (centered)
10 CSS Navigation & Opacity 2
 Fully styled vertical navigation bar
 Fully styled horizontal navigation bar
 Creating transparent images
 Creating transparent images - mouse over effect
 Reversed mouse over effect for transparent images
 Transparent box/div
 Transparent box/div with RGBA values

9
  Creating a transparent box with text on a background image
11 CSS Media & Objects 2
 Image gallery
 Responsive Image gallery
 Recognized Media Types
12 CSS3 Overview & Syntax 2
 What is CSS3
 Difference between CSS & CSS3
 CSS3 Modules
 CSS3 - Box Sizing
13 CSS3 Rounded Corner & Border Image 2
 Add rounded corners to elements
 Round each corner separately
 Create elliptical corners
 Create an image border around an element, using the round
keyword
 Create an image border around an element, using the stretch
keyword
 Image border - Different slice values
14 CSS3 Fonts, Text & Colors 3
 Simple shadow effect
 Add a color to the shadow
 Add a blur effect to the shadow
 White text with black shadow
 A red neon glow shadow
 A red and blue neon glow shadow
 White text with black, blue, and dark blue shadow
 Add a simple box-shadow to an element
 Add color to box-shadow
 Add color and blur effect to box-shadow
 Create paper-like cards (text)
 Specify how hidden, overflowed content should be signaled to
the user
 How to display the overflowed content when hover over the
element
 Allow long words to be able to be broken and wrap onto the next
line
 Specify line breaking rules
 Use your "own" fonts in @font-face rule
 Use your "own" fonts in @font-face rule (bold)

Responsive Web Design (20 Hours)

Sl. Topics Hours

1 Responsive Overview 2
2 Flexible Grids, Layouts & Media 3
3 Media Queries 6
 Initializing Media Queries
 Logical Operators in Media Queries
10
  Height & Width Media Features
 Aspect Ratio Media Features
 Resolution Media Feature
 Media Query Browser Support
4 Viewport 3
 Viewport Height & Width
 Viewport Scale
 Viewport Resolution
 Combining Viewport Values
 CSS Viewport Rule
5 Bootstrap 6
 Bootstrap with CSS
 Bootstrap Layout Components
 Bootstrap Plugins
 Bootstrap Demos

JavaScript/JQuery (30 Hours)

Sl. Topics Hours

1 JavaScript Overview & Syntax 2
 What is JavaScript?
 Client-side JavaScript
 Advantages of JavaScript
 Limitations of JavaScript
 JavaScript Development Tools
 Where is JavaScript Today?
 JavaScript can change HTML content
 JavaScript can change HTML attributes
 JavaScript can change CSS style
 JavaScript can hide HTML elements
 JavaScript can show hidden HTML elements
2 JavaScript Enabling & Placement 2
 JavaScript in Internet Explorer
 JavaScript in Firefox
 JavaScript in Chrome
 JavaScript in Opera
 Your First JavaScript Script
 Whitespace and Line Breaks
 Semicolons are Optional
 Case Sensitivity
 Comments in JavaScript
3 JavaScript Variables, Operators & Strings 4
 JavaScript variables
 JavaScript variables as algebra
 JavaScript numbers and strings
 JavaScript var keyword.
 Declaring many variables in one statement
 Declaring many variables multiline
 A variable without a value returns the value undefined
11
  Re-declaring a variable will not destroy the value
 Adding JavaScript numbers
 Adding JavaScript strings
 Adding strings and numbers
 Arithmetic operator
 Assignment operator
 Comparisons operator
 String Properties
 String Methods
 String HTML Wrappers
4 JavaScript Data Types & Control Statement 4
 Declare (create) strings
 Declare (create) numbers
 Declare (create) an array
 Declare (create) an object
 Find the type of a variable
 Adding two numbers and a string
 Adding a string and two numbers
 An undefined variable
 An empty variable
 If Else, Switch Case
 For loop
 Looping through HTML headers
 While loop
 Do While loop
 Break a loop
 Break and continue a loop
 Use a for...in statement to loop through the elements of an object
5 JavaScript Functions & Arrays 3
 Array Syntax
 Array Properties & Methods
 A simple function
 A function with an argument
 A function with an argument 2
 A function that returns a value
 A function that converts Fahrenheit to Celsius
 A function call without ()
6 JavaScript Validations 2
 Basic Form Validation
 Data Format Validation
7 jQuery Overview & Syntax 1
 jQuery Introduction
 What is jQuery
 Why jQuery
 jQuery Syntax
8 jQuery Selectors & Html 3
 The #id Selector
 The .class Selector
 $("p:first")

12
  $("ul li:first")
 $(":button")
 $("tr:even")
 $("tr:odd")
 jQuery HTML
 jQuery Get
 jQuery Set
 jQuery Add
 jQuery Remove
 jQuery Css Classes
 jQuery css()
 jQuery Dimensions
9 jQuery Events & Effects 3
 Mouse Events
 Keyboard Events
 Form Events
 Document/Window Events
 jQuery Hide/Show
 jQuery Fade
 jQuery Slide
 jQuery Animate
 jQuery stop()
 jQuery Callback
 jQuery Chaining

10 jQuery Plugins & Widgets 3

 How to use Plugins
 Plugins lists & Uses
11 jQuery UI Elements 3
 JQuery UI Widgets
 JQuery UI Effects

Graphics (20 Hours)

Sl. Topics Hours

1 Photoshop Tools Overview 2
 Learn usage of different Photoshop tools (Select tools, Path, Crop,
Gradient, Type, Color)
2 Different Image Formats 3
 Distinguish between different image formats.
 Web Usable image formats
 Image animations using gif and PNG
3 Image Resizing and Extracting 3
 Concept of image sizes acceptable in webpage
 Removing Background
 Creating Banner and ads
4 Special Effects 3
 Different Built-in Filters in Photoshop
13
  Third party plugins
5 PSD to Html Conversion 6
6 Illustrator Tools Overview 3
 Identify the tools in Illustrator (Select tools, Path, Crop, Gradient,
Type, Color)
 Creating Banners with Logo

PHP (75 Hours)

Sl. Topics Hours

1 PHP Overview & Installation 2
 Basic Concept about PHP
 Installation Configure & Running
2 PHP Syntax, PHP Variables, PHP Echo / Print 3
 Basic PHP Syntax, Comments in PHP,PHP Case Sensitivity
 Creating (Declaring) PHP Variables
 PHP Variables Scope
 The PHP echo Statement
 The PHP print Statement
3 PHP Include, Require & Super global 3
 PHP include and require Statements
 PHP include vs. require
 PHP Manipulating Files
 PHP $GLOBALS
 PHP $_SERVER
 PHP $_REQUEST
 PHP $_POST
 PHP $_GET
 GET vs. POST
4 PHP Constants, Operators & Methods 4
 Create a PHP Constant
 Arithmetic operators
 Assignment operators
 Comparison operators
 Increment/Decrement operators
 Logical operators
 String operators
 Array operators
5 PHP Control Statement 6
 PHP If...Else...Else if
 PHP Switch
 PHP While Loops
 PHP For Loops
 PHP For each Loops
6 PHP Functions & Arrays 9
 Create a User Defined Function in PHP
14
  PHP Function Arguments
 PHP Default Argument Value
 PHP Indexed Arrays
 PHP Associative Arrays
 Multidimensional Arrays
7 PHP Forms 4
 PHP Form Handling
 PHP Form Validation
 PHP Form Required
 PHP Form URL/E-mail
 PHP Form Complete
8 PHP Date & Times 2
 The PHP Date() Function
 Create a Date With PHP mktime()
 Create a Date From a String With PHP strtotime()
9 PHP Files & I/O 6
 PHP Manipulating Files
 PHP File Open/Read/Close
10 PHP Session & Cookies 6
 Starting a PHP Session
 Destroying a PHP Session
 Sessions without cookies
 The Anatomy of a Cookie
 Setting Cookies with PHP
 Accessing Cookies with PHP
 Deleting Cookie with PHP
11 PHP File Upload & Email Sending 3
 Configure The "php.ini" File
 Create The Upload File PHP Script
 Check if File Already Exists
 Limit File Size
 Limit File Type
 Sending plain text email
 Sending HTML email
 Sending attachments with email
12 PHP Ajax 3
 PHP - AJAX Search
 PHP - AJAX XML Parser
 PHP - AJAX Auto Complete Search
 PHP - AJAX RSS Feed Example
13 PHP XML & Jason 3
 PHP - XML Introduction
 PHP - Simple XML
 PHP - Simple XML GET
 PHP - SAX Parser Example
 PHP - DOM Parser Example
14 PHP Object Orientated Overview 9
 Object Oriented Concepts
 Creating Objects in PHP
15
  Constructor Functions
 Inheritance
 Function Overriding
 Function Overloading
 Public Members
 Private members
 Protected members
15 PHP Frameworks Overview & Installation 6
 PHP - Frame Works (Code igniter, Laravel, Zend)
 PHP - Core PHP vs Frame Works
16 PHP CMS Overview & Installation 6
 Themes
 Pages
 Partials
 Layouts
 Content blocks
 Components
 AJAX framework
 Media manager

MySQL (40 Hours)

Sl. Topics Hours

1 MySQL Overview & Installation 2
 MySQL Definition, Audience, Prerequisites
 Installing MySQL on Linux/UNIX
 Installing MySQL on Windows
 Verifying MySQL Installation
2 MySQL Administration 2
 Running and Shutting down MySQL Server
 Setting up a MySQL User Account
 Administrative MySQL Commands
3 MySQL PHP Connectivity 2
 MySQL Connection using PHP Script
4 MySQL Database CRUD 2
 Create Database using MySQL admin,
 Create Database using PHP Script
 Insert data using MySQL admin
 Insert data using PHP
 Update data using MySQL admin,
 Update data using PHP Script
 Retrieve data using MySQL admin
 Retrieve data using PHP
 Drop table using MySQL admin,
 Drop table using PHP Script
5 MySQL Data Types 3
 Numeric Data Types
 Date and Time Types

16
  String Types
6 MySQL Table CRUD 2
 Create, Read, Update, Delete using PHP
 Create, Read, Update, Delete using JS
7 MySQL Console Query 9
 Login using Console
 Different operations using console
8 MySQL Joins 3
 MySQL inner join
 MySQL left & right join
 MySQL full join & union
9 PHP & MySQL Query 9
 Login using PHP
 Different operations using PHP
10 MySQL Indexes 3
 ALTER command to add and drop INDEX
 Simple & Unique Index
 ALTER Command to add and drop PRIMARY KEY
11 MySQL SQL Injection 3
 MYSQL Injection methods
 Preventing SQL Injection
 The LIKE Quandary

Domain & Hosting Management (15 Hours)

Sl. Topics Hours

1 Domain Concept (TLD / ccTLD) 1
 Top Level Domains
 Country Code Top Level Domains
 Third Level Domains
2 DNS and Other Records 2
 DNS and NS Records
 A Records
 MX Records
 TXT Records
 Manipulation of Records
3 Hosting Concept & Kinds of Hosting 3
 Hosting Concept
 Raw Hosting accounts
 CPanel Hosting
 Sentora Panel Hosting
 Other Panels
4 Site Upload / Restoration 3
 Different Methods of Upload (PHP Upload/ FTP)

17
  Zipped and individual Uploads
 DB Creation, User Creation and Assigning user to DB
 Using PHP MySQL to backup dump and restore
5 VPS/Dedicated Server Concept 3
 VPS Definition
 VPS Process (Boot, Reboot, Reinstallation OS)
 SSH login
 Dedicated Server Concept
6 Hosting Panel Utilities 3
 Backup
 BB Utilities
 Mail Service
 DNS Service

Final Projects (20 Hours)

Sl. Topics Hours

1 Project Modules Distributions & Merge 3
2 CMS based news web portal 6
3 E-Commerce 6
4 Debugging 3
5 Exception Handling 2

Job List:
Part 01
 Create a basic personal web page using HTML & CSS
 Create a basic personal web page using HTML5 & CSS3
 Convert a PSD templates to HTML templates
 Create a responsive navigation menu
 Validate a HTML form with JavaScript validation
 Validate a HTML form with JQuery validation
Part 02
 Registration & Login using PHP & MySQL
 CRUD operation using PHP & MySQL
o Insert
o Update
o Delete
o Manage/Grid
 Simple pagination using PHP & MySQL
 Convert HTML to WordPress Theme

18
  Simple shopping cart using PHP & MySQL
Entry Qualification:

Minimum SSC Pass.

Employment opportunities:

 Government Services
 Semi Government Services
 Corporation
 Private sectors
 NGO’s
 Abroad
 Self-employment
 Freelancing & Outsourcing

List of Tools & Equipments Required:

Tools Quantity
Personal Computer System and Accessories 10
Server PC 01
Scanner 01
Printer 01
Projector 01 (Optional)
UPS 05
Cable Connection / Modem for Internet 01
Web Browser(Chrome, Firefox) 02
Text Editor(Adobe Dreamweaver, Notepad++) 02
IDE(NetBeans/PhpStorm/Sublime text) 01

References:

 http://www.tutorialspoint.com/
 http://www.w3schools.com/
 http://www.tizag.com/
 http://learn.shayhowe.com/advanced-html-css/responsive-web-design/
 https://www.codeschool.com/
 https://learn.jquery.com/
 https://www.lynda.com/PHP-training-tutorials/282-0.html

19
20