Courses Offered: SCJP SCWCD Design patterns EJB CORE JAVA AJAX Adv. Java XML STRUTS Web services SPRING HIBERNATE  

       

UI Technologies Course Details
 

Subcribe and Access : 5200+ FREE Videos and 21+ Subjects Like CRT, SoftSkills, JAVA, Hadoop, Microsoft .NET, Testing Tools etc..

Batch Date: Dec 14th @9:00AM

Faculty: Mr. Nagoor Babu

Venue :
DURGA SOFTWARE SOLUTIONS at Maitrivanam
Plot No : 202, IInd Floor ,
HUDA Maitrivanam,
Ameerpet, Hyderabad-500038.

Ph.No: +91 - 9246212143, 80 96 96 96 96

Syllabus:

HTML, CSS, Java Script, Bootstrap

Fundamentals
Application
Client
Browser
Web application
HTTP

HTML 4 & 5
HTML Basics
Introduction to HTML
HTML Versions
Tag
Syntax of HTML Program
Steps to Prepare First Example in HTML

1. Installing Visual Studio Code
2. Creat HTML Program
3. Excute the HTML program

Understanding HTML Syntax

  • <html>
  • <head>
  • <body>
  • <title>

Attributes
DOCTYPE
Basic Tags in HTML
Headings
Paragraphs
Line breaks
Text Formatting Tags
Bold
Italic
Underline
Strikeout
Superscript
Subscript
Images

  • Images

Hyperlinks

  • Hyperlinks

List tags

  • Unordered list
  • Ordered List
  • Definition list

Tables

  • Tables tags

Miscellaneous Tags

  • IFrame
  • HTML Entities
  • Meta

Forms

  • Forms
  • input tag
  • textbox

Password Textbox
CheckBox
Checked Attribute
Radio Button
File Browse Button
Reset Button
Submit Button
Name Attribute
Login Form
Registration Form
Post Submission
Image submit Button
General Button
Hidden Field
Color
Date
Time
Datetime-Local
Month
Week
Search
Number
Range
Email
Url
Maxlength Attribute
Value Attribute
Readonly Attribute
Disabled Attribute
Tabindex Attribute
ID Attribute
Placeholder Attribute
Autofocus Attribute
Requried Attribute
Pattern Attribute
Min and max Attribute
Step Attribute
Nonvalidate Attribute
Multiple Attribute
Autocomplete Attribute
Button Tag
Fieldset
Legend
Lable
Dropdownlist
Option Groups
Listbox
Selected Attribute
Textarea
<div> and <span>
DIV
span
Advanced Tags
Horizontal ruler
Audio
Video
Details and summery
Datalist
ProgressBar
Article
Semantic tags
Header
Nav
Section
Footer
Aside
Storage

  • Local storage
  • Session Storage

Geo Location
Web Workers
Drag and Drop
Canvas

  • Creating canvas container
  • Get context of canvas
  • strockestyle
  • linewidth
  • strokerect
  • fillstyle
  • fillrect
  • Example on canvas

SVG

  • syntax to create SVG container
  • example on SVG

Deprecated Tags/Attribute

  • Deprecated/removed tags in HTML5
  • Deprecated/removed Attribute in HTML5

CSS 2 & 3

Fundamentals of CSS

  • Introduction to CSS
  • CSS basic selectors
  • First example on ID selector
  • CSS-Properties

Colors

  • Color
  • background-color
  • Types of colors

Font styles

  • font-family
  • font-size
  • font-weight
  • font-style
  • Text styles
  • letter-spacing
  • word-spacing
  • line-height
  • text-dectoration
  • text-transform
  • text-align
  • text-indent

Span
Background image

  • background-image
  • background-attachment

Lists

  • list-style-type for <ul>
  • list-style-type for <ol>
  • list-style-image

DIV

  • <div> tag
  • "width" and "height" properties
  • float
  • clear

Box Model

  • understanding box model
  • border-style
  • border-width
  • border-color
  • border-shortcut
  • border-sides
  • margin
  • margine-sides
  • margine-shortcut
  • padding
  • padding-sides
  • padding-shortcut

Advanced CSS Properties

  • "opacity" property
  • disply
  • visibility
  • overflow

Types of Style Sheets

1. Internal style sheet/embedded style sheet
2. External style sheet
3. Inline style sheet

CSS Selectors

  • tag selector
  • ID selector
  • Class selector
  • compound selector
  • grouping selector
  • child selector
  • direct child selector
  • attribute selector
  • hover selector
  • focus selector
  • universal selector
  • css style precedence

CSS realtime examples

  • table style
  • hyperlink styles
  • menubar
  • login form

Advance CSS

  • border radius
  • shadow
  • transitions
  • transformations
    1. rotate transformation
    2. skew transformation
    3. scale transformation
    4. translate transformation
  • multiple transformation
  • transform-origin
  • Animitations

Static page template

  • example on static page template
  • example on page navagition using static page template

Responsive web design

  • what is responsive web design
  • media quries
  • view port meta tag
  • example on responsive web design

BOOTSTRAP

  • fundamentals of bootstrap
  • introduction to bootstrap
  • preparing environment for bootstrap
  • "container" class
  • "container-fluid"class

COLORS

  • text colors
  • background colors

TEXT

  • Display headings
  • text alignment
  • text styles
  • lead
  • visibility

GRID SYSTEM

  • understanding the coloumns
  • grid system with responsive web design
  • jumbotron

Images

  • images shapes
  • images alignment
  • image fluid

Tables

  • basic table
  • borderless table
  • bordered table
  • striped table
  • hover table
  • table background colors
  • table header background colors
  • table small
  • table responsive

Alerts

  • alerts

Buttons

  • button colors
  • button outline
  • button sizes
  • button groups
  • button vertical groups
  • button dropdown

BADGES

  • basic badges
  • badges colors
  • pill badges

Progress bar

  • basic progress bar
  • progress bar colors

PAGINATION

  • basic pagination
  • pagation size
  • pagation alignment

BREADCRUMBS

  • breadcrumbs

LIST GROUP

  • basic list groups
  • list group colors

CARDS

  • basic cards
  • card colors
  • card images
  • card groups

TOOLTIP

  • tooltip
  • popover

COLLAPSIBLE

  • basic collapsible
  • link collapsible
  • accordion

FORMS

  • inline form
  • stacked form
  • form grid
  • horizontal form grid
  • input groups
  • form validation

NAVIGATION MENU

  • basic navigation menu
  • navigation menu alingment
  • vertical navigation menu
  • tabs
  • pills
  • tabs with dropdown

NAVITION BAR

  • basic navition bar
  • navbar collapsible
  • navbar dropdown
  • navbar search
  • navbar fixedtop
  • nav bar stickytop
  • scrollspy
  • carousel

MODAL

  • modal

JAVASCRIPT 5, 6 & 7

  • Fundamentals
  • introduction to javascript
  • syntax of javascript
  • console.log[]

Steps to prepare first example in javascript

1. installing visual studio code
2. creat javascript program
3. execute the javascript program

Variables
operators

  • arithmetical operators
  • assignment operators
  • increment and decrement operators
  • relational operators
  • logic operators
  • concatenation operators

Control statements

  • if
  • switch-case
  • while
  • do-while
  • for

Functions

  • arguments and return
  • recursion

Arrays

  • steps for development of arrays

Object oriented programming in javascript

  • introduction to object
  • types of object oriented programming[OOP] languages
  • creating objects
  • object literials
  • constructor function
  • object.keya

JSON

  • stringify
  • parse
  • object array literal
  • object array
  • prototype
  • inheritance

DATA TYPES

  • string
  • typeof
  • undefied vs null
  • ==and==
  • string function
  • tostring function
  • number function
  • parselnt function
  • parsefloat function
  • +unary operator
  • to fixed[] function

STRING FUNCTION

  • to uppercase[]
  • to lowercase[]
  • length
  • charAt[]
  • charcodeAt[]
  • substr[]
  • indexof[]
  • replace[]
  • split[]
  • trim[]
  • concat[]

Date Functions

  • new Date
  • to Locale Datestring
  • to Locale Timestring
  • get Time
  • get Day
  • get Date
  • get Month
  • get Full year
  • get Hours
  • get Minutes
  • get seconds
  • get milliseconds
  • creating a custom Date

Adavanced
closers
Hoisting
DOM
Window
location.href
navigator.user Agent
navigator.screenx
navigator.screeny
alert
confirm
print
setTime out
setInterval
scroll To
open
Document
title
head
body
images
links
URL
document.write
document.getElementByid
document.getElementsByName
document.getElementsByTagName
document.getElementsByclassName
document.queryselectorAll
document.queryselector
Element
tag Name
id
innerHTML
innerText
style
parentElement
children
scrollTop
setAttribute
getAttribute
removeAttribute
attributes
hasAttribute
focus
click
remove
document.createElement
appendchild
addEventListener
introduction to Events
List of Events
click event
Dblclick event
Mouseover and Mouseout events
Mousemove event
keyup event
keypress event
Focus and Blur events
change event
contextmenu event
cut copy paste events
Login Example
Add,subtract,Multiply,DivideExample
Validations
Regular Expressions
Types of JavaScript
Internal Javascript
External Javascript
JavaScript-New Features
Introduction to Javascript 6
class-based oop
classes
classes
construstors
Methods
Inheritance
Method Overriding
Misc. concepts
set and Get Methods
Default Arguments
Arrow Functions
Let
const
Rest operator
Destructuring
Multiline Strings
String Interpolation
Reading Elements From Array