Analyst Programmer_AP110: Client-side Web Programming

Wishlist Share
Share Course
Page Link
Share On Social Media

About Course

In this course, students acquire and apply :

  • The fundamentals of Web Application Development
  • Employing HTML5 and JavaScript to construct web applications compatible with various browsers and devices.
  • They create dynamic web content using interpreted languages like JavaScript and jQuery libraries.
  • The course places a strong emphasis on effective planning and production techniques.

Upon successful completion of this course, the student will have demonstrated the ability to:

  • Apply the basic steps from planning to production for web page development using advanced HTML5, the current and/or latest version of cascading style sheets (CSS), JavaScript, and jQuery Debug code across multiple browsers taking advantage of breakpoints, inspect variables, and analyze network resources to verify all parts are loading.
  • Integrate the CSS Box Model with programming practices.
  • Configure web pages with HTML5 structural elements including media and interactive elements.
  • Instantiate and use objects including Web Forms and controls.
  • Develop custom JavaScript objects and functions.
  • Use the HTML5 Canvas for applications and games utilizing media queries.
Show More

Course Content

Module 1

  • Topic 1: Getting Setup Client-Side Development
    00:00
  • LO1: Configure a Client-side Development Environment
    00:00
  • LO2: Utilize version Control and Package Managers in Web Development
    00:00
  • LO3: Knowledge Check
  • Case Study: Getting Setup Client-Side Development
  • Topic 2: HTML Fundamentals
    00:00
  • LO1: Discuss HTML Syntax and Structure
    00:00
  • LO2: Identify key HTML elements and their uses
    00:00
  • LO3: Describe Multimedia Elements to Web Pages
    00:00
  • LO4: Knowledge Check
  • Case Study: HTML Fundamentals
  • Topic 3: Standards and Accessibility
    00:00
  • LO1: Explain Web Standards and Accessibility Principles
    00:00
  • LO2: Discuss Accessibility Principles in Web Design
    00:00
  • LO3: Describe Tools to Evaluate and Improve the accessibility of Web Applications
    00:00
  • LO4: Knowledge Check
  • Case Study: Standards and Accessibility
  • Topic 4: CSS Fundamentals
    00:00
  • LO1: Describe the Basics of CSS Syntax, Selectors, and the Box Model
    00:00
  • LO2: Discuss Inline, Internal, and External Stylesheets to control Page Layout and Design
    00:00
  • LO3: Explain how to use CSS Specificity and Inheritance for more efficient Styling
    00:00
  • LO4: Knowledge Check
  • Case Study: CSS Fundamentals
  • Topic 5: CSS Options and CSS Layouts
    00:00
  • LO1: Discuss Advanced CSS options
    00:00
  • LO2: Explain Responsive and Multi-column Layouts
    00:00
  • LO3: Describe Float, Position, and Display properties to control Element Placement
    00:00
  • LO4: Knowledge Check
  • Case Study: CSS Options and CSS Layouts
  • Topic 6: Responsive CSS
    00:00
  • LO1: Discuss Mobile-first and Responsive Web Applications
    00:00
  • LO2: Compare Page Layouts Dynamically for various Screen Sizes, Devices, and Orientations
    00:00
  • LO3: Describe Fluid Grids and Flexible Media to enhance User Experience across Devices
    00:00
  • LO4: Knowledge Check
  • Case Study: Responsive CSS
  • Topic 7: CSS Frameworks
    00:00
  • LO1: Explain CSS Frameworks like Bootstrap for Rapid Prototyping
    00:00
  • LO2: Discuss Framework Components to fit Specific Design Requirements
    00:00
  • LO3: Evaluate the Merits and Demerits of using CSS Frameworks
    00:00
  • LO4: Knowledge Check
  • Case Study: CSS Frameworks
  • Topic 8: JavaScript Fundamentals
    00:00
  • LO1: Describe JavaScript Syntax, Data types, and Control Structures
    00:00
  • LO2: Discuss JavaScript code to handle user Interactions and Manipulate the DOM
    00:00
  • LO3: Explain core JavaScript concepts such as Variables, Functions, Loops, and Arrays
    00:00
  • LO4: Knowledge Check
  • Case Study: JavaScript Fundamentals
  • Topic 9: Functional Programming in JavaScript
    00:00
  • LO1: Discuss the principles of Functional Programming in JavaScript
    00:00
  • LO2: Summarise Higher-order Functions, Pure functions, and Immutability
    00:00
  • LO3: Elaborate Functional Methods for Array Manipulation
    00:00
  • LO4: Knowledge Check
  • Case Study: Functional Programming in JavaScript
  • Topic 10: Document Object Model (DOM)
    00:00
  • LO1: Manipulate the DOM to dynamically update HTML elements
    00:00
  • LO2: Understand DOM traversal and event handling to create interactive Web Applications
    00:00
  • LO3: Discuss native JavaScript methods to access, modify, and create HTML elements
    00:00
  • LO4: Knowledge Check
  • Case Study: Document Object Model (DOM)
  • Topic 11: JavaScript Libraries
    00:00
  • LO1: Evaluate the advantages of using JavaScript Libraries
    00:00
  • LO2: Incorporate third-party Libraries to enhance Web Functionality and User Experience
    00:00
  • LO3: Explain popular Libraries that provide Advanced Features
    00:00
  • LO4: Knowledge Check
  • Case Study: JavaScript Libraries
  • Topic 12: ES6+ Features
    00:00
  • LO1: Discuss modern JavaScript features introduced in ECMAScript 6 (ES6) and beyond
    00:00
  • LO2: Explain important features of ES6 and beyond
    00:00
  • LO3: Apply Modules and Classes to Structure larger, Maintainable applications
    00:00
  • LO4: Knowledge Check
  • Case Study: ES6+ Features
  • Topic 13: Introduction to React
    00:00
  • LO1: Understand the fundamentals of React
    00:00
  • LO2: Discuss the concept of Component-based Architecture
    00:00
  • LO3: Explore JSX syntax to integrate HTML-like elements within JavaScript
    00:00
  • LO4: Knowledge Check
  • Case Study: Introduction to React
  • Topic 14: Interactive React
    00:00
  • LO1: Discuss Dynamic, Interactive user interfaces using State and Props in React
    00:00
  • LO2: Manage Stateful and Stateless components to handle data flow in a React application
    00:00
  • LO4: Knowledge Check
  • LO3: Implement Lifecycle methods and Hooks to manage component behaviour
    00:00
  • Case Study: Interactive React
  • Topic 15: Client-Side Routing
    00:00
  • LO1: Understand and implement client-side routing using libraries such as React Router
    00:00
  • LO2: Explain SPA that allow for Seamless Page Transitions without reloading
    00:00
  • LO3: Analyse Routes, Links, and Navigation within a React Application
    00:00
  • LO4: Knowledge Check
  • Case Study: Client-Side Routing
  • Topic 16: AJAX Requests
    00:00
  • LO1: Analyse AJAX to fetch data from Servers without Page Refreshes
    00:00
  • LO2: Discuss fetch and XMLHttpRequest to make asynchronous HTTP Requests
    00:00
  • LO4: Knowledge Check
  • LO3: Explain JSON data from APIs for Dynamic Content Rendering
    00:00
  • Case Study: AJAX Requests
  • Topic 17: Firebase
    00:00
  • LO1: Integrate Firebase to handle Backend Services
    00:00
  • LO2: Discuss the working of Firebase Realtime Database or Firestore
    00:00
  • LO4: Knowledge Check
  • LO3: Explain User Authentication and Data Synchronization in Firebase backend
    00:00
  • Case Study: Firebase
  • Module Based Quiz

Final Exam

Eton College

Learning often happens in classrooms
but it doesn’t have to.

+1 (604) 677-3866
info@etoncollege.ca