Your SlideShare is downloading. ×
0
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
AMD, BDD, e o Javali
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

AMD, BDD, e o Javali

584

Published on

Saiba como manter seu JavaScript modular, testado e automatizado, utilizando algumas ferramentas como: RequireJS, Mocha e GruntJS. - Rupy Brazil 2013 …

Saiba como manter seu JavaScript modular, testado e automatizado, utilizando algumas ferramentas como: RequireJS, Mocha e GruntJS. - Rupy Brazil 2013

0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
584
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
2
Comments
0
Likes
4
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. AMD, BDD e o Javali "PROGRAMMING IS A CRAFT NOT SCIENCE OR ENGINEERING" John Graham Cumming
  • 2. É uma combinação de habilidades e experiência expressada por meio de ferramentas, o artersão escolhe suas ferramentas específicas e aprende a usá-las para criar sua arte.
  • 3. GIVEN THAT IT'S A CRAFT THEN IT'S NOT HARD TO SEE THAT: experience matters tools matter intuition matters
  • 4. AMD Asynchronous Module Definition!
  • 5. REQUIRE JS
  • 6. O RequireJS surgiu em setembro de 2009, com a proposta de ser um carregador de módulos para javascript.
  • 7. Hoje ele gerencia as dependências do seu programa
  • 8. O PROBLEMA: ESCREVER CÓDIGO MODULAR.
  • 9. MODULARIZAÇÃO VS ACOPLAMENTO Acoplamento: Gera dependência Dificulta o crescimento Não simpatiza com TDD|BDD Dificulta entendimento do código Impossibilita reutilização Gera propagação de mudanças
  • 10. MODULARIZAÇÃO VS ACOPLAMENTO Modularização: Menos dependências Fácil evolução Facilidade na hora de testar Simples de ler Facilidade de reutilização Liberdade para alterações
  • 11. ENTÃO EU SÓ CONSIGO ESCREVER JAVASCRIPT MODULAR SE EU USAR UMA BIBLIOTECA? NÃO! ENTÃO PORQUE REQUIREJS?
  • 12. AMD IS NOT THE ANSWER Tom Dale
  • 13. Many HTTP Requests! Too Much Ceremony The alternative!
  • 14. PLEASE, SHOW ME THE CODE!
  • 15. dfn('qey] eie[jur', fnto (){ ucin $ fnto Pooalr ( { ucin htGley ) ti.hms=$'gleytub) hstub (.alr-hm'; ti.ihihs=$'gleyhglgt) hshglgt (.alr-ihih'; ti.cieht =$'gleyhglgto'; hsatvPoo (.alr-ihih.n) ti.hmso(muene' $poyti.nhmHvr ti); hstub.n'osetr, .rx(hsoTuboe, hs) } Pooalr.rttp.nhmHvr=fnto (v { htGleypooyeoTuboe ucin e) vr$urnTre =$e.urnTre) a cretagt (vcretagt, idx=$urnTre.tr'aaidx) ne cretagtat(dt-ne'; ti.cieht.eoels(o'; hsatvPoormvCas'n) ti.cieht =$ti.ihihsidx) hsatvPoo (hshglgt[ne]; ti.cieht.dCas'n) hsatvPooadls(o'; } rtr Pooalr; eun htGley } ) ;
  • 16. dfn( eie[ 'qey jur' ] fnto (){ , ucin $ 's src' ue tit; $f.xadotn =fnto ( { .nepnCnet ucin ) ti.ahfnto(e,eeet{ hsec(ucinky lmn) vr$lmn =$eeet, a eeet (lmn) cnet syels; otn, tlCas $lmn.lc(ucineet{ eeetcikfnto(vn) eetpeeteal(; vn.rvnDfut) cnet=$lmn.tr'aacnet) otn eeetat(dt-otn'; $lmn.eoels(cikbe) eeetrmvCas'lcal'; vr$otn =$cnet; a cnet (otn) $otn.hw) cnetso(; } ) } ) } }; )
  • 17. rqiecni( eur.ofg{ bsUl "cit/ aer: srps" si:{ hm "akoe:{ bcbn" dp:[udrcr" "qey] es "nesoe, jur", eprs "akoe xot: Bcbn" } } , pts { ah: "ot:".vno/otsc, mu" ./edrmu/r" "et:".vno/eurj-ettx" tx" ./edrrqiestx/et, "br" ".vno/eurj-adeashas, has: ./edrrqieshnlbr/br" "qey:".vno/qeyjur" jur" ./edrjur/qey, "aeok:"tp:/onc.aeokntp_Ral, fcbo" hts/cnetfcbo.e/tB/l" "efe" "tp/cnlaltscmlalt064lalt lalt: ht:/d.efej.o/efe-../efe" } }; )
  • 18. dfn( eie[ 'br!euiyudetmltsue/ad, hasscrtBnl/epae/srcr' 'qey jur' ] fnto (epae $ { , ucin tmlt, ) 's src' ue tit; rtr fnto (otie,ue,pae){ eun ucin cnanr sr lyr vr$otie =$cnanr; a cnanr (otie) Hnlbr.eitrepr adeasrgseHle( 'ePaePitPret, gtlyronsecn' $poypae.ePitPret pae) .rx(lyrgtonsecn, lyr ) ; Hnlbr.eitrepr adeasrgseHle( 'eUeFrtae, gtsrisNm' $poyue.eFrtae ue) .rx(srgtisNm, sr ) ; $otie.tl cnanrhm( tmlt( epae{ 'sr:ue, ue' sr 'lyr:pae pae' lyr } ) ) ; } ; }; )
  • 19. BDD Behavior-driven development Desenvolvimento orientado ao comportamento
  • 20. TDD Por onde começar? O que testar? O que não testar?
  • 21. BDD! Tests are Specs O teste pode ser a sua documentação. A palavra should te mantém no foco do teste. O nome do teste ajuda quando o teste falha. O should te faz questionar a premissa do teste. Qual a proxima coisa mais importante que o seu sistema não faz ainda?
  • 22. "O BDD EVOLUIU DE PRÁTICA ÁGEIS" Como um [X] Eu quero [Y] Para que [Z] Dado algum contexto inicial. Quando algum evento ocorrer. Então verificar os resultados.
  • 23. MOCHA
  • 24. UM FRAMEWORK DE TESTES JAVASCRIPT (NODE.JS E BROWSER) PARA SIMPLIFICAR TESTES ASSÍNCRONOS
  • 25. POR ONDE COMEÇAR Você precisa escolher uma biblioteca de asserts: should.js expect.js chai better-assert
  • 26. Show me the code! dsrb(Ary,fnto( { ecie'ra' ucin) dsrb(#neO(' fnto({ ecie'idxf), ucin) i(sol rtr - we tevlei ntpeet,fnto({ t'hud eun 1 hn h au s o rsn' ucin) asr.qa(1 [,,]idxf5) seteul-, 123.neO(); asr.qa(1 [,,]idxf0) seteul-, 123.neO(); } ) } ) }; )
  • 27. rqie[ eur( 'oue/ht-alr/an mdlspoogleymi' ] fnto (htGley{ , ucin Pooalr) 's src' ue tit; fnto cetDmcp ( { ucin raeoSoe ) vri=0 a , l=5 , d,d,d; l t d d =dcmn.raelmn(d'; l ouetcetEeet'l) fr( =0 i<l i+ 1 { o i ; ; = ) vrd =dcmn.raelmn(d'; a t ouetcetEeet't) d.lsNm + 'alr-ihih' tcasae = gleyhglgt; i ( = 0 { f i = ) d.lsNm + 'o' tcasae = n; } d.pedhl(t; lapnCidd) } fr( =0 i<l i+ 1 { o i ; ; = ) vrd =dcmn.raelmn(d'; a d ouetcetEeet'd) d.lsNm + 'alr-hm' dcasae = gleytub; d.eAtiue'aaidx,i; dsttrbt(dt-ne' ) d.pedhl(d; lapnCidd) } rtr d; eun l } dsrb(PooGley,fnto ( { ecie'ht alr' ucin ) vrpooalr,dmcp,tsAe, a htGley oSoe etra $hms $ihihs $cieihih,i l dtIdx tub, hglgt, atvHglgt , , aane; bfr(ucin( { eoefnto ) dmcp =cetDmcp(; oSoe raeoSoe) tsAe =dcmn.eEeetyd'etra) etra ouetgtlmnBI(tsAe'; tsAe.pedhl(oSoe; etraapnCiddmcp) pooalr =nwPooalr(; htGley e htGley)
  • 28. O seu SpecRunner: <bd> oy <ln he=./oe_opnnsmcamcacs rl"tlset mda"cen / ik rf".bwrcmoet/oh/oh.s" e=syehe" ei=sre" > <srp sc".bwrcmoet/eurj/eur.s> cit r=./oe_opnnsrqiesrqiej" <srp sc".bwrcmoet/oh/oh.s> cit r=./oe_opnnsmcamcaj" <srp sc".bwrcmoet/xetepc.s> cit r=./oe_opnnsepc/xetj"
  • 29. Rodando seus testes: <srp tp=tx/aacit> cit ye"etjvsrp" vrses=[ a pc 'pc/ouese' sesmdl.pc, 'pc/opnn.pc, sescmoetse' 'pc/etr.pc sesfauese' ] ; rqiecni( eur.ofg{ .. . }; ) mcastp'd'; oh.eu(bd) rqie ses fnto ( { eur( pc, ucin ) mcarn) oh.u( }; ) </cit srp> </oy bd>
  • 30. O RESULTADO NO NAVEGADOR:
  • 31. O RESULTADO NO TERMINAL:
  • 32. GRUNTJS
  • 33. O GRUNT É UM GERENCIADOR DE TAREFAS FRONT-END FEITO EM JAVASCRIPT. TAREFAS DA ROTINA DO DESENVOLVIMENTO FRONTEND Testar Minificar Concatenar Compilar ...
  • 34. PORQUE ESCOLHER O GRUNT? A comunidade do grunt é enorme e cresce a cada dia, já são centenas de plugins do grunt que fazem praticamente tudo que você precisa.
  • 35. INSTALANDO O GRUNTJS nmisal- gutci p ntl g rn-l OU sd nmisal- gutci uo p ntl g rn-l
  • 36. Configurando o GruntJS nmii p nt nmisalgut-sv-e. p ntl rn -aedv
  • 37. O PACKAGE.JSON { "ae:"eelj" nm" rva.s, "eso" "..-e" vrin: 260dv, "ecito" "h HM Peetto Faeok, dsrpin: Te TL rsnain rmwr" "oeae:"tp/lbhkms/eelj" hmpg" ht:/a.ai.erva-s, "udmi" "eels, sboan: rvaj" "cit" { srps: "et:"rn ts" ts" gut et, "tr" " sat: " } , "uhr:{ ato" "ae:"ai E Hta" nm" Hkm l atb, "mi" "ai.latbgalcm, eal: hkmehta@mi.o" "e" "tp/hkms" wb: ht:/ai.e } , "eoioy:{ rpstr" "ye:"i" tp" gt, "r" "i:/ihbcmhkmlrva.sgt ul: gt/gtu.o/aie/eelj.i" } , "nie" { egns: "oe:"080 nd" ~.." } , "eednis:{ dpnece" "okti" "091" sce.o: ~..3 } , "eDpnece" { dveednis: "rn-oti-ui" "022, gutcnrbqnt: ~.." "rn-oti-sit:"064, gutcnrbjhn" ~.." "rn" "040 gut: ~.." } , "iess:[ lcne"
  • 38. O GRUNTFILE.JS mdl.xot =fnto (rn){ oueeprs ucin gut 's src' ue tit; gutiiCni( rn.ntofg{ pg gutfl.edSN'akg.sn) k: rn.ieraJO(pcaejo', rqies gutfl.edSN'ofgrqiesjo', eurj: rn.ieraJO(cni/eurj.sn) cmas gutfl.edSN'ofgcmasjo', ops: rn.ieraJO(cni/ops.sn) wth gutfl.edSN'ofgwthjo', ac: rn.ieraJO(cni/ac.sn) ulf:gutfl.edSN'ofgulf.sn) giy rn.ieraJO(cni/giyjo', csit gutfl.edSN'ofgcsitjo', sln: rn.ieraJO(cni/sln.sn) jhn:gutfl.edSN'ofgjhn.sn) sit rn.ieraJO(cni/sitjo', cnet gutfl.edSN'ofgcnetjo', onc: rn.ieraJO(cni/onc.sn) mca gutfl.edSN'ofgmcajo', oh: rn.ieraJO(cni/oh.sn) sel gutfl.edSN'ofgseljo', hl: rn.ieraJO(cni/hl.sn) rlae gutfl.edSN'ofgrlaejo' ees: rn.ieraJO(cni/ees.sn) }; ) rqie'acdp)fle(gut*)frahgutlaNmak) eur(mthe'.itr'rn-'.oEc(rn.odpTss; gutrgseTs(bid,[cmas,'eurj') rn.eitrak'ul' 'ops' rqies]; gutrgseTs(ts' [mca]; rn.eitrak'et, 'oh') } ;
  • 39. GRUNT MOCHA { "et:{ ts" "r" [ts/pcunrhm", sc: "etSeRne.tl] "pin" { otos: "u" fle rn: as, "eotr:"pc rpre" Se" } } }
  • 40. GRUNT CONNECT { "evr:{ sre" "pin" { otos: "ot:90, pr" 01 "otae:"" hsnm" *, "eplv" tu keaie: re } } }
  • 41. GRUNT REQUIREJS { "opl":{ cmie "pin":{ otos "aer" "r/s" bsUl: scj/, "ae:"ieae, nm" flnm" "ah" { pts: "epae" ".tmlts" tmlts: ./epae/, "adeas:"../oe_opnnshnlbr/adeas, Hnlbr" ./.bwrcmoet/adeashnlbr" "et:"../oe_opnnsrqiestx/et, tx" ./.bwrcmoet/eurj-ettx" "br" "../oe_opnnsrqieshnlbr/br" has: ./.bwrcmoet/eurj-adeashas } , "hm:{ si" "adeas:{ Hnlbr" "xot" "adeas eprs: Hnlbr" } , "qey:{ jur" "xot" "Qey eprs: jur" } } , "u" "ulcj/anmnj" ot: pbi/smi.i.s, "piie:"giy" otmz" ulf2 } } }
  • 42. "I'M NOT YOUNG ENOUGH TO KNOW EVERYTHING" John Graham Cumming
  • 43. RAFAEL LYRA front end developer at apontador.com github: rafaellyra twitter: @rafaellyra linkedin: br.linkedin.com/in/rafaellyra/

×