We're offering 20% off September Live Online classes! See which courses are applicable.   |   Details >

  
AccountIcon BigDataIcon BlogIcon default_resource_icon CartIcon checkmark_icon cloud_devops_icon computer_network_admin_icon cyber_security_icon gsa_schedule_icon human_resources_icon location_icon phone_icon plus_icon programming_software_icon project_management_icon redhat_linux_icon search_icon sonography_icon sql_database_icon webinar_icon

Search UMBC Training Centers

Programming

Responsive Web Development: AngularJS and Bootstrap

+ View more dates & times
    
    
    
    
                     
  • Overview

    AngularJS has become a popular JavaScript framework for the development of “single page” Rich Internet Applications. The AngularJS framework augments applications with the popular “model-view-controller” pattern which helps make applications easier to develop and test because there is a separation of responsibilities within the code. Although there are many benefits to using the AngularJS framework it is fairly different than the way “typical” web applications involving JavaScript have been designed. This training course will provide an introduction to the benefits of AngularJS so course participants can start to develop responsive applications quickly using the framework.

    OBJECTIVES

    In this training, attendees will learn how to:

    • Create single page web applications using the MVC pattern of AngularJS
    • Understand the programming model provided by the AngularJS framework
    • Define Angular controllers and directives
    • Control Angular data bindings
    • Implement Responsive Web Applications with AngularJS and Bootstrap
  • Who Should Take This Course

    PREREQUISITES

    Attendees should have some prior understanding of web development, HTML, AJAX, and JavaScript.

  • Schedule
  • Course Outline

    CHAPTER 1: ADVANCED OBJECTS AND FUNCTIONALITY IN JAVASCRIPT

    • Basic Objects
    • Constructor Function
    • Object Properties
    • Constructor and Instance Objects
    • Constructor Level Properties
    • Namespace
    • Functions are First-Class Objects
    • Closures
    • Closure Examples
    • Private Variables with Closures
    • Prototype
    • Prototype Property Hierarchy
    • Prototype Chain
    • Inheritance Using Prototype
    • Extending Inherited Behavior
    • Enhancing Constructors
    • Improving Constructor Performance
    • Summary

    CHAPTER 2: INTRODUCTION TO ANGULARJS

    • Concepts
    • Invoking Angular
    • Client-Side Templates
    • Directives

    CHAPTER 3: MODEL-VIEW-CONTROLLER

    • Data Binding
    • MVC Explained

    CHAPTER 4: WORKING WITH TEXT AND FORM INPUTS

    • Displaying Text
    • The ng-bind and ng-model Directives
    • Form Inputs
    • The ng-click and ng-submit Directives

    CHAPTER 5: WORKING WITH REPEATED ELEMENTS

    • Working with Lists in Web Pages
    • The ng-repeat Directive
    • Understanding the $index, $first,  $middle and $last Variables

    CHAPTER 6: APPLYING STYLES

    • Hiding and Showing Elements
    • Working with CSS Classes and Styles
    • Understanding the ng-style and ng-class  Directives

    CHAPTER 7: EXPRESSIONS

    • Expressions Explained
    • Supported Math, Logical and Bitwise Operations
    • Limitations of Expressions

    CHAPTER 8: APPLICATION MODULES AND DEPENDENCY INJECTION

    • Partitioning Responsibilities with Controllers
    • Publishing Model Data with Scopes
    • Organizing Dependencies with Modules

    CHAPTER 9: MISCELLANEOUS ANGULAR TOPICS

    • Observing Model Changes with $watch
    • Formatting Data with Filters
    • The currency, date, orderBy and Other Filters

    CHAPTER 10: CUSTOM DIRECTIVES

    • Directive API
    • Directive Definition Object
    • Templates
    • Transclusion
    • Compile and Link Functions
    • Manipulating DOM Elements
    • Injecting Controllers

    CHAPTER 11: TALKING TO WEB SERVERS

    • The $http Service Explained
    • Implementing the success and error Call-back Functions
    • Processing Received Data
    • $http Configuration Options
    • Setting Request Headers

    CHAPTER 12: TESTING

    • Unit testing using Jasmine
    • End-to-End testing with Protractor

    CHAPTER 13: INTRODUCTION TO CSS3

    • What is a Style?
    • What are Cascading Style Sheets?
    • CSS and the Evolution of Web Development
    • CSS and HTML
    • CSS Compatibility
    • CSS Rules
    • New in CSS3
    • Summary

    CHAPTER 14: APPLYING CSS STYLES

    • Inline Styles
    • Embedded Styles
    • External Styles
    • Selectors
    • Combinator Selectors
    • Universal Selector
    • Style Classes
    • Pseudo-Classes
    • Inheriting From a Parent
    • Declaring !important Styles
    • CSS Cascade Order
    • Summary

    CHAPTER 15: BOX MODEL AND EFFECTS

    • Element Box Model
    • Parts of the Box Model
    • Setting Width and Height
    • IE Box Size Bug
    • Controlling Flow in Position
    • Hiding Content
    • Overflowing Content
    • Floating Elements
    • Using Float for Multiple Columns
    • Margins
    • Padding
    • Border
    • Outline
    • CSS 3 – Rounding Border Corners
    • CSS 3 – Using a Border Image
    • Border Image Example
    • Summary

    CHAPTER 16: CSS 3 AND RESPONSIVE WEB DESIGN

    • What is Responsive Web Design?
    • Elements of Responsive Design
    • Example of Responsive Design
    • Alternatives to Responsive Design
    • Progressive Enhancement
    • Implementing Progressive Enhancement
    • Media Types
    • CSS Style “Reset”
    • Conditional Styles for Internet Explorer
    • What is the Viewport?
    • Adapting the Viewport
    • Specifying the Viewport
    • Media Queries
    • Media Features Used in Media Queries
    • Combining Responsive Design Techniques
    • Testing Responsive Design
    • Summary

    CHAPTER 17: BOOTSTRAP OVERVIEW

    • Bootstrap History
    • Current Status
    • Responsive Web Development
    • Responsiveness
    • Why it Matters
    • Download Bootstrap
    • Contents
    • How it works
    • Bootstrap Content Development Network
    • Using Bootstrap
    • Mobile First
    • Features
    • LESS
    • Responsive Grid Layout
    • Reusable GUI Components
    • JavaScript
    • Summary

    CHAPTER 18: USING BOOTSTRAP

    • Including Bootstrap CSS Files
    • Including Bootstrap JavaScript Files
    • Viewport Meta Tags
    • Example
    • Layouts
    • Grid
    • Grid Source
    • Grid Explained
    • Navigation
    • Navigation (Desktop)
    • Navigation (Mobile)
    • Navigation Source
    • Navigation Explained
    • Navigation Elements and Styles
    • Glyphicons
    • Summary
  • FAQs
    Is there a discount available for current students?

    UMBC students and alumni, as well as students who have previously taken a public training course with UMBC Training Centers are eligible for a 10% discount, capped at $250. Please provide a copy of your UMBC student ID or an unofficial transcript or the name of the UMBC Training Centers course you have completed. Online courses are excluded from this offer.

    What is the cancellation and refund policy?

    Student will receive a refund of paid registration fees only if UMBC Training Centers receives a notice of cancellation at least 10 business days prior to the class start date for classes or the exam date for exams.

Contact Us