Submitted by Hugh_Hughes on Sun, 08/18/2019 - 20:35
Module Title
Front-end Web Development (Semester 3&4)
Module Credits
10
Module Semester
3
Module Status
Mandatory

This module gives students a basis in front-end web development. Learners will acquire the knowledge and skills required to create a modern dynamic website and learn best-practice techniques for editing and publishing various media assets to the web.

Objectives

This module will ensure learners meet the following objectives:

  • Understand the basic concepts of Rich Internet Applications (RIA).
  • Build awareness of web standards and related coding practices.
  • Design and produce a dynamic front-end web application.
  • Deploy a front-end web-application for cross-platform accessibility.

Standards and Testing

 

  • Accessing web standards – Who sets the standards and what are they?
  • Designing for accessibility – For who, why, and how
  • Assessing standards compliance – Validating and debugging code - Tools, Techniques, and Resources
  • User testing – Role of testing in the development process, practical application of criteria

 

Introduction to Web Page Authoring

 

  • Writing and saving files for web
  • How to structure a HTML page - Semantic and non-semantic tags, creating Text blocks, Lists, Tables, Links, Images etc.
  • HTML syntax – tags, attributes, and values
  • Meta-data and link structure in HTML
  • CSS syntax – selectors, declarations, properties, and values
  • Format and Style in CSS- using id and class, working with margins, padding, alignment, floating, positioning etc.
  • CSS Animation and media queries for dynamic and responsive design

Standards and Testing

  • Accessing web standards – Who sets the standards and what are they?
  • Assessing standards compliance – Validating and debugging code - Tools, Techniques, and Resources
  • User testing – Role of testing in the development process, practical application of criteria

Javascript for Client-side interaction

  • Introduction to JavaScript – integrating JS with HTML
  • JS code structure – statements, variables, data types, naming conventions
  • JS Arithmetic – operands and operators, operator precedence, addition vs concatenation
  • The Document Object Model (DOM) – getting/ referencing elements using JavaScript
  • JS Functions and Events – adding event handlers, invoking functions, parameters and arguments
  • Working with arrays and objects – application and uses
  • JavaScript conditions and loops – for, while, do while, if else
  • HTML Canvas

 

Web Libraries and Frameworks

  • Choosing the right tools for your project
  • History of front-end frameworks
  • Working with grid-based design
  • Applying themes and templates
  • Adding library integration for dynamic websites
  • Awareness of cross-browser issues when using libraries

Integrating Server-side interaction

  • AJAX requests and responses
  • Data formats (XML, JSON, etc.)
  • Server-side scripting – Node.js
  • Internal Architecture of Node.js
  • Blocking code and non-blocking code models
  • Event-based server-side execution/ asynchronous execution
  • Server side process implementation and verification
  • Creating a HTTP server
  • Utilising database content
Module Assessment
Type
Continuous Assessment
Percentage
100%