Renaissance of Programming Languages

Really good talk by Venkat Subramaniam on Progamming language Renaissance.

Some of the key points

* We are in the middle of programming language renaissance
* Nice analogy between history and Progamming Languages

Day 1 Last session : Javascript powerful language out there

Last session of the day by Venkat on the power of Javascript

Javascript

Feels like Java & C
Similar to perl in some ways
Untyped Language

Rules

1) Case sensitive
2) goo idea to use ;
3) commenting style is same as Java/C++
4) null and undefined are used to indicated null
5) Strings are single or doule quotes and are immutable

Functional in nature : Functions are first class citizens

Pass and return functions. Everything should be object oriented is a wrong notion.

Variables are typeless. but you need to declare variables with var

Global and local scoping for variables. No block level.

Control structures are like C : statements, expressions, for loops

var sayHello = function(name) {
print('hi');
}

sayHello is now a handle to a function.Its powerful since, you can now register them as event handlers.

IN Javascript everything is an expression. there is no statement as such.

Functions are Objects


function Car(year) {
this.year=year;
}

var myCar = new Car(2011);

print (myCar.year);

myCar is an instance of Car.

Encapsulation is not really about security. Its for code maintainence.

prototype is like a backpack. Any method not defined on object is routed to prototype.

Car.prototype.drive = function(dist) {
print('driving..);
this.miles += dist;
}
Car.prototype.tune = function() {print ('tune')};

print (myCar["year"]); --> you can use this instead of dot notation. You can dynamically recieve the parameter since its in a double quote.

Object is nothing but a collection (property holder).
It can be a function, object or a collection of properties

for (var prop in myCar.__proto__) {
print(prop + '\n');
}


Inheritance in Javascript

Composition is better than Inheritance. Ruby and Groovy have delegation (@delegate).

Javascript supports inheritance through method composition.

function Base() {
}

function Dervied() {
}

Derived.prototype = new Base();

Code Quality

jslint is a nice tool to check code quality.

You need to separate the logic from HTML page.

Overall it was an amazing session with good insights on JS

GIDS Session 6- Microformats and semantic web

Scott Davis on Microformats for the web.

He explains the significance of metadata.

meta name="description" content=""

meta name="keywords" content=""

SEO : Search Engine optimization

RDFa : Microformats http://rdfa.info

Sites like flickr , facebook are using RDFa

www.alistapart.com

www.yelp.com

Article on How Best Buy is using the Semantic Web.

Tools on Semantic Web
GoodRelations Annotator tool
Semantics Radar
Operator

Microformats

e.g. hcalendar,hcard

Mircoformats made Simple.

http://ablognotlimited.com

Social Graph API : Google code

Microformats are not meant to replace webservices. They are meant to augument them.

Session 5 : JQuery at work

Tom Marrs is giving a session on JQuery at work.

How to get started with JQuery :

JQuery/Javascript Basics --> AJAX --> JQUERY UI --> Jquery Plugins

3 layers of web --> Behaviour (Javascript), Presentation (CSS), Content (HTML)

http://www.sitepoint.com/ : WebDesign for developers.

Some Caveats :
1) Javascript should be unobtrusive
2) Prefer External Styles
3) Just enough CSS --> Tag , Class & ID selectors, Descendent/combination selectors

Demos on javascript with Java and Javascript.

How to iterate, How to navigate the dom, utility methods.

Ajax : $.ajax

JSON : Lightweight $.getJSON

JQuery Widgets : DatePicker, Accordion, Tabs, Dialog Box, Auto complete,Tool tip, JGrowl

GIDS Award ceremony

Best .NET productivity tool : Code rush

Best Collobaration tool : Adobe acrobat connecct

Best Content Management and Document Managment tool :Microsoft sharepoint 2010

Best Modeling tool : IBM Rational rose

Change and Configuration Management : Telerik

Testing category : Junit testing framework.

Security Category : Microsoft security essentials.

Web Development : Adobe Flash Platform

Mobile development : Nokia symbian platform

Frameworks : .NET framework

Databases : Dev Express Analytics

Session 4 : HOw to create a beautiful web

Harish Vaidyanathan from MIcrosoft is giving a quick session on HTML 5, IE 9.

Demo on Native HTML 5

Installing websites as applications. If you have IE 9 installed, you can PIN applications.

Graphical capabilities in IE 9

Browser scales across multiple cores.

All of graphics is offloaded to GPU. Leverage native capabilities in IE. the aquarium demo rocked in IE9 whereas it sucked in chrome.

There is also another fishbowl demo where IE9 wins hands down against Chrome.

IE 9 Patterns

html5labs.com

Microsoft is also annoucing an early look at Internet Explorer 10 (IE 10). It moves the web forward by being 100% compatible with Html 5. and supports css gradients, multi column Layout , ECMA script 5 .

ie6countdown.com : Microsoft website to initiate people to move away from IE 6. If people come to your website from IE6, send a message to them buy copying the piece of code.

Good to know that Microsoft too is joining the HTML5 bandawagon.

HTML 5 Deep dive

Venkat subramaniam is giving a deep dive into HTML 5 features.

Presenatation is a todo list in textmate instead of a presentation, which is quite cool.



New HTML 5 tags like section,article,aside,header,footer

CSS 3 Pseudo- classes
nth-of-type(even) and nth-of-type(odd) are new things for changing background for alternate colours.

last-child is special for last row. can be applied for tr and td.

No more classes through each element

Targeted input types
email : input type=email
placeholders :get a clue for placeholders in grayed out manner
placeholder="email@example.com"
autofocus : set focus on field
turning off autocomplete
required
pattern
url
search
number
range min 1 max 10 value
date , datetime,color

Inplace editing : contenteditable

border-radius:10px; ( oval box)

moz-tranform,webkit-transform,transform --> for rotating sections : rotate(degree)

transparencey

box-shadow

dragdrop

Audio and video

Client side data
localStorage is par of window object. its part of a hashMap.
Benefits
local storage,session
offline web apps

GIDS Session 3 - HTML 5

Scott Davis : I really loved his sessions last year. He is a real expert on Grails. He has a website on thirstyhead.com.

Starts of with a quip on his new shirt.



HTML 5 enhancements

1) Form enhancements, mobile support

Biggest new feature. --> Semantics over markup. Currently pages are cluttered with Divs currently. You can provide separate tags for various page sections like nav, header , footer and sections.

Screen readers can parse the code and act accordingly.

Desktop Browser support for HTML 5
Google already uses HTML 5 and provides outstanding support in their chrome browser.
Apple Safari already supports HTML 5
Mozilla Firefox and Opera supports HTML 5 as well.

IE 9 supports HTML 5 specification even though its not available on windows xp.

Good that everyone is now meeting the specifications.

Support for Mobile in HTML 5

All applications are HTML 5 with a thin app wrapper like NYTImes. Javascript is the write once run anyware platform finally :).

RIM Playbook has outstanding HTML 5 support.

Cost to implement technology is very high initially, and the value is very low. Dont wait for final standard. You need to wait for Oreilly book on that technology then its here to be used :)


HTML 5 is here to stay and start now instead of waiting .

http://diveintohtml5.org by Mark Pilgrim . Entirely free online book.


New Elements

Doctype is amazingly simple :

New semantic elements: header, nav, footer,section, article, aside.

HTML 5 Reset Stylesheet : Include all these to use display:block;

http://html5shiv.google.com/svn/trunk/html5.js




Form Enhancements

INput elements support following new values : tel,search, url, email, dateime, date, month, week, time, email .


Any browser that doesnt support the new values, will present a text instead. this is true only for desktop browsers. But mobile browses have issues.

Modernizr
Checks for html features support. New idea is to program to the most mordern browser and pollyfill for the others using Modernizr.

Mobile support : Smart phones and Tablets are selling really fast.

www.html5rocks.com

App Cache : explicitly cache js, css, images.

Cache Manifest can explicity cache resources.

Cache,Network and fallback sections.

typical application could be an twitter client in html5 that can switch between online and offline mode. Full control of the cache through javascript.

Data Storage : Allows you to storage as a hashmap.Upto 5 MB of local storage is available per domain per url.

Web SQL database : supported by all browsers except firefox and IE.


Video support


Youtube html5 video player. Use video with object tags combination.

Some more websites to checkout :
http://html5doctor.com
http://html5demos.com/

ON the whole it was an awesome session , that really opened up the world of HTML 5.

HTML 5 Cross browser Polyfills is the way to go

GIDS 2011 - .Web day Session 1

Arijit Chatterjee from Adobe is giving an excellent session on Building Next Generation of Experiences.

His presentation is full of interesting images. I like the fact that there is less content in the presentation and more of verbal communication.

The main message behind the presentation is to how to make the user experience better - Understand your users, how to make beautiful websites, understanding local sentiments and speaking in local language.

Some key things to keep in mind

1) Build trust
2) Maintain Focus on workflows --> move from one task to another
Create in context help - if necesary
3) Involve all Senses - the more sensory organs are involved, the more you will be able to retain users.
for web app Visual,Touch,Sound are the key .

4) do not build something Jazzy - it might drive people away from your site

5) Acknowledge Status clearly once you are done with something irrespective of Victory or Failure.

6) 3 D display wherever relavant

7) Use sound - Judiciously

8) use of high definition haptics


Wrapping up with a few stunning images . Aquarium Sink, Bubble Cosmos , Interactive multi modal workspace.