17.09.12                                                                         Workshop-Intro    Programmiersprache: Cof...
17.09.12                                                                         Workshop-Intro    Warum kein JavaScript? ...
17.09.12                                                                         Workshop-Intro    JS == WTF    / a om irr...
17.09.12                                                                         Workshop-Intro    Kein Problem in CoffeeS...
17.09.12                                                                         Workshop-Intro    CoffeeScript­Features  ...
17.09.12                                                                         Workshop-Intro    CoffeeScript­Features  ...
17.09.12                                                                         Workshop-Intro    CoffeeScript­Features  ...
17.09.12                                                                         Workshop-Intro    CoffeeScript­Features  ...
17.09.12                                                                         Workshop-Intro    CoffeeScript­Features  ...
17.09.12                                                                         Workshop-Intro    CoffeeScript­Nachteile ...
17.09.12                                                                         Workshop-Intro    Architektur: Backbone.j...
17.09.12                                                                         Workshop-Intro    Backbone­Klassen in Akt...
17.09.12                                                                         Workshop-Intro    Backbone­Klassen nutzen...
17.09.12                                                                         Workshop-Intro    Backbone und REST    #C...
17.09.12                                                                         Workshop-Intro    Daten speichern    <omm...
17.09.12                                                                         Workshop-Intro    Daten speichern    #Fru...
17.09.12                                                                         Workshop-Intro                           ...
17.09.12                                                                         Workshop-Intro    Gute Sachen            ...
17.09.12                                                                         Workshop-Intro    Offene Fragen          ...
Upcoming SlideShare
Loading in …5
×

Coffee Backone Introduction

411 views
373 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
411
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Coffee Backone Introduction

  1. 1. 17.09.12 Workshop-Intro Programmiersprache: CoffeeScript [24] Kleine Programmiersprache, die zu JavaScript kompiliert wird Einflüsse: Ruby, Python Features: Bereinigte Syntax, Klassensystem, viele kleine Sprachfeatures Vorteil: Lässt viele Probleme von JS verschwinden, mittlerweile recht populär [25] Nachteil: Geschmacksfrage, Code schwerer zu debuggen [24] http://coffeescript.org/ [25] https://github.com/languageslocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 29/94
  2. 2. 17.09.12 Workshop-Intro Warum kein JavaScript? / a om irru? /Wskmthe as 4.otig) 2tSrn(; / reoe as? /Tu drfle nwBoenfle =tu; e ola(as)= re / reoe as? /Tu drfle { =1 }= ; / a asethe? /Wspsir ir i(re{ ftu)   fnto o({   ucinfo)     rtr wf;     eun"t"   }    } fo) o(;localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 30/94
  3. 3. 17.09.12 Workshop-Intro JS == WTF / a om irru? /Wskmthe as 4.otig) /SnaErr nxetdtknILGL 2tSrn(;/ ytxro:Uepce oe LEA / reoe as? /Tu drfle nwBoenfle =tu;/ re e ola(as)= re /tu / reoe as? /Tu drfle { =1 /Wdrnc!SnaErr nxetdtkn= }= ;/ ee oh ytxro:Uepce oe = / a asethe? /Wspsir ir i(re{ ftu)   fnto o({   ucinfo)     rtr wf;     eun"t"   }    } fo) /Ahni o e SEgn vroe nE5 o(;/ bäggvndrJ­nie(ebtni S)localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 31/94
  4. 4. 17.09.12 Workshop-Intro Kein Problem in CoffeeScript #Wskmthe as  a om irru? 4.otig)#Srn 4" 2tSrn(  tig"2 #Tu drfle  reoe as? { =1#fle }=   as #Tu drfle  reoe as? nwBoenfle= re#fle­Vrlihmt== e ola as =tu  as  egec i = #Wspsir ir  a asethe? i re ftu  fo=­  o  >   rtr wf   eun"t" fo)  tig"t" o( #Srn wflocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 32/94
  5. 5. 17.09.12 Workshop-Intro CoffeeScript­Features #Atmtsh a­elrto  uoaicevrDkaain #Sasm ukin­ytx  praeFntosSna #Srkuirn uc htsae  tutreugdrhWiepc #Vraeet ü aaee  ogbwrefrPrmtr #Atmtshsrtr  uoaice eun sur  x=4)­ qae=(  2 >  x*x     #RneKamr pinl  ud lmenotoa egbi  qae13 rens=sur 37localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 33/94
  6. 6. 17.09.12 Workshop-Intro CoffeeScript­Features #Kmaa(n eioos o elnmrce pinl  omt udSmkln)vrZieubühnotoa bos=[ ok    {nm:ue,rtn:5}   ae Dn aig    {nm:e as,rtn:4}   ae RdMr aig    {nm:lee abn,rtn:3}   ae AtrdCro aig   ] #Enah opeesos  ifceCmrhnin go  bnm o  nboswe .aig>3 od=(.aefrbi ok hnbrtn  )localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 34/94
  7. 7. 17.09.12 Workshop-Intro CoffeeScript­Features #`nes l eesükz i`(uh utl ü wie)  uls`asGgntc u`f ac:`ni`fr`hl` #Ki lme­nak erbiClbcs  enKamrIfrtmh e alak #Eitn­prtr``ac nPoet­okp  xsezOeao ? uhi rpryLous #PsfxI ud`nes)  oti­f(n uls` uls fln nesofie  $.e foaa.x rsl)­  ?gto/jxtt,(eut >   aetrsl frsl?   lr euti eutlocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 35/94
  8. 8. 17.09.12 Workshop-Intro CoffeeScript­Features zh  ubrwno.rmti ieZh i al=Nme idwpop Gben alen #AlsitenAsrc sls r/ac)  le s i uduk(ebttycth #Fltruhbi`wth idvridr  alhog e sic`wr ehnet sau  wthzh tts=sic al  we 3te enNr  hn2 hni ed  we 2te enGe  hn4 hni ek  es  le   #Vrett egece    ekteeVrlih   i 00>zh  90   f90  al>­00    agelg    lnwii   es   le    rßnaning    göewhsni #Srn­neplto  tigItroain wno.lr D it#sau} idwaet"ubs {tts"localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 36/94
  9. 9. 17.09.12 Workshop-Intro CoffeeScript­Features casTe               lse ls ir             #Kasn  eege   nri:0  cntutr @ae=en >  aaee­eals  osrco:(nm  Brd)­ #PrmtrDfut  fis >@nri+         @  ti`  rs:­ eege+       #``=`hs  sib >@nri  1  tr:­ eege=­ casShag xed ir ls clneetnsTe  fis ofr >  rs:(pe)­   ofrsib)   pe.tr(   spr)             ifce spr)   ue(            #enahs`ue(` brd=nwTe( en  e ir) ags  e clneuut) uut=nwShag(Ags ags.rs en uutfisbrd wno.lr uuteege idwaetags.nrilocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 37/94
  10. 10. 17.09.12 Workshop-Intro CoffeeScript­Nachteile Große Ausdrucksfreiheit (mehr Nachdenken erforderlich) Whitespace kann nerven (v.a. bei Wrapperfunktionen) Debuggt werden muss das kompilierte JavaScriptlocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 38/94
  11. 11. 17.09.12 Workshop-Intro Architektur: Backbone.js [35] Clientseitige „MVC“­Komponenten Setzt auf jQuery [36] und Underscore.js [37] auf Backbone liefert: Basisklassen (Models, Collections, Router, Views) und Konventionen Backbone liefert nicht: Struktur/Framework (Erweiterungen in diese Richtung: Aura [38] , LayoutManager [39] , Marionette [40] , Chaplin [41] uvm.) [35] http://backbonejs.org/ [36] http://jquery.com/ [37] http://underscorejs.org/ [38] https://github.com/addyosmani/backbone­aura [39] https://github.com/tbranyen/backbone.layoutmanager [40] https://github.com/derickbailey/backbone.marionette [41] https://github.com/chaplinjs/chaplinlocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 61/94
  12. 12. 17.09.12 Workshop-Intro Backbone­Klassen in Aktion #etn( rtltenapsbrsAzebl e  xed)esel i nasae bihiddr #BsslseBcbn.oe  aikas akoeMdl Ie  akoeMdletn( tm=Bcbn.oe.xed) #CletossmenMdl  olcin aml oes IeCleto  akoeCleto.xed{ tmolcin=Bcbn.olcinetn   mdl tm  oe:Ie } Ies=nwIeCleto( tm  e tmolcin) #Vessn erKneto l oe  iw idmh ovninasCd IeVe  akoeVe.xed{ tmiw=Bcbn.iwetn   rne:­  edr >   @e.tl@oe.e(tx   $lhm mdlgtet)   $oy)apn $l   (bd.ped@e   rtr hs   eunti }localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 62/94
  13. 13. 17.09.12 Workshop-Intro Backbone­Klassen nutzen #Afnu itäei e olcinrairn  u eeEnrg ndrCleto egee Ieso ad,(eMdl > tm.nd nwoe)­  nwIeVe(  e tmiw{   mdl eMdl   oe:nwoe  }.edr)  )rne( #Nu oesalgn.  eeMdl nee.. ie1=nwIe(.e(tx Hlo tm  e tm)stet,al!) ie2=nwIe(.e(tx Wl!) tm  e tm)stet,et #..udi i olcinsekn  . n ndeCleto tce Iesad[tm,ie2 tm.d ie1 tm]localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 63/94
  14. 14. 17.09.12 Workshop-Intro Backbone und REST #CletossmenMdl  olcin aml oes IeCleto  akoeCleto.xed{ tmolcin=Bcbn.olcinetn   mdl tm  oe:Ie  ul /p/tm/ #W ig i P?  r:aiies  oletdeAI } Ies=nwIeCleto( tm  e tmolcin) #`ec(`hl ae o e aeqel  fth) otDtnvndrDtnule #DsCni­betetpih e o jur.e(`  a ofgOjk nsrctdmvn`Qeygt) Iesfth{ tm.ec   sces cleto)­  ucs:(olcin >   cleto.ah(tm >   olcinec ie)­    nwIeVe(    e tmiw{     mdl tm     oe:ie    }.edr)    )rne( }localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 64/94
  15. 15. 17.09.12 Workshop-Intro Daten speichern <ommto=ps" fr ehd"ot>   <nu ye"et ae"il"   ipttp=tx"nm=tte       lchle=Ttl eurd      paeodr"ie"rqie>   <eetnm=pirt"   slc ae"roiy>     <pinvle""Nerg/pin     oto au=0>idi<oto>     <pinvle""Nra<oto>     oto au=1>oml/pin     <pinvle""Dign<oto>     oto au=2>rned/pin   <slc>   /eet   <nu ye"umt>   ipttp=sbi" <fr> /omlocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 65/94
  16. 16. 17.09.12 Workshop-Intro Daten speichern #Frua­bednafne  omlrAsne bagn $om)sbi et > (fr.umt(v)­  etpeeteal(  bednsopn  v.rvnDfut)#Asne tpe  nwtm=nwIe(  ee oe ae..  eIe  e tm)#NusMdlbun.  nwtmstil (iptnm=tte])vl)  eIe.e tte,$nu[ae"il".a(  nwtmstroiy,$eetnm=pirt".a(  eIe.e pirt (slc[ae"roiy])vl)  Iesadnwtm   . e olcinhnuüe..  tm.d eIe  #..drCleto izfgn.  nwtmsv(     . n pihr!  eIe.ae)   #..udsecenlocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 66/94
  17. 17. 17.09.12 Workshop-Intro (Stellt euch hier einfach eine Demo des Gezeigten vor)localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 67/94
  18. 18. 17.09.12 Workshop-Intro Gute Sachen Fertige Bausteine (Models, Views, Collections) mit nützlichen Defaults Viel nützliches Zubehör (Underscore, Events, Templating) Konventionen und gleichzeitig viele Freiheitennlocalhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 68/94
  19. 19. 17.09.12 Workshop-Intro Offene Fragen Wie strukturieren wir übergeordnete Konzepte wie Module? Wie wird ein „Item“ repräsent? Seite? Widget? Wie managen wir Permissions und Authentifizierung? Backbone gibt uns keine Antworten hierauf!localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 69/94

×