Project-Based Introduction to Web Programming for Behaviour Researchers

Learning Outcomes

Learning Outcomes

Having successfully completed this module you will be able to:

• the relationships between a (research) task and web design
• how to apply and integrate the technologies in web applications
• the basics of each of the five main technologies in web programing (i.e., HTML5, CSS, JavaScript, PHP, and MySQL)

1. Introduction and preparations (A1 - A3)

Project 1: Server-based MUQ Web Application

2. Index page; HTML -- mandatory and text tags/elements, entities, form and input, box model, comments, validation; CSS -- style sheets, style declarations (e.g., font, size, alignment, color, margin, padding, border), comments, validator.

3. Welcome page and modularisation; HTML -- item lists, id; CSS -- height/width, containing block, position, margin, min-height; PHP -- basics, echo, print, functions (e.g., include, require), variables, if-else construct, mingling with HTML, comments, validator.

4. Visible Part 1 of MUQ; HTML -- table, drop-down list, div; CSS -- pseudo-class; PHP -- arrays, $_GET[], $_POST[], for loops, comparison operators, concatenating assignment operator, user defined functions, comments, validator

5. Invisible Part 1 of MUQ; web security (validation and sanitisation); PHP -- $_SERVER['REQUEST_METHOD'], isset(), filter_var(), filter_var_array(), pre-defined filters, var_dump(), array_push(), session_start(), $_SESSION[], array_fill()

6. Part 2 of MUQ; data handling; HTML -- radio button; PHP -- foreach construct, header()

7. Data storage; MySQL -- create a database, create a table, define variables, data types, validation; PHP -- mysqli_connect(), mysqli_close(), error control operator, constants, mysqli_query(),define(),

8. Record and debriefing page; PHP -- implode(), date(), time(), mysqli_insert_id(); MySQL -- INSERT query; phpMyAdmin

Project 2: JavaScript-enabled MUQ Web Application

9. JavaScript -- DOM and objects, methods and properties, DOM events and event handlers, comments, validator, functions, variables, arrays, length property, fill(), join(), push(), control structures (for, if-else), operators, alert(), write(), innerHTML, getElementById()

10. MUQ Parts 1 and 2; clent-side validation, getElementsByName(), value property, toString(), submit(),

Project 3: An Experimental Task

11. Introduction of the task and planning

12. Scripting the task; JavaScript -- custom-defined shuffle(), timing methods and events, measuring response times, onkeydown event, key property, search()

Teaching and learning methods

• Online, individual, supervisory meetings
• e-tutorials via PowerPoint slides
• Q&A workshops

Assessment strategy

For the referral assessments, unless the Special Considerations and/or Exams Boards recommend otherwise, the module will be redeemed by completing all required coursework assignments and a supplementary assessment. Component marks for coursework and research participation will be carried forward.

Summative

This is how we’ll formally assess what you have learned in this module.

Referral

This is how we’ll assess you if you don’t meet the criteria to pass this module.

Repeat Information

Repeat type: Internal & External