Learn Web UI Development | HTML5, CSS3, Javascript, JQuery, AngularJS Curriculum

Section 1: Laying out a Page with HTML5
Page Structure
New HTML5 Structural Tags
Page Simplification
Section 2: HTML5 - How We Got Here
The Problems HTML 4 Addresses
The Problems XHTML Addresses
The New More Flexible Approach of HTML5 - Paving the Cowpaths
New Features of HTML5
The HTML5 Spec(s)
Current State of Browser Support
Section 3: Sections and Articles
The section Tag
The article Tag
Section 4: HTML5 Audio and Video
Supported Media Types
The audio Element
The video Element
Scripting Media Elements
Dealing with Non-Supporting Browsers
Section 5: HTML5 Forms
New Input Types
Section 6: HTML5 New Form Attributes
Section 7: HTML5 New Form Field Attributes
Section 8: New Form Elements
progress and meter
Section 9: HTML5 Web Storage
Overview of HTML5 Web Storage
Web Storage
Other Storage Methods
Section 10: HTML5 Canvas
Getting Started with Canvas
Drawing Lines
Color and Transparency
Circles and Arcs
Quadratic and Bezier Curves
Section 11: Integrated APIs
Offline Application API
Drag and Drop API
Section 12: Conclusion
Section 13: Introducing JavaScript
Evolution of JavaScript since 1996
Current uses of JavaScript in web applications
Section 14: Where JavaScript goes
Placing JavaScript code in separate .js files
Using unobtrusive JavaScript principles to separate event handlers from HTML
Section 15: JavaScript language fundamentals
Variables and data types
Operators (for both numbers and strings)
Conditionals (if-else if-else and switch-case)
Loops (while, do-while, for)
Section 16: Understanding JavaScript objects
The role of objects in JavaScript programming
Working with methods and properties
The JavaScript object hierarchy
The implicit window object
Event handlers
Section 17: JavaScript with forms
How forms fit into the JavaScript DOM
Setting focus on a specific field
Blocking a field from being edited
Setting field values based on user input
Basic validation: requiring field values to be filled in
Handling calculations within forms (useful for totaling orders and other quantitative formoperations)
Section 18: JavaScript with links and images
Using onMouseOver and onMouseOut to detect the presence of the mouse
Using onClick to process clicks on hyperlinks
Having hyperlinks call functions via javascript: URLs
Conditionally navigating the user to a page when they click a link
Dynamically swapping one or more images on a page based on the position of themouse
Section 19: JavaScript for navigation
Overview of the history and location objects
Building a jump menu (a pulldown menu that takes the user to a page based on theirselection)
Navigating the user to a specific page based on their input in a form
Section 20: JavaScript for pop-up help
Pros and cons of having JavaScript open another window
Generating and sizing a new (child) window via JavaScript
Communication between the child window and the parent window
Implementing attractive pop-up help or information windows using JavaScript
Section 21: Advanced form validation with regular expressions
Overview of regular expressions as a powerful language for validating form submissions
Using the RegExp object in JavaScript
Section 22: Conclusion
Section 23: Getting Started with jQuery UI
Building a Custom Download
Using an Existing Theme or Creating Your Own
Optional: Overview of jQuery Methods Extended/Modified by jQuery UI
Optional: jQuery UI Animations
Section 24: jQuery UI Interactions
Section 25: jQuery UI Widgets, Part I
Section 26: jQuery UI Widgets, Part II
Section 27: Extending jQuery UI
Using a JavaScript Object to Maintain State Information
Using a Single Method with an Action Argument
Creating a Plugin Using $.widget()
Adding Event Handling to Your Plugin
Section 28: Conclusion
Section 29: Introduction
Section 30: Defining HTML5
HTML5 markup
A tour of the key HTML5 elements
The video, audio, and canvas elements
Web forms
Many more new HTML5 elements
An overview of HTML5 APIs and supporting technologies
Geolocation in action
Web workers
Web storage
CSS animations
CSS transitions
CSS 2D and 3D transformations
CSS3 backgrounds, borders, RGBa colors, gradients, drop shadows, and roundedcorners
@ font-face web fonts
HTML5 is in a state of transition
Who is using HTML5 today?
Identifying HTML5 sites
Section 31: Fundamentals of HTML, XHTML, and CSS
Web languages
Page structure based on HTML
The details of XHTML syntax
Doctype lets the web browser know what to expect
The W3C and page validation
HTML structure
Placing images in HTML
The role of CSS
Styling a heading
Understanding class styles and the element
Three ways to use style
Internal vs. external style sheets
Creating an external style sheet
What makes styles cascading
Section 32: Formatting Text with CSS
The importance of typography on the Web
The challenges of font on the Web
Setting a font-family
Sizing text with CSS
Pixels and points are not the best choices
Using a combination of percent and the em measurement
Using margins to modify space between your text
Setting paragraph line-height
Transforming text with CSS
Working with HTML lists
Styling HTML lists
Section 33: Introduction to CSS Layout
Working with a CSS reset file
A brief history of layout techniques on the Web
An overview of page layout options
Understanding the
element: creating a two-column fixed-width layout
Understanding the CSS float property
Creating columns with the float property
Working with the clear property
Creating a list-based navigation using floats
Adding text styles
The effect of margins and padding on your fixed-width layout
A review of using margins and padding for layouts
Styling your footer with a background image
Section 34: Advanced CSS Layout
Building your page layout
Removing the background color
Working with CSS background images
Using hacks to solve layout problems
Enhancing your CSS navigation bar
Moving internal styles to the external style sheet
Creating a style for an active page
Adding images to your sidebar
Working with absolute positioning
Section 35: Using HTML5 Markup
A review of semantic markup
HTML5 fundamentals
The HTML5 Doctype declaration
The different categories used for HTML5 content
Using the new header element in HTML5
Adding support for HTML5 elements in browsers
Adding the HTML5
Adding the other HTML5 sectioning elements
HTML5 document outlines
Adding the footer element
Adding the article and aside elements
Additional HTML5 elements
Revisiting familiar HTML5 elements
Section 36: Creating HTML5 Forms
The need for updated forms
Reviewing how forms work
The components of a form
Adding new HTML5 input types and attributes
Creating an order form
HTML5 form features under development
Providing fallback for browsers that don't support HTML5
Section 37: Introduction to JavaScript and jQuery
Interactivity on the Web
Adobe Flash
JavaScript basics
Placing your JavaScript into an external document
The Document Object Model
JavaScript frameworks
Hiding an element with JQuery
Adding an event to trigger the show event
Section 38: Working with Video and Audio Elements
Adding video
Adding support for more browsers
Adding fallback support for older browsers
Controlling a video with JavaScript
Adding audio
Section 39: Working with Canvas
Understanding the canvas element
The benefits of the canvas element
Drawing paths
Drawing rectangles
Drawing lines and circles
Drawing with curves
Adding text
Using colors, styles, and gradients
Adding images
Using transforms
Creating a drawing loop
Section 40: Styling with CSS3
Understanding the role of CSS3
Using CSS3 border-radius and border-image
Adding multiple background images
Working with CSS3 transparency and opacity
Using CSS3 gradients
CSS3 gradients potential for the future
CSS3 transforms, transitions, and animation
Working with web fonts
Using @font-face to specify a web font
Using a web service to generate multiple fonts
Section 41: CSS3 Media Queries and the Future of CSS3
The role of CSS3 media queries
Using CSS3 media queries to deliver a mobile-optimized layout
Upcoming developments in CSS3
The CSS3 multi-column layout
The CSS3 flexible box layout module
The CSS3 template layout module
Adding template based position to CSS
Section 42: Offline Storage in HTML5
HTML5 storage types
localStorage methods
localStorage example
Putting it all together
Advanced data storage
Application caching
The cache manifest file
Cache manifest structure
Updating the cache
The applicationCache object
Bringing it all together
Section 43: HTML5 Geolocation
Understanding Geolocation
Getting the user's location
Displaying the user's location with Google Maps
Browsers lacking HTML5 Geolocation
Creating an HTML5 Geolocation and Google Maps mashup
Adding Google Map markers to your Geolocation page
Section 44: HTML5 Drag and Drop
Drag and drop on the Web
Cross-browser drag and drop
Transferring data with a drag and drop operation
Section 45: JavaScript fundamentals
Scope & Function Context
this keyword
Object-Oriented in JavaScript
Async and Parallel in JavaScript
JavaScript Design Pattern
Section 46: What are Web Applications?
The Challenge with Web Apps (SPA)
SPA or Web App's?
To bind or not to bind? this is the question
MVC or MVVM Frameworks
Why AngularJS?
Section 47: AngularJS Building Blocks for Building SPA
Template & live data binding ( Directives & $scope )
Model, View & Controller (MVC)
Dependency Injection ( AngularJS services )
Section 48: Forms in AngularJS
ng-model directive
ngModelController & FormController
Custom Validation
Input directive
Section 49: AngularJS Filters
Filter Syntax
AngularJS Filters
Custom filters
Section 50: Communication
$.Ajax vs. $http
Promises ($q) vs. Calbacks
Offline / Online
LAB: Full TV Show Web App
Section 51: AngularJS Internal
AngularJS Startup Process
AngularJS Runtime
Scope API ($id, $watch & $apply )
Scope Communication
Template Services:
Injector Service
$provide service
Section 52: Custom Directive
Compile function
Link function
Tips & tricks
Section 53: Routing and Navigation
$location service
ng-view directive
$route service and route object
Navigation flow
Routing broadcasted events
Resolve option and promise
Cancelling route changes
Section 54: AngularJS Testing
Unit Testing (Jasmine.js)
AngulrJS Mock API's (ngMock)
Unit Testing Tools
E2E Testing
ngMockE2E - $httpBackend
Section 55: AngularJS Animation
CSS3-enabled Animations
Directive That Support Animation
JavaScript-enabled Animations
Using Animations in your own directives
Section 56: AngularJS Tips & Tricks
Optimization & Performance
AngularJS External Module
  • $1,099.00 $999.00
  • 30 Days
  • Course Certificate