SlideShare ist ein Scribd-Unternehmen logo
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/languages




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              29/94
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
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
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 wf




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              32/94
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 37




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              33/94
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
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)­
      ?gt'o/jxtt,(eut >
      aetrsl frsl?
       lr euti eut




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              35/94
17.09.12                                                                         Workshop-Intro




    CoffeeScript­Features
    zh  ubrwno.rmt'i 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 hn'i ed
     we 2te enGe'
      hn4 hn'i 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
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 clne'uut)
     uut=nwShag(Ags'

    ags.rs en
     uutfisbrd
    wno.lr uuteege
     idwaetags.nri




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              37/94
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 JavaScript




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              38/94
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/chaplin




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print               61/94
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 mdlgt'et)
      $'oy)apn $l
       (bd'.ped@e
      rtr hs
       eunti
    }




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              62/94
17.09.12                                                                         Workshop-Intro




    Backbone­Klassen nutzen
    #Afnu itäei e olcinrairn
      u eeEnrg ndrCleto egee
    Ieso ad,(eMdl >
     tm.n'd' nwoe)­
     nwIeVe(
      e tmiw{
      mdl eMdl
       oe:nwoe
     }.edr)
      )rne(

    #Nu oesalgn.
      eeMdl nee..
    ie1=nwIe(.e(tx' Hlo'
     tm  e tm)st'et,'al!)
    ie2=nwIe(.e(tx' Wl!)
     tm  e tm)st'et,'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
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
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>
     /om




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              65/94
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.
     nwtmst'il' (iptnm=tte])vl)
      eIe.e tte,$'nu[ae"il"'.a(
     nwtmst'roiy,$'eetnm=pirt"'.a(
      eIe.e pirt' (slc[ae"roiy])vl)
     Iesadnwtm   . e olcinhnuüe..
      tm.d eIe  #..drCleto izfgn.
     nwtmsv(     . n pihr!
      eIe.ae)   #..udsecen




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              66/94
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
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 Freiheitenn




localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print              68/94
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

Weitere ähnliche Inhalte

Andere mochten auch

Aula 05 produção e processos (2)
Aula 05   produção e processos (2)Aula 05   produção e processos (2)
Aula 05 produção e processos (2)
RD COACH
 
Dia Mundial da Floresta
Dia Mundial da FlorestaDia Mundial da Floresta
Dia Mundial da Floresta
CoordTic
 
Jornal do Paulo Octávio de Azevedo
Jornal do Paulo Octávio de AzevedoJornal do Paulo Octávio de Azevedo
Jornal do Paulo Octávio de Azevedo
EASYMATICA
 
Mapeamento de Produção do Conjunto Palmeiras 2009
Mapeamento de Produção do Conjunto Palmeiras 2009Mapeamento de Produção do Conjunto Palmeiras 2009
Mapeamento de Produção do Conjunto Palmeiras 2009
bancopalmas
 
1 bpd pepelimao
1 bpd  pepelimao1 bpd  pepelimao
1 bpd pepelimao
Francisco Eustáquio
 
775588
775588775588
775588
252525sss
 
Renato Abdo - Miyashita - jan 2010
Renato Abdo - Miyashita - jan 2010Renato Abdo - Miyashita - jan 2010
Renato Abdo - Miyashita - jan 2010
Dialeto Social Media
 
Eng Software
Eng SoftwareEng Software
Eng Software
pauloistec
 
milagros
milagrosmilagros
milagros
PEPERINAONLINE
 
Originale M. Ipolita
Originale M. IpolitaOriginale M. Ipolita
Originale M. Ipolita
Franca Negri
 
Dia Mundial da Floresta
Dia Mundial da FlorestaDia Mundial da Floresta
Dia Mundial da Floresta
CoordTic
 
A Poesia Das Imagens
A Poesia Das ImagensA Poesia Das Imagens
A Poesia Das Imagens
guest56383cd
 
Dieta das Combinações | Dany Andrade
Dieta das Combinações | Dany AndradeDieta das Combinações | Dany Andrade
Dieta das Combinações | Dany Andrade
Chá de Carambola
 
I Forum Turismo Comunitário no Conjunto Palmeiras
I Forum Turismo Comunitário no Conjunto PalmeirasI Forum Turismo Comunitário no Conjunto Palmeiras
I Forum Turismo Comunitário no Conjunto Palmeirasbancopalmas
 
Diapositivas diseño de proyectos 1 4
Diapositivas diseño de proyectos 1 4Diapositivas diseño de proyectos 1 4
Diapositivas diseño de proyectos 1 4
proyectogrupo486
 
Termometry with the PC
Termometry with the PCTermometry with the PC
Termometry with the PC
bernardomedina
 
Stickers
StickersStickers
Stickers
fundesinpa
 
Maria
MariaMaria
Maria
maria23
 
L'organització política i Abderraman III (Francesc)
L'organització política i Abderraman III (Francesc)L'organització política i Abderraman III (Francesc)
L'organització política i Abderraman III (Francesc)
jarderiu
 
情報と職業プレゼン予告
情報と職業プレゼン予告情報と職業プレゼン予告
情報と職業プレゼン予告
Kazuhiro Hishinuma
 

Andere mochten auch (20)

Aula 05 produção e processos (2)
Aula 05   produção e processos (2)Aula 05   produção e processos (2)
Aula 05 produção e processos (2)
 
Dia Mundial da Floresta
Dia Mundial da FlorestaDia Mundial da Floresta
Dia Mundial da Floresta
 
Jornal do Paulo Octávio de Azevedo
Jornal do Paulo Octávio de AzevedoJornal do Paulo Octávio de Azevedo
Jornal do Paulo Octávio de Azevedo
 
Mapeamento de Produção do Conjunto Palmeiras 2009
Mapeamento de Produção do Conjunto Palmeiras 2009Mapeamento de Produção do Conjunto Palmeiras 2009
Mapeamento de Produção do Conjunto Palmeiras 2009
 
1 bpd pepelimao
1 bpd  pepelimao1 bpd  pepelimao
1 bpd pepelimao
 
775588
775588775588
775588
 
Renato Abdo - Miyashita - jan 2010
Renato Abdo - Miyashita - jan 2010Renato Abdo - Miyashita - jan 2010
Renato Abdo - Miyashita - jan 2010
 
Eng Software
Eng SoftwareEng Software
Eng Software
 
milagros
milagrosmilagros
milagros
 
Originale M. Ipolita
Originale M. IpolitaOriginale M. Ipolita
Originale M. Ipolita
 
Dia Mundial da Floresta
Dia Mundial da FlorestaDia Mundial da Floresta
Dia Mundial da Floresta
 
A Poesia Das Imagens
A Poesia Das ImagensA Poesia Das Imagens
A Poesia Das Imagens
 
Dieta das Combinações | Dany Andrade
Dieta das Combinações | Dany AndradeDieta das Combinações | Dany Andrade
Dieta das Combinações | Dany Andrade
 
I Forum Turismo Comunitário no Conjunto Palmeiras
I Forum Turismo Comunitário no Conjunto PalmeirasI Forum Turismo Comunitário no Conjunto Palmeiras
I Forum Turismo Comunitário no Conjunto Palmeiras
 
Diapositivas diseño de proyectos 1 4
Diapositivas diseño de proyectos 1 4Diapositivas diseño de proyectos 1 4
Diapositivas diseño de proyectos 1 4
 
Termometry with the PC
Termometry with the PCTermometry with the PC
Termometry with the PC
 
Stickers
StickersStickers
Stickers
 
Maria
MariaMaria
Maria
 
L'organització política i Abderraman III (Francesc)
L'organització política i Abderraman III (Francesc)L'organització política i Abderraman III (Francesc)
L'organització política i Abderraman III (Francesc)
 
情報と職業プレゼン予告
情報と職業プレゼン予告情報と職業プレゼン予告
情報と職業プレゼン予告
 

Ähnlich wie Coffee Backone Introduction

Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"
Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"
Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"
DevDay Dresden
 
Production-ready Infrastruktur in 3 Wochen
Production-ready Infrastruktur in 3 WochenProduction-ready Infrastruktur in 3 Wochen
Production-ready Infrastruktur in 3 Wochen
André Goliath
 
Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003
Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003
Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003
Brigitte Jellinek
 
Drupal 8: TWIG Template Engine
Drupal 8:  TWIG Template EngineDrupal 8:  TWIG Template Engine
Drupal 8: TWIG Template Engine
drubb
 
Webapplikationen mit Node.js
Webapplikationen mit Node.jsWebapplikationen mit Node.js
Webapplikationen mit Node.js
Sebastian Springer
 
JAX 2024: Go in der Praxis einsetzen
JAX 2024: Go in der Praxis einsetzenJAX 2024: Go in der Praxis einsetzen
JAX 2024: Go in der Praxis einsetzen
Jan Stamer
 
Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...
Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...
Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...
CISPA Helmholtz Center for Information Security
 
Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...
Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...
Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...
gedoplan
 
Der oracle dba_und_seine_passwoerter
Der oracle dba_und_seine_passwoerterDer oracle dba_und_seine_passwoerter
Der oracle dba_und_seine_passwoerter
Gunther Pippèrr
 
Differenzial Analyse in der Praxis (Florian Walther)
Differenzial Analyse in der Praxis (Florian Walther)Differenzial Analyse in der Praxis (Florian Walther)
Differenzial Analyse in der Praxis (Florian Walther)GEEKcon
 
OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...
OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...
OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...
NETWAYS
 
OSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas Lange
OSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas LangeOSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas Lange
OSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas Lange
NETWAYS
 
High performance mit PHP
High performance mit PHPHigh performance mit PHP
High performance mit PHP
Thomas Burgard
 
TypeScript
TypeScriptTypeScript
TypeScript
Jens Siebert
 
Dnug35 ak-dev.071111-cookbook
Dnug35 ak-dev.071111-cookbookDnug35 ak-dev.071111-cookbook
Dnug35 ak-dev.071111-cookbook
Ulrich Krause
 
Puppet und OpenStack - Ein gutes Team
Puppet und OpenStack - Ein gutes TeamPuppet und OpenStack - Ein gutes Team
Puppet und OpenStack - Ein gutes TeamNETWAYS
 
Expert system webinar 29.6.2017 cogito und deep learning
Expert system webinar  29.6.2017   cogito und deep learningExpert system webinar  29.6.2017   cogito und deep learning
Expert system webinar 29.6.2017 cogito und deep learning
Stefan Geißler
 

Ähnlich wie Coffee Backone Introduction (20)

Web Entwicklung mit PHP - Teil 1
Web Entwicklung mit PHP - Teil 1Web Entwicklung mit PHP - Teil 1
Web Entwicklung mit PHP - Teil 1
 
Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"
Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"
Dev Day 2019: Mirko Zeibig – "Hallo " <> "Elixir"
 
Production-ready Infrastruktur in 3 Wochen
Production-ready Infrastruktur in 3 WochenProduction-ready Infrastruktur in 3 Wochen
Production-ready Infrastruktur in 3 Wochen
 
Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003
Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003
Perl - die Taschenkettensäge unter den Programmiersprachen - Vortrag 2003
 
Drupal 8: TWIG Template Engine
Drupal 8:  TWIG Template EngineDrupal 8:  TWIG Template Engine
Drupal 8: TWIG Template Engine
 
Webapplikationen mit Node.js
Webapplikationen mit Node.jsWebapplikationen mit Node.js
Webapplikationen mit Node.js
 
JAX 2024: Go in der Praxis einsetzen
JAX 2024: Go in der Praxis einsetzenJAX 2024: Go in der Praxis einsetzen
JAX 2024: Go in der Praxis einsetzen
 
Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...
Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...
Software-Tests automatisch erzeugen: Frische Ansätze für Forschung, Praxis un...
 
Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...
Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...
Battle of the Languages: Java und Python im Wettstreit beim Lösen von Program...
 
Der oracle dba_und_seine_passwoerter
Der oracle dba_und_seine_passwoerterDer oracle dba_und_seine_passwoerter
Der oracle dba_und_seine_passwoerter
 
Differenzial Analyse in der Praxis (Florian Walther)
Differenzial Analyse in der Praxis (Florian Walther)Differenzial Analyse in der Praxis (Florian Walther)
Differenzial Analyse in der Praxis (Florian Walther)
 
OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...
OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...
OSMC 2010 | Verwendung von Puppet in verteilten Monitoring Umgebungen by Birg...
 
OSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas Lange
OSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas LangeOSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas Lange
OSDC 2010 | FAI - ein Projekt wird 10 Jahre alt by Thomas Lange
 
Web Entwicklung mit PHP - Teil 2
Web Entwicklung mit PHP - Teil 2Web Entwicklung mit PHP - Teil 2
Web Entwicklung mit PHP - Teil 2
 
Mvc public
Mvc publicMvc public
Mvc public
 
High performance mit PHP
High performance mit PHPHigh performance mit PHP
High performance mit PHP
 
TypeScript
TypeScriptTypeScript
TypeScript
 
Dnug35 ak-dev.071111-cookbook
Dnug35 ak-dev.071111-cookbookDnug35 ak-dev.071111-cookbook
Dnug35 ak-dev.071111-cookbook
 
Puppet und OpenStack - Ein gutes Team
Puppet und OpenStack - Ein gutes TeamPuppet und OpenStack - Ein gutes Team
Puppet und OpenStack - Ein gutes Team
 
Expert system webinar 29.6.2017 cogito und deep learning
Expert system webinar  29.6.2017   cogito und deep learningExpert system webinar  29.6.2017   cogito und deep learning
Expert system webinar 29.6.2017 cogito und deep learning
 

Coffee Backone Introduction

  • 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/languages localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 29/94
  • 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. 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. 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 wf localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 32/94
  • 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 37 localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 33/94
  • 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. 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)­  ?gt'o/jxtt,(eut >   aetrsl frsl?   lr euti eut localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 35/94
  • 8. 17.09.12 Workshop-Intro CoffeeScript­Features zh  ubrwno.rmt'i 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 hn'i ed  we 2te enGe'  hn4 hn'i 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. 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 clne'uut) uut=nwShag(Ags' ags.rs en uutfisbrd wno.lr uuteege idwaetags.nri localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 37/94
  • 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 JavaScript localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 38/94
  • 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/chaplin localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 61/94
  • 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 mdlgt'et)   $'oy)apn $l   (bd'.ped@e   rtr hs   eunti } localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 62/94
  • 13. 17.09.12 Workshop-Intro Backbone­Klassen nutzen #Afnu itäei e olcinrairn  u eeEnrg ndrCleto egee Ieso ad,(eMdl > tm.n'd' nwoe)­  nwIeVe(  e tmiw{   mdl eMdl   oe:nwoe  }.edr)  )rne( #Nu oesalgn.  eeMdl nee.. ie1=nwIe(.e(tx' Hlo' tm  e tm)st'et,'al!) ie2=nwIe(.e(tx' Wl!) tm  e tm)st'et,'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. 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. 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> /om localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 65/94
  • 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.  nwtmst'il' (iptnm=tte])vl)  eIe.e tte,$'nu[ae"il"'.a(  nwtmst'roiy,$'eetnm=pirt"'.a(  eIe.e pirt' (slc[ae"roiy])vl)  Iesadnwtm   . e olcinhnuüe..  tm.d eIe  #..drCleto izfgn.  nwtmsv(     . n pihr!  eIe.ae)   #..udsecen localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 66/94
  • 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. 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 Freiheitenn localhost/~peter/OpenSource/Pik6/presentations/Workshop 5 Tage/index_is24.html#print 68/94
  • 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