HTML5 with Play Scala, CoffeeScript and Jade - Devoxx 2011

HTML5 w/ Play Scala, CoffeeScript and JadeMatt Raiblematt@raibledesigns.com@mraiblePhotos by Trish McGinity - http://mcginityphoto.com

How do you write HTML5?<!DOCTYPE html><article> <aside> <section><header> <footer> <nav><audio> <canvas> <video><datalist> <details><applet> <center> <font><frame> <frameset>http://www.w3schools.com/html5/html5_reference.asp © 2011 Raible Designs 22

CSS3‣ Animated Transitions transform: rotateY(180deg);‣ Rounded Corners border-radius: 8px 8px 0 0;‣ Drop Shadows box-shadow: 2px 2px 4px 4px;‣ Gradient Colors‣ Styling based on sibling count‣ More cursors for better usability‣ Custom Checkboxes and Radio Buttons http://lea.verou.me/css3-secrets © 2011 Raible Designs 23

Play Framework‣ A full-stack Java Web Framework made by Web Developers‣ Compile on-the-ﬂy‣ Stateless Architecture‣ Breaks web framework norms - Uses static methods - Doesn’t use Servlet API © 2011 Raible Designs 24

Matrix Results 18 17.5 17 17 17 15.5 15 15 13.5 14.5 14 14 13.513.5 11.5 9 4.5 0 ails g ils T din t ry 2 s y x F Lift e Pla ipe Fle JS rin GW est ck uts Ra a Gr Sp Str Va Wi Tap Str © 2011 Raible Designs 25

Mailing List Trafﬁc Wicket 1841 GWT 1753 Grails 1635 Rails 1604 Tapestry 1538 Play 1451 0 475 950 1425 1900 July 2011 * Spring MVC and Vaadin use Forums, which don’t provide this data. © 2011 Raible Designs 27

Learning Scala‣ Venkat’s Scala for the Intrigued - PragPub Magazine, starting in Sep 2011‣ Scala for the Impatient - Cay Horstmann‣ Programming in Scala, 2nd Edition - Martin Odersky, Lex Spoon, and Bill Venners‣ Twitter’s Scala School © 2011 Raible Designs 34

Cannot start in PROD mode with errorsTemplate compilation error (In /app/views/Application/index.jade around line 2)The template /app/views/Application/index.jade does not compile : #{user.name} is not closed.play.exceptions.TemplateCompilationException: #{user.name} is not closed. at play.templates.TemplateCompiler.generate(TemplateCompiler.java:102) at play.templates.TemplateCompiler.compile(TemplateCompiler.java:15) at play.templates.GroovyTemplateCompiler.compile(GroovyTemplateCompiler.java:4 1) © 2011 Raible Designs

H5BP and Play cd $boilerplate-download cp 404.html ~/dev/play-more/app/views/errors/404.html cp *.png ~/dev/play-more/public/. cp crossdomain.xml ~/dev/play-more/public/. cp -r css ~/dev/play-more/public/stylesheets/. cp favicon.ico ~/dev/play-more/public/. cp humans.txt ~/dev/play-more/public/. cp -r js/libs ~/dev/play-more/public/javascripts/. cp robots.txt ~/dev/play-more/public/. © 2011 Raible Designs 59

Testing‣ Tried Trip Meter on a bike ride‣ Said I’d traveled 5 km, when I knew I’d gone 10 - Was calculating start to end w/o waypoints‣ To Visualize: integrated odometer with maps using Google Maps Polylines © 2011 Raible Designs 71

Anorm and PostgreSQL‣ I’m a big fan of ORMs like Hibernate and JPA - Learn a new JDBC abstraction? Really!?‣ Anorm is and will be the default for Play Scala‣ Chose PostgreSQL since that’s what Heroku uses © 2011 Raible Designs 83

Anorm, Dates & PostgreSQL‣ Discovered “support of Date for insertion” was added to Anorm in August 2011‣ Cloned play-scala, built locally and uploaded‣ Modiﬁed dependencies.yml to use new version © 2011 Raible Designs 89

HTML5 vs. Native‣ If you need background services like geolocation or audio, native is necessary‣ Can still write your apps in HTML5 - Bridge the Gap with PhoneGap or Titanium‣ If mobile is important, consider fully native with WebViews for common features - a.k.a. Hybrid © 2011 Raible Designs 105

http://raibledesigns.com	19914
http://www.raibledesigns.com	1113
http://java.dzone.com	1110
http://www.oyous.com	285
http://freerss.net	110
http://a0.twimg.com	109
http://www.scoop.it	86
http://therichwebexperience.com	62
http://wiki.ch.glencore.com	61
http://www.nofluffjuststuff.com	49
http://clide2.rssing.com	37
http://paper.li	27
http://uberconf.com	23
http://webcache.googleusercontent.com	16
http://nuevospowerpoints.blogspot.com	16
http://www.springone2gx.com	15
https://twitter.com	7
http://translate.googleusercontent.com	7
http://www.rss4java.com	6
http://blog.fasoulas.com	6
http://biliousness2.rssing.com	6
http://www.hanrss.com	5
http://localhost	5
http://www.javaoracleblog.com	5
http://projectautomationexperience.com	4
http://blekko-webcache.com	4
http://rritw.com	4
http://renren.it	4
http://mundo-powerpoints.blogspot.com	4
http://apps.synaptive.net	3
http://127.0.0.1	3
https://si0.twimg.com	3
http://endurant2.rssing.com	3
http://twitter.com	2
http://css.dzone.com	2
http://tweetedtimes.com	2
http://us-w1.rockmelt.com	2
http://www.renren.it	2
http://continuousdeliveryexperience.com	2
http://lottebuyitnow.appspot.com	2
http://www.mefeedia.com	2
http://www.syndic8.com	1
http://www.rritw.com	1
http://www.nfjsone.com	1
https://www.ibm.com	1
http://feedplanets.com	1
http://search.daum.net	1
http://www.bne.es	1
http://j.gen.renren.it	1
http://www.feedgy.com	1
http://admin.totalmarketing.com	1

HTML5 with Play Scala, CoffeeScript and Jade - Devoxx 2011

by Matt Raible

Accessibility

Categories

Upload Details

Usage Rights

58 Embeds 23,145

Statistics

HTML5 with Play Scala, CoffeeScript and Jade - Devoxx 2011 Presentation Transcript