Introduction

Welcome

  • I'm Mikael Plate
    • Worked mostly with Microsoft technologies during my professional life, primarily Microsoft .NET
    • Expanded to open source technologies during the latest 3 years, doing stuff like Php, Ruby, Linux
    • Also special interest in mobile, from the mobile web to native Android and to a lesser extent iOS
    • Freelancing at the moment. Hired consultant for this course.
    • Tweets @mikeplate in English about technical stuff
    • Tweets @mikaelplate in Swedish about mostly personal stuff

Course data

  • Course code is TMOB18H122
  • Course is 7 weeks long
  • Lectures on Mondays 0800-1145
  • Labs on Mondays 1300-1645 for group A and on Tuesdays 0800-1145 for group B
  • I'm assisting in labs in week 2, 3, 4, 5 and 6 (NOT first and last week)

Course contents

  • Building mobile web sites and applications
    • This course will demonstrate building applications (and sites) for mobile devices using standard technologies on the open web such as html, css and javascript.
  • It will not include native development
    • Native development means that you are using the platform manufacturer's own software development kit and technologies to develop an application, like Objective-C on iOS and Java on Android. However, we will look at packaging a web application to "look" native using PhoneGap in this course.

Syllabus

  • 1. Detection
    • How to recognize a mobile user. Viewport for proper scaling on mobile devices.
  • 2. Design
    • CSS3 capabilities and some performance considerations for mobile. Nothing really mobile specific, applicable to desktop browsers too.
  • 3. Events
    • Reacting to events in the browser to perform actions, primarily the touch event for mobile devices.
  • 4. Data
    • Storing data in the browser. Communicating over the net. Nothing specific for mobile, equally applicable to desktop too.
  • 5. PhoneGap
    • Packaging the web page/site/app into an application that is compatible with Google Play Store (or iTunes App Store).
  • 6. Geolocation
    • Getting and handling information about the user's location. Supported by desktop browsers too, but perhaps of less use there.
  • 7. jQuery Mobile
    • Primarily a user interface library for mobile devices to get started fast on an application and not have to worry about different mobile devices.

Course structure

  • Lectures
    • Presentations published in Ping Pong in addition to the web site http://mobileapplab Live coding during lectures also uploaded as a zip file to Ping Pong.
  • Coding examples
    • Other coding examples besides those produced during live coding in the lectures, might also be available. Published at http://mobileapplab.se
  • Assignments
    • For each week/subject: one mandatory and two optional for extra credit in the Ping Pong exam. Published in Ping Pong.

Course examination

  • Written exam in Ping Pong with multiple choice questions
    • Probably about 20 questions with half of them as the passing grade limit
  • Assignments that must be completed to pass course
    • One assignment per week but last (6 in total). Due the end of the last week (2012-12-16 23:59).
  • Extra assignments that can be completed to receive additional points on the written exam
    • Two assignments per week but last (12 in total).
  • Project that must be completed to pass course
    • You can see it as a slightly largerand more cohesive/useful assignment of your choosing. There are no other requirements than it should be based on the contents of the course. The project can be performed in a group of 2 or 3 students. Projects will be presented by the participants at a later time (to be scheduled). Due at the day of presentation.

Prerequisites

  • This knowledge will help you a lot but even without it, any experience of IT and development should be enough to follow along and complete the course.
  • HTML
    • Know how html files are structured and the use of the most common html tags
  • CSS
    • Know what css is and how it works for styling html content
  • HTTP
    • Know difference between server-side and client-side scripts, form posting, query strings, cookies
  • JavaScript
    • Know the basics of the language such as functions and if-statements and how it is included in web pages. Actually any language in the same family of languages such as C, C++ and Java will get you familiar with javascript quickly.

Tools

  • Google Chrome
    • Desktop browser based on the same engine (WebKit) as both Android and iOS browsers and therefore your best choice to get the design right.
  • Opera Mobile Emulator
    • Fastest and most easy to use emulator that is available on all desktop platforms (Win, Mac, Linux). Primarily for testing viewport and touch, which is not supported by Google Chrome.
  • Android SDK and Emulator
    • More accurate emulator for being as close as a real device that is possible without actually testing on the device. Requires some setup and is unfortunately very slow to start (while running, ok).
  • Your own choice of text editor
  • Eclipse IDE (Integrated Development Environment)
    • Only used in the context of PhoneGap for building packaged applications for a specific platform (Android in our case)

Web Server

  • Not required
    • Although some assignments can be implemented with server scripts, it is not necessary. Access to a web server is not required to complete the course.
  • Examples
    • There might still be some examples of how to solve certain tasks using server scripts. In those cases, php is the primary technology but asp.net might also be shown.
  • At JTH, everybody has a personal web site
    • Unfortunately it hasn't worked that good in the past, but everyone with an account at JTH can put files in G:\public_html and have them visible on the web at http://jth.hj.se/~username where username is your own network login name at JTH.

Book recommendations

Links