2. What are we going to cover
HTML Markup
Cascading Style Sheets
JavaScript
Real Time Web
3. Who am I
Maurice de Beijer.
The Problem Solver.
Microsoft CSD MVP.
DevelopMentor instructor.
Twitter: @mauricedb of @HTML5SupportNL
Blog: http://msmvps.com/blogs/theproblemsolver/
Web: http://www.HTML5Support.nl
E-mail: mauricedb@computer.org
4. HTML5 Semantic markup
New HTML5 elements
<nav>
<section>
<header>
<footer>
<article>
<aside>
5. Cascading Style Sheets
Lots of new useful CSS3 features
Previously they would require script or extra markup
Using native CSS3 is much faster
7. CSS 3
Media queries
@media screen and (max-width: 1024px) {
aside {
display: none;
}
}
Multi column text
article {column-count: 3; }
8. LESS/SASS = CSS done right
CSS is nice but not perfect
Static
Lots of repetition
LESS and SASS try to solve these problems
Define variables
Use mixins
Nest rules
Etc.
9. JavaScript libraries
jQuery is the king!
But these are many other useful ones
Underscore.js
Functional programming support
Backbone.js
Model - View - Controller
Knockout.js
Model - View - ViewModel
10. Unit testing JavaScript
We need to test our code
Even more important in a dynamic language
Unit testing is a first must
Many test libraries
QUnit is used to test jQuery
12. Compiling to JavaScript
The list of languages that compile to JavaScript is
long
https://github.com/jashkenas/coffee-script/wiki/List-
of-languages-that-compile-to-JS
Some popular static ones:
Google Web Toolkit
Written in Java
Script#
Written in C#
CoffeeScript
TypeScript
13. The real time web
HTML5 introduces WebSockets
Socket communication between browser and server
Fully duplex
But very low level
Several libraries build on top of this
Socket.IO
SignalR
14. Conclusion
The world of the web developer is changing
CSS3 additions mean we write less UI JavaScript
There are many powerful frameworks
Languages like TypeScript make it easier to write large
applications
The real time web will make this even more responsive
Embrace change!