traditional media Designer who hacks or the other way around Catch me a Copenhagen pechakucha, demodag, community days, twestival ,twedagsbar, openlectures (CIID) or any of the other shingdings in copenhagen. www.threads.dk www.bythreads.com www.carecord.com www.linkedin.com/khougesen Google me if you want more. mandag den 30. april 12
fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.” Basically what jQuery does is make it easier for you to write cross-browser code - and it takes alot of the pain out of basic DOM manipulation. mandag den 30. april 12
Events & Triggers A short discussion about how we use it in the industry - and why Javascript is probably the best language to learn and be good at if you want to work in the industry. mandag den 30. april 12
// by Id $(“ul”) // by tag name $(“ul li”) // element descendent $(“ul”).find(“li”) // more element descendent $(“li”, list) // also element descendent $(“ul > li”) // element child (direct descendent) $(“input:checkbox”) // filter $(“a[href=#Overview]”) // attributes $(“a[href$=.aspx]”) // attributes Ends With Lets try this out mandag den 30. april 12
alert(“IRAN”); }) Jquery Events tradiBonally you would aNach javascript events like this <a href=“#” class=“super” onclick=“return launch(event);”>click me</a> or similar... Lets try this out mandag den 30. april 12
trigger(): trigger is a funcBon in Jquery that can trigger events-‐ tradiBonal ones like click,hover,mousedown,keypress etc. or your own: $(document).trigger(“i.just.received.data.from.google”); which you can bind to like before: $(document).on(“i.just.received.data.from.google”,funcBon(event){ parseMyFileFromGoogle(event); }); mandag den 30. april 12
an extensive following and is easy to use and extend. There are other abstracBon libraries of the same type out there, but generally when you work professionally -‐ you go with the proven and reliable framework. The trend is 100% moving towards Slim backends and heavy Frontends / Clientsides jQuery is a valuable tool here, because (as you saw before) you can manipulate and change Clientside data / ui with very liNle backend integraBon. mandag den 30. april 12
of data in JSON (a very slim form of XML) looks like this: myData:{ peter:”is a fun person”, james:”is not” } To a smart clientside that handles all or most rendering of the pages thereaber = no refresh, no pageloading and waiBng -‐feels much more like an applicaBon. (www.grooveshark.com is a good example of this) mandag den 30. april 12
know it many languages sorta look the same too you. but more importantly in the old days: Browser (UI and links between pages) ------------------ HTTP ------------------- Application server (business logic etc) ------------- custom binary --------------- Persistence/db: MySQL, PostgreSQL, Oracle Now: Clientside : jQuery (with whatever plugins you need / want) Backend : Nodejs.org (complete ultrafast, event based webserver) DB : mongoDB(JSON),couchDB (JSON) etc. etc. mandag den 30. april 12