Your SlideShare is downloading. ×
0
Client               TechnologyMoretto Carlo – www.morettocarlo.eu   ts.eestec.it
Client • jQuery • Toastr • KnockoutMoretto Carlo – www.morettocarlo.eu   ts.eestec.it
jQuery Download: http://jquery.com/ jQuery is a fast and concise JavaScript Library that        simplifies  HTML       doc...
Toastr: JS notification https://github.com/CodeSeven/toastr Sample: • toastr.warning(‘Warning!) ; • toastr.success(Have fu...
Knockout http://knockoutjs.com/ Knockout is a Javascript library that allows developers to create rich, responsive display...
Features  • Declarative bindings  • Automatic UI refresh (when the data    models state changes, the UI    updates automat...
MVVM -Model View ViewModel  MVVM facilitates a clear  separation of the development of  the graphical user interface  (eit...
Example View (HTML) <p>First name: <input data-bind="value: firstName" /></p> <p>Last name: <input data-bind="value: lastN...
Example•    Control Type     knockoutjs.com/examples/controlTypes.html•    Observable Arrays     knockoutjs.com/documentat...
Download and savethe dataDownload                              Save$.getJSON("/api/yyy?par=zzz",         $.ajax({  functio...
Usefullinks •   https://github.com/CodeSeven/KoLite -     asyncCommand, activity, dirtyFlag •   http://www.knockmeout.net ...
Source ControlMoretto Carlo – www.morettocarlo.eu   ts.eestec.it
Source Control  •     TFS  •     SVN  •     Git  •     MercurialMoretto Carlo – www.morettocarlo.eu   ts.eestec.it
SVN    Compatible successor to the widely    used Concurrent Versions System (CVS):     •     Versioning of directories   ...
Git + Dramatic increase in operation speed + Cheap branch operations + Full history tree available offline + Distributed, ...
Mercurial+ Easier to learn than Git+ Better documentation+ Distributed model- No merging of two parents- Extension-based r...
Useful links  •      http://biz30.timedoctor.com/git-mecurial-and-cvs-         comparison-of-svn-software/ - git vs mercur...
Contacts   Email: moretto.carlo@outlook.com   Website: www.morettocarlo.eu   EESTEC: ts.eestec.itMoretto Carlo – www.moret...
Upcoming SlideShare
Loading in...5
×

Source control & Knockout

577

Published on

www.morettocarlo.eu
ts.eestec.it

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

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

No notes for slide

Transcript of "Source control & Knockout"

  1. 1. Client TechnologyMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  2. 2. Client • jQuery • Toastr • KnockoutMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  3. 3. jQuery Download: http://jquery.com/ jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.Moretto Carlo – www.morettocarlo.eu ts.eestec.it
  4. 4. Toastr: JS notification https://github.com/CodeSeven/toastr Sample: • toastr.warning(‘Warning!) ; • toastr.success(Have fun storming the castle!, Miracle); • toastr.error(‘Please check your data‘);Moretto Carlo – www.morettocarlo.eu ts.eestec.it
  5. 5. Knockout http://knockoutjs.com/ Knockout is a Javascript library that allows developers to create rich, responsive display and editor user interfaces with a clean underlying data model.Moretto Carlo – www.morettocarlo.eu ts.eestec.it
  6. 6. Features • Declarative bindings • Automatic UI refresh (when the data models state changes, the UI updates automatically) • Dependency tracking • TemplatingMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  7. 7. MVVM -Model View ViewModel MVVM facilitates a clear separation of the development of the graphical user interface (either as markup language or GUI code) from the development of the business logic or back end logic known as the model.Moretto Carlo – www.morettocarlo.eu ts.eestec.it
  8. 8. Example View (HTML) <p>First name: <input data-bind="value: firstName" /></p> <p>Last name: <input data-bind="value: lastName" /></p> <h2>Hello, <span data-bind="text: fullName"> </span>!</h2> View Model (Javascript) function ViewModel() { this.firstName = ko.observable(‘Mario’); this.lastName = ko.observable(‘Rossi’); this.fullName = ko.computed(function() { return this.firstName() + " " + this.lastName(); }, this); } ko.applyBindings(new ViewModel());Moretto Carlo – www.morettocarlo.eu ts.eestec.it
  9. 9. Example• Control Type knockoutjs.com/examples/controlTypes.html• Observable Arrays knockoutjs.com/documentation/observableArrays.html• Cart Editor knockoutjs.com/examples/cartEditor.htmlMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  10. 10. Download and savethe dataDownload Save$.getJSON("/api/yyy?par=zzz", $.ajax({ function (data) { type: "POST", viewModelJs = data; url: "/api/yyy?param=zzz", viewModel = data: dataJs,addComputed(viewModelJs); success: function (data) { toastr.success(‘:-));ko.mapping.fromJS(viewModelJs); }, error: function () {ko.applyBindings(viewModel); toastr.error(‘:-();}) }}); });Moretto Carlo – www.morettocarlo.eu ts.eestec.it
  11. 11. Usefullinks • https://github.com/CodeSeven/KoLite - asyncCommand, activity, dirtyFlag • http://www.knockmeout.net - knockout tutorial • https://github.com/ericmbarnard/Knockout-Validation - knockout validationMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  12. 12. Source ControlMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  13. 13. Source Control • TFS • SVN • Git • MercurialMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  14. 14. SVN Compatible successor to the widely used Concurrent Versions System (CVS): • Versioning of directories • Atomic commits • Metadata versioning • Abstraction from the network layerMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  15. 15. Git + Dramatic increase in operation speed + Cheap branch operations + Full history tree available offline + Distributed, peer-to-peer model - Learning curve for those used to SVN - Not optimal for single developers - Limited Windows support compared to LinuxMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  16. 16. Mercurial+ Easier to learn than Git+ Better documentation+ Distributed model- No merging of two parents- Extension-based rather than scriptability- Less out of the box powerMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  17. 17. Useful links • http://biz30.timedoctor.com/git-mecurial-and-cvs- comparison-of-svn-software/ - git vs mercurial vs cvs • http://blogs.atlassian.com/2012/02/mercurial-vs-git- why-mercurial/ - command line git, mercurial • http://betterexplained.com/articles/intro-to-distributed- version-control-illustrated/ - Intro to Distributed Version Control • https://github.com/ - github • http://codeplex.com/ - codeplex • https://bitbucket.org/ - bitbuket • http://code.google.com/intl/it/ - google codeMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  18. 18. Contacts Email: moretto.carlo@outlook.com Website: www.morettocarlo.eu EESTEC: ts.eestec.itMoretto Carlo – www.morettocarlo.eu ts.eestec.it
  1. A particular slide catching your eye?

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

×