Javascript As AProgramming Language
IS    Javascript As AProgramming LanguageVersioning, Test Driven Development & Continuous Integration              http://...
Hello, who’s speaking?
Hello, who’s speaking?           Marco Cedaro             @cedmax
Hello, who’s speaking?           Marco Cedaro             @cedmax           They said I am a...            Frontend Cowboy...
Hello, who’s speaking?           Marco Cedaro             @cedmax           They said I am a...            Frontend Cowboy...
Hello, who’s speaking?           Marco Cedaro             @cedmax           They said I am a...            Frontend Cowboy...
Hello, who’s speaking?           Marco Cedaro             @cedmax           Actually I am:            Platform Software De...
Hello, who’s speaking?           Marco Cedaro             @cedmax           Actually I am:            Platform Software De...
Hello, who’s speaking?           Marco Cedaro             @cedmax           Actually I am:            Platform Software De...
1. Disclaimer           2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools    5. The Environment      ...
1. Disclaimer           2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools    5. The Environment      ...
DISCLAIMERAlways code as if the guy who ends upmaintaining your code will be a violentpsychopath who knows where you live ...
REAL DISCLAIMERJavascript is not jQuery  Let’s say it all together: “Javascript is not jQuery”     What do you mean?      ...
Not jQuery’s faultjQuery is extremely powerfulbut...WITH GREAT POWER THEREMUST ALSO COME - - GREATRESPONSABILITY! ** origi...
The right tool in wrong hands  but who cares? as long as interaction is held by:    designers    that aren’t exactly aware...
Not a “merchant of complexity”   we don’t need just to let stuff work       we don’t need complexity either         we nee...
is it about simplicity?it isnt   there’s a lot of people who hides their ignorance behind   simplicity       we have to cl...
Javascript is a serious business
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
YOU NEED A STRATEGY  Whats the use of running if you are        not on the right road                               German...
YOU NEED A STRATEGY  Why do you need a strategy?       you need a strategy because best practices and       design pattern...
It doesn’t really matter if you are working at facebook,      soundcloud or by yourself in a small office.  How many people...
A real life example          Small Web Agency          1 designer, 2 developers and a          lot of small website with l...
The designerintroduces a slider on 5         websites:”it’s cool on apple store”.The developer gets a jQuery       plugin ...
The designerintroduces a slider on 5        Major release of the         websites:              most used browser.”it’s co...
The designer                                             Oh damn! There’s nointroduces a slider on 5        Major release ...
Am I the only one orthere’s something wrong?
Just a spoonful of sugar...               We need to manage               codebase just in one               place        ...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
Continuous Integration A software development practice where members of a team integrate their work frequently. Each integ...
I Build So Consistently
I Build So Consistentlyidentify
I Build So Consistently                      buildidentify
I Build So Consistently                      buildidentify           share
I Build So Consistently                               buildidentify           share   make it continuous
How does this fit our     needs?
codebase just in one place setup an isolated repository for reused libraries share the code through a CI process resolve d...
continue development   without regressionvalidate the coderun unit test against errors (both coding and logic)version the ...
stable versionsuse a declared semantic versioninguse a file system based pattern: //jsRepo/dist/yourscript-1.0.0/yourscript...
Unit & Functional an overview
Unit & Functional an overview
Unit & Functional an overview
Unit & Functional an overview
Unit & Functional an overview is it red? is it a 4x2 block?   is the roof red?  is it made to fit                       is ...
Unit vs Functional                  test                consistency                            controltest cross   interac...
Test Driven Development
You will, eventually..
Everyone should be happy
KISS              Keep it Simple & SmartDon’t over-engineer it: you will eventually regret everysingle useless complexity ...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
CHOOSE YOUR TOOLS A man cannot be too careful in the      choice of his enemies                               Oscar Wilde
Another Neat ToolSimply saying the documentation sucks         doesnt do any good                Larry V. Streepy - Ant Ma...
Another Neat ToolSimply saying the documentation sucks         doesnt do any good                                  Larry V...
ANTXML driven: simple and straightforwarda standardthere are a lot of implementations and plugins  every tool in this pres...
ANT - AlternativesThere are a lot of valuable Ant alternatives.    Choose the one that fits better your needs
Code Base:  CODE QUALITY VALIDATOR  UNIT TEST RUNNERWebsites:  DEPENDENCY RESOLVER  CODE MINIFIER
Code Base:  JSLINT  JS TEST DRIVERWebsites:  DEPENDENCY RESOLVER  CODE MINIFIER
JsLintjavascript execution often runs into silent errors due to itsbad parts (ref. Javascript the Good Parts, Crockford) a...
JS Test DriverJs Test Driver is the most complete javascript unit test runneravailable  external api integration  jasmine ...
How does it work?It runs a serveropens browsersruns test suitesretrieves results on the consolecreates a JUnit report
Pitfalls?testing asynchronous execution is a mess
Sinon.jsa standalone javascript library with unit test utilities   fake server   manage server response in order to test a...
JS Test Driver - Alternatives #1  Env.JS  a javascript DOM implementation in javascript engines: it is  possible to fake b...
JS Test Driver - Alternatives #2  PhantomJS  It is a minimalistic, headless, WebKit-based, JavaScript-driven tool  upon wh...
JS Test Driver - Alternatives #3  TestSwarm  It is a John Resig’s project of Distributed Continuous Integration  released ...
JS Test Driver - Alternatives #4  Yeti  it stands for Yahoo Easy Test Interface and it is a very promising  unit test runn...
Code Base:  JSLINT  JS TEST DRIVERWebsites:  DEPENDENCY RESOLVER  CODE MINIFIER
Code Base:  JSLINT  JS TEST DRIVERWebsites:  APACHE IVY  YUI COMPRESSOR
Apache IvyIvy is a simple, powerful and well documented dependencymanagerIt has a full integration in ANT build systemand,...
Ivy AlternativesIs there any alternative?   I haven’t found anything simple enough to compete with Ivy   straightforwardne...
Yui Compressorwe don’t really need Yui Compressor to set up ourenvironment, but why should we publish uncompressed js foro...
Yui Compressor Alternatives  Packer is quite powerful in terms of filesize, but it introduces  processing time lag  Google ...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
1. Disclaimer          2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools   5. The Environment       6...
THE ENVIRONMENT    I like boring things                           Andy Warhol
Javascript Repository
Javascript Repository/    dist    libs    src    tools    build.xml
Javascript Repository/    dist    libs    src    tools    build.xml                  /tools/                    jslint    ...
Javascript Repository/                                        /src/    dist                                   form-validat...
Javascript Repository                                         /libs/                                           jquery-1.5....
Javascript Repository                                         /libs/                                           jquery-1.5....
basepath: ../..server: http://127.0.0.1:9876load:  - libs/sinon-1.0.0.js  - libs/jquery-1.5.1.min.js  - src/slider/src/sli...
Lets code
Testvar test = new TestCase("Slider.test", {    setUp: function(){      },      tearDown: function(){      }});           ...
Testvar test = new TestCase("Slider.test", {    setUp: function(){        /*:DOC += <ul id="foo"><li></li><li></li></ul> *...
Testvar test = new TestCase("Slider.test", {    setUp: function(){        /*:DOC += <ul id="foo"><li></li><li></li></ul> *...
JS Test Driver in action
Testvar test = new TestCase("Slider.test", {    setUp: function(){        /*:DOC += <ul id="foo"><li></li><li></li></ul> *...
Testvar test = new TestCase("Slider.test", {    setUp: function(){        /*:DOC += <ul id="foo"><li></li><li></li></ul> *...
JS Test Driver in action
Javascript Repository                                         /libs/                                           jquery-1.5....
Javascript Repository                  /dist/                   /libs/                    form-validator-1.0.0     jquery-...
Website Solution
Website Solution/    css    img    inc    scripts    .htaccess    index.php
Website Solution                      /scripts/                        public/    css                 src    img          ...
Website Solution                      /scripts/                        public/    css                 src    img          ...
<ivysettings>   <settings defaultResolver="JSResolver"/>    <resolvers>        <url name="JSResolver" checkmodified="true"...
<ivy-module version="2.0">    <info organisation="libs" module="myWebSite" />    <dependencies>        <dependency org="li...
1. Disclaimer           2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools    5. The Environment      ...
1. Disclaimer           2. You Need a Strategy   3. Continuous Integration4. Choose Your Tools    5. The Environment      ...
IN THE WILDIn the wild, there is no health care.                           Dwight Schrute (the office)
what is it about?control & knowledge
Inversion of control freakness      I am not a control freak.Gain control and then leave to themachine the responsibility ...
LOOKING FORWARDJavascript had several springs  buzzwords: DHTML before and Ajax after  big frameworks: from Prototype+Scri...
LOOKING FORWARDJavascript had several springs  buzzwords: DHTML before and Ajax after  big frameworks: from Prototype+Scri...
LOOKING FORWARDJavascript had several springs  buzzwords: DHTML before and Ajax after  big frameworks: from Prototype+Scri...
LOOKING FORWARDJavascript had several springs  buzzwords: DHTML before and Ajax after  big frameworks: from Prototype+Scri...
LOOKING FORWARD    the further we look at,  the more control we need
LOOKING FORWARD    the further we look at,  the more control we need
LOOKING FORWARD    the further we look at,  the more control we need  javascript is a programming language
LOOKING FORWARD     the further we look at,   the more control we need  javascript is a programming language javascript is...
LOOKING FORWARD     the further we look at,   the more control we need  javascript is a programming language javascript is...
javascript kicks asses
marco@fromthefront.ithttps://github.com/cedmax@cedmax
One last word..
Massimiliano DavoliAlberto BrandoliniFrancesco Fullone  Luca Lischetti  Rocco Curcio Matteo Gazziola
jsDay - Javascript as a programming language
Upcoming SlideShare
Loading in...5
×

jsDay - Javascript as a programming language

2,852

Published on

Versioning, Test Driven Development and Continuous Integration: how to setup up a stable javascript continuous integration environment and why you need it. Through a real life example, it explains all the benefits of having real control over javascript codebase and analyses developer and webapps needs and the tools that fit those requirements.

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

No Downloads
Views
Total Views
2,852
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
49
Comments
0
Likes
11
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • jsDay - Javascript as a programming language

    1. 1. Javascript As AProgramming Language
    2. 2. IS Javascript As AProgramming LanguageVersioning, Test Driven Development & Continuous Integration http://joind.in/3354
    3. 3. Hello, who’s speaking?
    4. 4. Hello, who’s speaking? Marco Cedaro @cedmax
    5. 5. Hello, who’s speaking? Marco Cedaro @cedmax They said I am a... Frontend Cowboy Nicola Vitto
    6. 6. Hello, who’s speaking? Marco Cedaro @cedmax They said I am a... Frontend Cowboy Nicola Vitto Javascript Pervert Roberto Felter
    7. 7. Hello, who’s speaking? Marco Cedaro @cedmax They said I am a... Frontend Cowboy Nicola Vitto Javascript Pervert Roberto Felter Perfect Stranger basically anyone else
    8. 8. Hello, who’s speaking? Marco Cedaro @cedmax Actually I am: Platform Software Developer at Yoox Group, currently in charge of js architecture development
    9. 9. Hello, who’s speaking? Marco Cedaro @cedmax Actually I am: Platform Software Developer at Yoox Group, currently in charge of js architecture development Frontend Meetup organizer with From The Front
    10. 10. Hello, who’s speaking? Marco Cedaro @cedmax Actually I am: Platform Software Developer at Yoox Group, currently in charge of js architecture development Frontend Meetup organizer with From The Front and a javascript pervert
    11. 11. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 1. Disclaimer
    12. 12. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 1. Disclaimer
    13. 13. DISCLAIMERAlways code as if the guy who ends upmaintaining your code will be a violentpsychopath who knows where you live Martin Golding
    14. 14. REAL DISCLAIMERJavascript is not jQuery Let’s say it all together: “Javascript is not jQuery” What do you mean? I mean that Javascript is not just something you find online, cut and paste in a <script> just before the end of the </body>
    15. 15. Not jQuery’s faultjQuery is extremely powerfulbut...WITH GREAT POWER THEREMUST ALSO COME - - GREATRESPONSABILITY! ** original sentence from 1962 first spiderman story
    16. 16. The right tool in wrong hands but who cares? as long as interaction is held by: designers that aren’t exactly aware of what they are doing backend developers even worse: they mostly don’t even care about what’s happening clientside as long as everything works
    17. 17. Not a “merchant of complexity” we don’t need just to let stuff work we don’t need complexity either we need a strategy to let code be maintainable and reusable
    18. 18. is it about simplicity?it isnt there’s a lot of people who hides their ignorance behind simplicity we have to claim our role in development roadmap and business strategy, because...
    19. 19. Javascript is a serious business
    20. 20. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 2.You Need a Strategy
    21. 21. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 2.You Need a Strategy
    22. 22. YOU NEED A STRATEGY Whats the use of running if you are not on the right road German proverb
    23. 23. YOU NEED A STRATEGY Why do you need a strategy? you need a strategy because best practices and design patterns are the same in a 4 guys based company as well as in a large corporate.
    24. 24. It doesn’t really matter if you are working at facebook, soundcloud or by yourself in a small office. How many people code?
    25. 25. A real life example Small Web Agency 1 designer, 2 developers and a lot of small website with low maintenance rate.
    26. 26. The designerintroduces a slider on 5 websites:”it’s cool on apple store”.The developer gets a jQuery plugin online a SLIDER’s Story
    27. 27. The designerintroduces a slider on 5 Major release of the websites: most used browser.”it’s cool on apple store”. A small fix has been released, they have to changeThe developer gets a jQuery 5 files in 5 different projects. plugin online a SLIDER’s Story
    28. 28. The designer Oh damn! There’s nointroduces a slider on 5 Major release of the mouse wheel websites: most used browser. integration!”it’s cool on apple store”. A small fix has been released, they have to change should they ask for supportThe developer gets a jQuery 5 files in 5 different projects. or should they change the plugin online library by themself? a SLIDER’s Story
    29. 29. Am I the only one orthere’s something wrong?
    30. 30. Just a spoonful of sugar... We need to manage codebase just in one place We need to be able to continue development without regression We need to use stable versions of our libraries
    31. 31. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 3. Continuous Integration
    32. 32. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 3. Continuous Integration
    33. 33. Continuous Integration A software development practice where members of a team integrate their work frequently. Each integration is verified by an automated build to detect integration errors as quickly as possible. Martin Fowler CI is about the fundamentals. If we don’t focus on the fundamentals we’ll be forced to perform low-level tasks later, usually at the most inconvenient times Paul Duvall, Continuous Integration
    34. 34. I Build So Consistently
    35. 35. I Build So Consistentlyidentify
    36. 36. I Build So Consistently buildidentify
    37. 37. I Build So Consistently buildidentify share
    38. 38. I Build So Consistently buildidentify share make it continuous
    39. 39. How does this fit our needs?
    40. 40. codebase just in one place setup an isolated repository for reused libraries share the code through a CI process resolve dependency on websites
    41. 41. continue development without regressionvalidate the coderun unit test against errors (both coding and logic)version the shared code against interface changes
    42. 42. stable versionsuse a declared semantic versioninguse a file system based pattern: //jsRepo/dist/yourscript-1.0.0/yourscript.js //jsRepo/dist/yourscript-1.0.0.jsnever modify already released versions increase version number instead
    43. 43. Unit & Functional an overview
    44. 44. Unit & Functional an overview
    45. 45. Unit & Functional an overview
    46. 46. Unit & Functional an overview
    47. 47. Unit & Functional an overview is it red? is it a 4x2 block? is the roof red? is it made to fit is there a porch?well other block? is there a door?
    48. 48. Unit vs Functional test consistency controltest cross interaction against execution test over browser between external time integration codebase libraries changes
    49. 49. Test Driven Development
    50. 50. You will, eventually..
    51. 51. Everyone should be happy
    52. 52. KISS Keep it Simple & SmartDon’t over-engineer it: you will eventually regret everysingle useless complexity you will introduce
    53. 53. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 4. Choose Your Tools
    54. 54. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 4. Choose Your Tools
    55. 55. CHOOSE YOUR TOOLS A man cannot be too careful in the choice of his enemies Oscar Wilde
    56. 56. Another Neat ToolSimply saying the documentation sucks doesnt do any good Larry V. Streepy - Ant Mailing List 06.06.2001
    57. 57. Another Neat ToolSimply saying the documentation sucks doesnt do any good Larry V. Streepy - Ant Mailing List 06.06.2001He was right: 10 years later ANT documentation still sucks but ANT is a solidchoice in build automation configuration.
    58. 58. ANTXML driven: simple and straightforwarda standardthere are a lot of implementations and plugins every tool in this presentation is easily capable to be used in Ant build process
    59. 59. ANT - AlternativesThere are a lot of valuable Ant alternatives. Choose the one that fits better your needs
    60. 60. Code Base: CODE QUALITY VALIDATOR UNIT TEST RUNNERWebsites: DEPENDENCY RESOLVER CODE MINIFIER
    61. 61. Code Base: JSLINT JS TEST DRIVERWebsites: DEPENDENCY RESOLVER CODE MINIFIER
    62. 62. JsLintjavascript execution often runs into silent errors due to itsbad parts (ref. Javascript the Good Parts, Crockford) and Lint, most oftimes, avoids those problemsand, most of all, you can have full control on how code iswritten in the team
    63. 63. JS Test DriverJs Test Driver is the most complete javascript unit test runneravailable external api integration jasmine and qunit as well as its own api test report console return and junit compatible report smooth integration both locally and on a build machine
    64. 64. How does it work?It runs a serveropens browsersruns test suitesretrieves results on the consolecreates a JUnit report
    65. 65. Pitfalls?testing asynchronous execution is a mess
    66. 66. Sinon.jsa standalone javascript library with unit test utilities fake server manage server response in order to test ajax interaction fake timer in order to test timeouts, intervals, animation callbacks... spy, stub & mock in order to make advanced assertions on object interaction
    67. 67. JS Test Driver - Alternatives #1 Env.JS a javascript DOM implementation in javascript engines: it is possible to fake browser execution and run unit tests. PROS: really fast, easily integrated in build CONS: it is all fake
    68. 68. JS Test Driver - Alternatives #2 PhantomJS It is a minimalistic, headless, WebKit-based, JavaScript-driven tool upon which is possible to build unit test. PROS: fast, integrable in build, real browser engine CONS: only WebKit
    69. 69. JS Test Driver - Alternatives #3 TestSwarm It is a John Resig’s project of Distributed Continuous Integration released in 2009 as an official Mozilla Labs project (not anymore). PROS: replaces all tools in a all-in-one solution, not only js test driver CONS: its in alpha since 2009
    70. 70. JS Test Driver - Alternatives #4 Yeti it stands for Yahoo Easy Test Interface and it is a very promising unit test runner, potentially the most suitable alternative. PROS: a real, stable alternative CONS: strictly tied to YUI framework test and build on node.js (a mess on windows: it requires cygwin)
    71. 71. Code Base: JSLINT JS TEST DRIVERWebsites: DEPENDENCY RESOLVER CODE MINIFIER
    72. 72. Code Base: JSLINT JS TEST DRIVERWebsites: APACHE IVY YUI COMPRESSOR
    73. 73. Apache IvyIvy is a simple, powerful and well documented dependencymanagerIt has a full integration in ANT build systemand, again, it’s really simple, especially if you keep a file systembased versioning.
    74. 74. Ivy AlternativesIs there any alternative? I haven’t found anything simple enough to compete with Ivy straightforwardness: the other solutions I’ve found drove me nuts
    75. 75. Yui Compressorwe don’t really need Yui Compressor to set up ourenvironment, but why should we publish uncompressed js forour websites? I don’t want to introduce the performance topic but if you do... DON’T
    76. 76. Yui Compressor Alternatives Packer is quite powerful in terms of filesize, but it introduces processing time lag Google Closure in simple mode is similar to yui (except for the fact that yui is more consolidated in time), in advanced mode is unsafe to use if you are not exactly aware of what kind of optimization your code will pass through Uglify has good points but it’s build upon node.js (again on windows is a mess) and, as for closure, you’d better know what will happen to your code
    77. 77. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 5. The Environment
    78. 78. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 5. The Environment
    79. 79. THE ENVIRONMENT I like boring things Andy Warhol
    80. 80. Javascript Repository
    81. 81. Javascript Repository/ dist libs src tools build.xml
    82. 82. Javascript Repository/ dist libs src tools build.xml /tools/ jslint JsTestDriver-1.3.1
    83. 83. Javascript Repository/ /src/ dist form-validator libs slider src src tools slider.js build.xml test slider.test.js /tools/ jsTestDriver.conf jslint version.prop JsTestDriver-1.3.1 twitter-widget ...
    84. 84. Javascript Repository /libs/ jquery-1.5.1.min.js sinon-1.0.0.js/ /src/ dist form-validator libs slider src src tools slider.js build.xml test slider.test.js /tools/ jsTestDriver.conf jslint version.prop JsTestDriver-1.3.1 twitter-widget ...
    85. 85. Javascript Repository /libs/ jquery-1.5.1.min.js sinon-1.0.0.js/ /src/ dist form-validator libs slider src src tools slider.js build.xml test slider.test.js /tools/ jsTestDriver.conf jslint version.prop JsTestDriver-1.3.1 twitter-widget ...
    86. 86. basepath: ../..server: http://127.0.0.1:9876load: - libs/sinon-1.0.0.js - libs/jquery-1.5.1.min.js - src/slider/src/slider.js - src/slider/test/slider.test.js JsTestDriver.conf
    87. 87. Lets code
    88. 88. Testvar test = new TestCase("Slider.test", { setUp: function(){ }, tearDown: function(){ }}); Codevar slider;
    89. 89. Testvar test = new TestCase("Slider.test", { setUp: function(){ /*:DOC += <ul id="foo"><li></li><li></li></ul> */ }, tearDown: function(){ }}); Codevar slider;
    90. 90. Testvar test = new TestCase("Slider.test", { setUp: function(){ /*:DOC += <ul id="foo"><li></li><li></li></ul> */ }, testSliderIsAPlugin: function(){ var test = function(){ $("slidable").slider(); }; assertNoException(test); }, tearDown: function(){ }}); Codevar slider;
    91. 91. JS Test Driver in action
    92. 92. Testvar test = new TestCase("Slider.test", { setUp: function(){ /*:DOC += <ul id="foo"><li></li><li></li></ul> */ }, testSliderIsAPlugin: function(){ var test = function(){ $("slidable").slider(); }; assertNoException(test); }, tearDown: function(){ }}); Codevar slider;
    93. 93. Testvar test = new TestCase("Slider.test", { setUp: function(){ /*:DOC += <ul id="foo"><li></li><li></li></ul> */ }, testSliderIsAPlugin: function(){ var test = function(){ $("slidable").slider(); }; assertNoException(test); }, tearDown: function(){ }}); Code(function($){ $.fn.slider = function(){};}(jQuery));
    94. 94. JS Test Driver in action
    95. 95. Javascript Repository /libs/ jquery-1.5.1.min.js sinon-1.0.0.js/ /src/ dist form-validator libs slider src src tools slider.js build.xml test slider.test.js /tools/ jsTestDriver.conf jslint version.prop JsTestDriver-1.3.1 twitter-widget ...
    96. 96. Javascript Repository /dist/ /libs/ form-validator-1.0.0 jquery-1.5.1.min.js form-validator-1.1.0 sinon-1.0.0.js slider-1.0.0/ /src/ dist slider.min.js form-validator libs twitter-widget-1.0.0 slider src twitter-widget-1.0.1 src tools twitter-widget-2.0.0 slider.js build.xml ... test slider.test.js /tools/ jsTestDriver.conf jslint version.prop JsTestDriver-1.3.1 twitter-widget ...
    97. 97. Website Solution
    98. 98. Website Solution/ css img inc scripts .htaccess index.php
    99. 99. Website Solution /scripts/ public/ css src img tools inc apache-ivy-2.2.0 scripts yui-compressor-2.4.6 .htaccess ivy-settings.xml index.php mywebapp.xml ivy.xml
    100. 100. Website Solution /scripts/ public/ css src img tools inc apache-ivy-2.2.0 scripts yui-compressor-2.4.6 .htaccess ivy-settings.xml index.php mywebapp.xml ivy.xml
    101. 101. <ivysettings> <settings defaultResolver="JSResolver"/> <resolvers> <url name="JSResolver" checkmodified="true"> <artifact pattern="//jsRepo/dist/[module]-[revision]/[module].js" /> </url> </resolvers> <caches defaultCacheDir="${basedir}/.artifacts" artifactPattern="[organization]/[module]-[revision].js" /> <property name="ivy.artifactproperty.name" value="[organization].[module]" /> <property name="ivy.artifactproperty.value" value="[organization]/[module]-[revision].js" /></ivysettings>
    102. 102. <ivy-module version="2.0"> <info organisation="libs" module="myWebSite" /> <dependencies> <dependency org="libs" name="slider" rev="1.0.0"/> <dependency org="libs" name="twitter-widget" rev="2.0.0"/> <dependency org="libs" name="form-validator" rev="1.1.0"/> </dependencies></ivy-module> ivy.xml
    103. 103. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 6. In The Wild
    104. 104. 1. Disclaimer 2. You Need a Strategy 3. Continuous Integration4. Choose Your Tools 5. The Environment 6. In The Wild 6. In The Wild
    105. 105. IN THE WILDIn the wild, there is no health care. Dwight Schrute (the office)
    106. 106. what is it about?control & knowledge
    107. 107. Inversion of control freakness I am not a control freak.Gain control and then leave to themachine the responsibility to check everything; focus on knowledge.* Inspired (and I mean copied) by http://blog.jonathanoliver.com/ - Inversion of Control Freak:Dependency Injection, Domain-Driven Design, Test-Driven Development techniques
    108. 108. LOOKING FORWARDJavascript had several springs buzzwords: DHTML before and Ajax after big frameworks: from Prototype+Scriptaculous to jQuery future: HTML5 and the microjs framework era
    109. 109. LOOKING FORWARDJavascript had several springs buzzwords: DHTML before and Ajax after big frameworks: from Prototype+Scriptaculous to jQuery future: HTML5 and the tiny super focused framework era
    110. 110. LOOKING FORWARDJavascript had several springs buzzwords: DHTML before and Ajax after big frameworks: from Prototype+Scriptaculous to jQuery future: HTML5 and the tiny super focused framework eraon browser
    111. 111. LOOKING FORWARDJavascript had several springs buzzwords: DHTML before and Ajax after big frameworks: from Prototype+Scriptaculous to jQuery future: HTML5 and the tiny super focused framework eraon browser then there’s a brand new world on server: node.js, noSQL databases (couchdb, mongodb..)
    112. 112. LOOKING FORWARD the further we look at, the more control we need
    113. 113. LOOKING FORWARD the further we look at, the more control we need
    114. 114. LOOKING FORWARD the further we look at, the more control we need javascript is a programming language
    115. 115. LOOKING FORWARD the further we look at, the more control we need javascript is a programming language javascript is a serious business.
    116. 116. LOOKING FORWARD the further we look at, the more control we need javascript is a programming language javascript is a serious business. and, most of all...
    117. 117. javascript kicks asses
    118. 118. marco@fromthefront.ithttps://github.com/cedmax@cedmax
    119. 119. One last word..
    120. 120. Massimiliano DavoliAlberto BrandoliniFrancesco Fullone Luca Lischetti Rocco Curcio Matteo Gazziola
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×