HTML5 Cross Platform Mobile Applications
This course focuses on the relevant web technologies for developing the client side of web applications and hybrid ones. Whether your target is developing a cross platform mobile application or a one page web application this course is for you. The course focuses on the use of JavaScript, its libraries and HTML5. The course includes 140 academic hours organized in ten parts. The training material (slides, video clips, assignments, solutions and code samples) for the entire course is organized in small online courses on the e-learning platform we use during the course.
Fundamental Topics in Software Development (1th Part)
This part covers the very basic topics in software development which are necessary in order to learn all other topics the course includes. This part focuses on very basic topics in procedural programming, basics of html and css. (10 academic hours)
User Interface Design in CSS (2th Part)
This part focuses on CSS3 in order to get the required understanding for the development of user interface using web technologies such as JavaScript, HTML5 and CSS. This part is essential for understanding the final outcome of every web application. (10 academic hours)
Software Development in JavaScript (3th Part)
This part covers the JavaScript programming language and is essential for the rest of the course. You cannot learn HTML5 nor any of the famous popular libraries as jQueryMobile, PhoneGap or AngularJS without knowing JavaScript. (40 academic hours)
Client Side JavaScript Frameworks (4th Part)
This part covers some of the most popular client side JavaScript frameworks such as jQuery, jQueryMobile, MooTools, AngularJS and many others. Some of these frameworks allow us to develop rich graphics user interface both for desktop applications and mobile ones. Others allow us to develop a structured client side which is relevant whether you develop a web application or an hybrid one for mobile telephones and tablets or the desktop. The more important frameworks get more hours. (30 academic hours)
The HTML5 Ecosystem (5th Part)
The HTML5 ecosystem is everything the HTML5 specification covers and beyond. We will start with covering the official parts of HTML5 and continue with some of the more interesting HTML5 capabilities that still weren’t added to the specification. (15 academic hours).
Social Web Applications (6th Part)
Whether you develop a web application or an hybrid one you might want to interact with social networks as Facebook and others. This part of the courses focuses on using the Facebook JavaScript SDK. (5 academic hours)
Databases in JavaScript (7th Part)
Some of the most popular no-sql databases allow us to write in JavaScript the code that interacts with them. This part of the course focuses on using the MongoDB no-sql database and in addition covers some of the most popular databases that were written in JavaScript. (5 academic hours).
Server Side JavaScript Frameworks (8th Part)
Using node.js as well as many other JavaScript frameworks we can develop the server side in JavaScript. This part focuses on that option and in addition it overviews the cloud based possibilities. (5 academic hours)
Android Hybrid Applications (9th Part)
Taking a web application optimized for mobile telephone and wraps it as an hybrid application for android or any other mobile telephones platform is fairly simple. We will do it for android. Doing the same for iPhone or any other mobile platform is pretty much the same idea. (5 academic hours)
Web Browsers Extensions (10th Part)
This part focuses on learning how to develop extensions for web browsers. In addition, we will learn how to develop applications for ChromeOS, the new coming operating system, and learn how to place them for sale through the Chrome web store. (5 academic hours).
Responsive Web Applications (11th Part)
Developing one website that fits all platform including mobile telephones, tablets, tv and desktops is the next challenge. This part of the course covers the available possibilities. (5 academic hours)
Analysis & Design using UML (12th Part)
This part summarizes the course and provides the students with analysis and design capabilities using UML. Based on the technological skills acquired during the course we learn how to analyze and design web and mobile hybrid applications and how to use UML, SOAML and SysML doing that process. (5 academic hours)
Date | Topic | Online Course | Comments | |
1 | 31/12/2013 | Fundamental Topics | Introduction to The Internet
XHTML Fundamentals | 1. You can find the JavaScript slides at http://www.abelski.com/moodle/course/view.php?id=13. |
2 | 7/1/2014 | Fundamental Topics | Introduction to Procedural Programming XHTML Fundamentals | 1. you can find the javascript slides about functions at http://www.abelski.com/courses/javascript/function.pdf. 2. you can find the javascript slides about arrays at http://www.abelski.com/courses/javascript/array.pdf. 3. towards meeting 6 please watch matrix (the first movie… and the best of all) 4. u can find the javascript slides about oop at http://www.abelski.com/courses/javascript/oop.pdf. 5. towards next meeting please compelte assignmetns level 1 and 2 in topics arrays and functions (at http://www.abelski.com/moodle/course/view.php?id=73) and please submit at haim.michael.homework@gmail.com 4. please go over the css slides for next meeting. |
CSS3 | CSS Basics Text Font Border Outline Padding List Table Dimension | 1. towards next meeting please complete all assignments in all topics. 3. towards next meeting please try to go over the git slides. | ||
4 | 21/1/2014 | CSS3 | CSS Basics Animations Introduction Basics | 1. go over the video clips in the git basics topic and do the same on your computer. 2. go over the video clips in the google webfonts topic and do the same on your computer. 3. towards next meeting please install xampp (or mamp). u can find video clip that explains how to install at http://www.phpbook.co.il. in addition, please install phpstorm. make sure htdocs is the workspace. 4. please complete all assignments in css. 5. towards next meeting please go over javascript slides and watch the video clips (the ones we are going to cover next meeting). |
- | 28/1/2014 | - | - | - |
5 | JavaScript | JavaScript Programming | 1. towards next meeting please complete all assignments in topics covered in class. 2. towards next meeting please go over the slides and the video clips of the object oriented programming topic. | |
6 | 11/2/2014 | JavaScript | JavaScript Programming Array Date | 1. please complete all assignments in topics covered in class (except the ‘employee extends person’ assignment in object oriented programming). |
7 | 18/2/2014 | JavaScript | Functions | 1. get ready for next meeting going over the topics: oop prototype, anonymous functions and document object model. 2. please complete all assignments in topic functions. 3. please catch up with the recursive functions topic by watching the relevant video clips at: |
8 | 25/2/2014 | JavaScript | JavaScript Programming String Math Location Navigator Screen History | 1. lotto numbers tiny project phase #1. 2. converter tiny project phase #1. 4. please get ready for next meeting going over the prototype topic (in oop). |
9 | 4/3/2014 | JavaScript | JavaScript Programming | 1. towards next meeting please watch my ajax lecture (in hebrew) at https://www.youtube.com/watch?feature=player_embedded&v=8OIncYs8ANs. 3. make sure you have xampp installed on your pc. http://www.phpbook.co.il/wordpress/?p=107 |
10 | 11/3/2014 | JavaScript JavaScript | Ajax Fundamentals DOM Fundamentals Parsing | 1. please complete opening hours tiny project phase #1. |
11 | 18/3/2014 | JavaScript | DOM Fundamentals
| 1. personal expenses tracker application, phase #1, phase #2 |
12 | 25/3/2014 | JavaScript | JavaScript Programming Google JavaScript Style Guide | 1. for next meeting please bring a laptop or arrange a remote control for your desk top. in addition , pls bring headphones. |
1/4/2014 | Client Side JavaScript Frameworks | The jQuery + jQuery UI Libraries | 1. you should complete all the assignments in jquery course (all topics… including the ones we didn’t cover in class). | |
14 | 8/4/2014 | Client Side JavaScript Frameworks | jQuery Mobile Basics | 1. lotto numbers tiny project phase #2. 2. converter tiny project phase #2. 5. complete coupons project phases #1 #2 |
15 | 29/4/2014 | Client Side JavaScript Frameworks | AngularJS Basics Distributed Work GitLogs | 1. You should complete the assignments in jQueryMobile course. 2. please complete todo list tiny project phase #1 #2 3. please complete the assignments in the following courses: 4. please go over the video clips in ‘distributed work’ topic in ‘introduction to git’ course and do the same technical steps the video shows on your pc. please don’t waste time on going over the gihub jump start. |
16 | 13/5/2014 | Client Side JavaScript Frameworks | MooTools Basics The Cookie Object Overlays | 1. humus tiny project phases #1 #2 |
17 | 20/5/2014 | Client Side JavaScript Frameworks | Twitter Bootstrap Howler.js Basics JSZip Basics | 1. please complete phase #3 in the coupons platform ongoing project. 2. please complete phase #4 in the coupons platform ongoing project. 4. please complete all assignments in all topics covered in class. |
18 | 27/5/2014 | Client Side JavaScript Frameworks | QUnit Testing Framework Smoke.js Basics Two.js Basics Video.js Basics Yepnope.js Basics Moris.js Basics UAParser.js Basics | 0. please complete the assignments in the topics covered in class. 2. Complete phase #5 in your solution for the coupons ongoing project. 3. Complete phase 6 in your solution for the coupons platform ongoing project. 4. Complete phase 7 in your solution for the coupons platform ongoing project. 5. Complete phase 8 in your solution for the coupons platform ongoing project. |
10/6/2014 | HTML5 | Introduction Video Capturing
| 1. lotto numbers tiny project phase #4. 3. please compelte phase #3 in todo list tiny project 5. complete coupons platform phase #9. 6. please complete the assignments in all topics covered in class. | |
20 | 17.6.2014 | HTML5 | Introduction to HTML5 Canvas 2D Graphics | 1. towards next meeting i recommend on watching the 30min video about web sockets at https://www.youtube.com/watch?v=UlGOnYdGqtY. 3. pls rewrite the code that works with the db in the todolist tiny project to use the indexdb (instead of websql). |
21 | HTML5 | Introduction to HTML5 | - | |
1/7/2014 | Social Web Applications | Facebook JavaScript SDK | 1. towards next meeting please watch (recommended.. not critic!) the video of my jump start lecture for mongodb at https://www.youtube.com/watch?v=22qwKc3PVzg. | |
8/7/2014 | Data Bases in JavaScript | Mongo DB Basics TeffyDB Basics | 1. complete coupons platform project phase #10. | |
15/7/2014 | Server Side in JavaScript | Node.js Basics | 1. Complete phase 11 in the coupons project.
| |
25 | 22/7/2014 | Hybrid Applications | Android Fundamentals Twitter Bootstrap | 1. lotto numbers tiny project phase #5. 2. converter tiny project phase #3. 3. opening hours project phase #3. 5. please compelte phase #4 in todolist tiny project 7. please complete phase 12 in the coupons platform project. 8. towards next meeting please follow the video clip at https://www.youtube.com/watch?feature=player_embedded&v=W1EDIVd6gR0 and create a basic simple website based on h5bp template together with twitter bootstrap. |
26 | 29/7/2014 | Web Browsers Extensions | Chrome OS Extensions Jump Start Dojo Toolkit | 1. lotto numbers tiny project phase #6. 2. converter tiny project phase #6. 4. expenses tracking tiny project phase #6. 5. please complete phase #5 in todo list tiny project 7. please complete phase #13 in the coupons ongoing project. |
27 | 19/8/2014 | Responsive Web Applications | Responsive Web Design Introduction | |
28 | 26/8/2014 | UML Analysis & Design | UML Fundamentals Distributed Work GitLogs | 1. please complete phase 14 in the coupons platform project. |
Changes Logs:
August 15th:
The topic ‘MV* Design Patterns’ was added to the JavaScript topic in meeting 11.
September 1th:
The following JavaScript libraries were added to the ‘Client Side JavaScript Libraries’ topic in meeting 18:
Microtext.js
UAParser.js
Paper.js
Math.js
String.js
OpenLayers.js
LESS.js
Google Charts
Google FontLoader
Turn.js
September 16th:
Video Capturing was added to the HTML5 topic.
Lambda Expressions was added to the JavaScript Programming topic.
October 16th:
Code Linting and Iterators were added to the JavaScript Programming topic.
Grunt Basics was added to the the Server Side in JavaScript topic.
MySQL and Basics were added to the node.js sub-topic in Server Side in JavaScript topic.
December 17th:
The topics covered in AngularJS were changed. More topics were added. The animation topic was removed (it isn’t why we want to use angularjs).