Lectures - Fall 2012

Here you find the schedule of the lectures and labs. The links to the material of the course will be available on this page.

Friday 2nd November 2012
8:15-10:00

This lecture gives an introduction to the mobile application ecosystem and looks at the pros and cons of using Web technologies for building mobile applications, especially focusing on HTML5.

We also introduce some basic elements of web development that will be necessary throughout the course (i.e. Sinatra, Javascript, Ruby, etc).

Documents: lecture1.pdf

Examples:
10:15-12:00

We'll introduce the course assignment: goals, expectations, evaluation method, schedule and way of working.

Documents: lab1.pdf

Friday 9th November 2012
Lab 2: Concepting the Web App
HÃ¥kan Mitts
8:15-10:00

During this lecture we will review at the various ideas and concepts for the weather webapp. Prepare the concepts in advance.

Lab 3: jQuery Mobile
Guest Lecture: Mikael Blomberg, SC5
10:15-12:00

This lab is focused on learning jQuery and jQuery Mobile through examples and hands-on exercises.

Documents: lecture_jquerymobile.pdf

Examples are located at: https://github.com/mikaelsc5/jQM-Example




Friday 16th November 2012
8:15-10:00

This lecture introduces the basics for creating a mobile web application with HTML5 and jQuery. We create a simple blog application that demonstrates the following elements:

  • viewport meta tag
  • Forms, new HTML5 form semantics and validation
  • Styling
  • Contenteditable attribute
  • Single page and multipage with jQuery Mobile
  • Sinatra server with templates
  • Local storage
  • Offline usage
  • Detecting connectivity changes

Documents: lecture2.pdf

Examples:
10:15-12:00

In this lecture we'll explore the advantages of using a templating method for creating the views of the application. We also explore the benefits of Backbone.js for simplifying the design of the web client. We cover the following topics:

  • Introduction to client-side templating
  • Example with Handlerbar.js
  • MVC architecture for webapps
  • Introduction to Backbone.js
  • Example of MVC web app

Documents: lecture3.pdf

Examples:
Friday 23rd November 2012
8:15-10:00

In this lecture we'll give an overview of the new elements of CSS3 (like media queries, transitions, animations), how to support touch interactions and the principles of responsive design.

Documents: lecture4.pdf

Examples:

10:15-12:00

In this lab we'll do an hands-on exercise for learning Backbone.js

Friday 30th November 2012
8:15-10:00

In this lecture we explore the APIs for drawing on the canvas, for reading from the file system, for using the new XMLHttpRequest Level 2, for accessing the camera, accelerometers and geolocation and, for playing audio/video files.

Examples:
Lab 5: Work on the challenge
10:15:12:00

This lab will be used for working on the webapp challenge

Friday 7th December 2012
8:15-10:00

In this lecture we focus on the real-time communication API that is now supported in HTML5:

  • Push Technology
  • Web Sockets
  • Server-Sent Events
  • Web Workers

Examples:
10:15-12:00

This lab will be use for practical exercises on specific topics.

Friday 14th December 2012
8:15-10:00

This lab will be use for practical exercises on specific topics.

Lab 7: Work on the Challenge
10:15-12:00

This lab will be used for working on the webapp challenge

Lectures - Spring 2012

Below you find the material for the lectures and labs of the Spring 2012 edition of the course.

Monday 12th March 2012
14:15-15:45

This lecture gives an introduction to the mobile application ecosystem and looks at the pros and cons of using Web technologies for building mobile applications, especially focusing on HTML5.

We also introduce some basic elements of web development that will be necessary throughout the course (i.e. Sinatra, Javascript, Ruby, etc).

Documents: lecture1.pdf

Examples:
16:00-17:45

We'll introduce the course assignment: goals, expectations, evaluation method, schedule and way of working. We'll also form the teams and check your development environment.

Documents: lab1.pdf, webapps_development_tools.pdf, Group work instructions.pptx

Monday 19th March 2012
14:15-15:45

This lecture introduces the basics for creating a mobile web application with HTML5 and jQuery. We create a simple blog application that demonstrates the following elements:

  • viewport meta tag
  • Forms, new HTML5 form semantics and validation
  • Styling
  • Contenteditable attribute
  • Single page and multipage with jQuery Mobile
  • Sinatra server with templates
  • Local storage
  • Offline usage
  • Detecting connectivity changes

Documents: lecture2.pdf

Examples:
Lab 2: jQuery Mobile
Guest Lecture: Mikael Blomberg, SC5
16:00-17:45

This lab is focused on learning jQuery and jQuery Mobile through examples and hands-on exercises.

Documents: jQuery Mobile - Mikael Blomberg.pdf

Examples: jQuery Examples




Monday 26th March 2012
14:15-15:45

In this lecture we'll explore the advantages of using a templating method for creating the views of the application. We also explore the benefits of Backbone.js for simplifying the design of the web client. We cover the following topics:

  • Introduction to client-side templating
  • Example with Handlerbar.js
  • MVC architecture for webapps
  • Introduction to Backbone.js
  • Example of MVC web app

Documents: lecture3.pdf

Examples:
Guest Lecture: Mikael Blomberg, SC5
16:00-17:45

This lab will be focused on mastering the details of Backbone.js through several examples.

Monday 2nd April 2012
14:15-15:45

In this lecture we explore the APIs for drawing on the canvas, for reading from the file system, for using the new XMLHttpRequest Level 2, for accessing the camera, accelerometers and geolocation and, for playing audio/video files. We cover the following topics:

  • Canvas API
  • Bytes, Blobs and File API
  • HTML Media Capture API
  • Motion Sensor API
  • GeoLocation API
  • Audio & Video

Documents: lecture4.pdf

Examples:
16:00-17:45

Hands-on exercises on device access API

Monday 16th April 2012
14:15-15:45

In this lecture we'll give an overview of the new elements of CSS3 (like media queries, transitions, animations) and how to support touch interactions. We will cover the following topics:

  • Media Queries
  • Position: fixed
  • Overflow: scroll
  • Touch Interaction
  • CSS3 Selectors
  • CSS3 Transformations
  • CSS3 Transitions
  • CSS3 Animations

Documents: lecture5.pdf

Examples:

Lab 5: Ruby on Rails 3
Guest Lecture: Lauri Jutila and Matias Korhonen, Kisko Labs
16:00-17:45

This lecture will introduce the basics of Ruby on Rails 3.

Documents: Ruby on Rails - KiskoLabs.pdf

The example that was used in the lab is available on github at: Aalto on Rails

Monday 23rd April 2012
14:15-15:45

In this lecture we focus on the real-time communication API that is now supported in HTML5:

  • Push Technology
  • Web Sockets
  • Server-Sent Events
  • Web Workers

Documents: lecture6.pdf

Examples:
Lab 6: Designing REST interfaces
Guest Lecture: Lauri Jutila and Matias Korhonen, Kisko Labs
16:00-17:45

This lecture will dive into the principles of REST design and how to create RESTful interfaces with Ruby on Rails

Documents: REST and stuff like that.pdf

Monday 7th May 2012
Lecture 7: Developing native web apps with HTML5
Guest Lecture: Antti Vuorela, Futurice
14:15-15:45

In this lecture we introduce the technologies for creating native applications by embedding an HTML5 web view. In particular we'll focus on PhoneGap.

Lab 7: PhoneGap
Guest Lecture: Antti Vuorela, Futurice
16:00-17:45

Hands-on exercises on PhoneGap