Web Site Design , Development and Outsourcing Techniques

Course Overview/Objective

Course Objective:

After completing this course participants will be able to-

  • Design and develop static and dynamic websites.
  • Understand database concept in context of web development.
  • Work in popular marketplaces as a Freelancer.

Course Overview:

  • Learning the Basics of Web Technology- 06 Hrs
  • HTML and HTML5-18 Hrs
  • CSS-18 Hrs
  • JavaScript-24 Hrs
  • jQuery-15 Hrs
  • PHP & My SQL-30 Hrs
  • Freelancing & Outsourcing Technique-09 Hrs
Requirements

HSC/Equivalent

Course Project
N/A
Used Tools
Note Pad++, netbeans etc
Course Outline

Modules & Hours

Details

MODULE 1: Learning the Basics of Web Technology

   (06 Hrs)

 

 

 Idea about - Web Designing, Web Development, Software Development, Outsourcing, Freelancing. Differentiating between Frontend, Backend, and Full-stack development roles. Basic Ideas on - Domain, Hosting, IP, Server, Name Server, Hosting in Cloud Environment (AWS/GCP/Azure etc.), Programming Language, Designing Language, Version Control System(git), CICD Pipeline, Structured Query Language, Framework (MVC Architecture), CMS, IDE, cPanel, domain Control Panel, FTP Client, Local Server. Discuss on what we will be Learning in the Web Technology course and how Code Concepts, Program Concepts Learning to Use the Tools of Web Programming. How to use IDEs (Note Pad++, Sublime Text, PHP Storm, PHP Edit, VS Code), How to use Local Server Application (XAMPP, WAMP, LAMP, MAMP), How to use FTP Clients (Core FTP, FileZilla).  Web Hosting, Web Securities Issues.

 

MODULE 2: HTML and HTML5

(18 Hrs)

Practicing the Basics of HTML and HTML Pages, Tag (Opening Tag & Closing Tag), Element/Content, Attribute, Attribute with value. <!DOCTYPE html> Tag for HTML 5

Comments, Starting HTML Page, Head, Style, Script, Body, Meta Tag, Meta Attributes, Keywords, Description, Author, Page Refresh, Paragraph, Heading, Division, Section, Article treaded, Footer, Main, Aside Span, Cite, Address, Abbreviation, Details, Summary Bold, Underline, Italic, Small, Strong, Subscript, Superscript Delete,  Mark,  Code,  Block  Quote,  Quotation Practicing Advanced HTML and Basic HTML, Font, Font Size, Font Color, Font Face, HTML Entities - Registered Trademark, Copyright, Euro, Space, Cent, Pound Symbol - Summation, Elements Of, Not Elements Of, Empty, Differential Sign URL Anchor, Mail, Anchor, Call Anchor,                  Target, Navigation Tag, purpose of Navigation Tag, Image, Image Source, Alternate Attribute, Height and Width, Title, Body Tag, Body Attribute, Audio Tag, Video Tag, Field set tag, legend tag, HTML 5 Tags: Header, Main, nav, section, article, figure, footer

Description List, Define Terms, Define Details, Ordered List, Unordered List, List Item Practicing More HTML5 and Designing Pages, iFrame, iFrame Target, Sandbox Attribute, Load iFrame on Click, Audio, Video, Source, Media Type, Preload, Stream YouTube Video using iFrame, Base URL, Bidirectional Override, Preformatted Text, Data List, Level, Result, Access Key, Editable Attribute, Downloadable Product

Table, Table Row, Table Data, Table Head, Table Body, Table Foot, Style Attribute, Border, Marquee, loop, bicolor, scroll amount, on Mouse Over, on Mouse Out, direction behavior, alternate,  hr., size, color, bgcolor.HTML Form, action, method, post, get, ectype, multipart/form-data, input type (text, password, email, date, checkbox, radio, file, reset, hidden, checked, text area, rows, cols, select, option, selected, value, opt group, color, placeholder, Form Validation (Required, min length, max length)

HTML Form, Input Types, Get and Post Method, Button Tag, Button Attributes, Designing Website Layout using HTML

 

MODULE 3: CSS

(18 Hrs)

Practicing Basic CSS Codes, CSS application: Inline CSS, Internal CSS, external CSS

Element Type Selectors, Descendant Selectors, Class selectors, Id Selectors, Child Selectors, Adjacent sibling selectors, Pseudo Selectors, Universal Selectors.

How to and Where to CSS code, Comments in CSS, Converting Style Attribute to CSS ID Selector, Class Selector, Child Class, Grouping Selector, Multi Stylesheet, Link Stylesheet, Background Image, Background Repeat, Background Position, Background Color Padding, Margin, List, Font, Link, and Table using CSSCSS Combinators — Child Selector, Descendent Selector, Adjacent Selector; Target Selector, Dimension, Media Screen, Responsive Design, Media Queries, Viewport Units(vw, vh),   cursor, Custom Font   (from  External and  Internal Source) Designing with Advanced CSS and Basic CSS3 Border in CSS, Box Shadow, Opacity, Horizontal Alignment, Background Image Handling, White Space, Float, Clear Tag, Columns, Visibility,          Animation, Animation Moves, CSS Grids, Flexbox, Table in CSS, Position in CSS An example Dropdown Menu using CSS, Outline, menu Example I and 2, CSS for Print Screen, Transform, Border-box, Designing       Button                using       CSS Designing more Advanced with CSS3 Designing Search Box and Text Fields using CSS3, Border Image, Background Image, Background Color Gradient, Text Shadow, Word Break, Rotate, Rotate X, Rotate Y, Content Position, Counter Transform, Animation, Button in CSS3, Columns, Filter, Designing Layout using CSS, Bootstrap concept:  Introduction to Responsive Website, Bootstrap Basic, container, row, column, Tables, Images, Typography, Jumbotron, Well, Alerts, Buttons, Glyph icon, Badges/Labels, Progress Bars, Pagination, Pager. List Group, Panel, Dropdown, Collapse, Tabs/Pills, forms. Navbar, Slider, Modal, Tooltip, Media Object.

 

MODULE 4: JavaScript

(24 Hrs)

Basic JavaScript Writing JavaScript Code, Comments, Simple Variable, Variable Types JS Operators, Simple Function, Parameter, Arguments, If Else Statement,  Switch condition, for Loop, while loop, do while loop, array, onload event, onclick event, alert, confirm, Handling Multiple Condition, Conditional, Operators Get Element By ID, Get Element By Tag Name, Get Element By Class Switch Case, For Loop, EVAL Function Advanced JavaScript Parent, Parse Float, Parse String, This Element Class and Object, Advanced Class and Object Handling String, Handling Number Handling Math, Handling Math Handling Array Examples on JavaScript

 

MODULE5 :5 jQuery

(15 Hrs)

jQuery Basics, the JavaScript Library Basis Rules and Guidelines on jQuery: Show, Hide, Toggle Function; Change CSS using jQuery, Menu with Mouse-over and Mouse-out, Focus and Blur on Text Field Fade-in, Fade-out, Fade-Toggle Slide up, Slide-down, Menu using Toggle Get and Set Text/HTML using jQuery; jQuery Basics, the JavaScript Library Example — Add and Remove Element Dynamically Get Dimension using jQuery, Animation using jQuery Load File using jQuery, AJAX Page Loa using jQuery,

 

MODULE 6: PHP & My SQL

(30 Hrs)

Hypertext Pre-Processor (PHP)

Introduction to PHP, Xampp Install, PHP syntax, comments, echo, string, number PHP variable, Operators (Arithmetic, Assignment, Comparison, Logical, Concatenator, Trinary? Boolean, Increment & Decrement Operator) PHP Conditions (if, if else, if else if else, switch), PHP Loops (while, do while, for, foreach) Function (user defined functions, some needed function), Arrays (Numeric array, Associative array, multi-dimensional array). All Forms (action, method, file upload) variable, POST Variable, Get Variable. Session Variable, Cookie Variable. File Create/Write.

 

Database using MySQL

  • Introduction to MySQL, Database, table, row, column, primary key, foreign key, Database Schema Design, Database create, table create, column details (name, type, length/values, index, Autoincrement),
  • DML (insert, update, delete, select), Basic rules of SQL statement, distinct, limit, sort (asc, desc), where, comparison operator (=! =,>, <,>=, <=), in and not in operator.
  • Searching query, contact, function, Aggregate function group, having, subqueries,
  • Logical Operator (OR, AND), Alter, drop, rename, truncate, table create by SQL.
  • Relation among table, inner join, outer join (Left outer, right outer), union, create view, insert data from one table to another table.
  • Project Work

MODULE 7: Freelancing & Outsourcing Technique

(09 Hrs)

Freelancing & Outsourcing Technique

  • To create account and profile in market place website
  • Facing interview and tips of bidding.