Este documento presenta una introducción a Knockout, una biblioteca JavaScript para el desarrollo de interfaces declarativas. Explica conceptos clave como ViewModels, observables y enlace de datos para actualizar dinámicamente el DOM. También cubre el uso de observables, iteración, eventos y plantillas con Knockout para crear interfaces reactivas.

1. Jesus Angulo
@jesulink2514
Series
somostechies.com
01. Primeros pasos con Knockout

2. ViewModelModel View
HTMLLógica
de
negocio
Knockout
(Observables)

3. <div>
Hola, <strong>Jesus Angulo</strong>
</div>
Declarativo

4. <div>
Hola,
<strong data-bind="text: name" />
</div>
Declarativo

5. <ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<ul>
Iterativo

6. <ul data-bind="foreach: items">
<li data-bind="text: name"></li>
<ul>
Iterativo

7. <input
type="button"
onclick="someJavaScript(thisObj)" />
Eventos

8. <input
type="button"
data-bind="click: modelFunction" />
Eventos

9. Demo: Developers y tareas

10. • ViewModels con valores simples son leídos una vez.
• ViewModels con observables obtienen actualizaciones.
ko.observable(value)
ko.observableArray([...])
ko.computed(function() { ... })
ko.applyBindings(viewModel)
Observables

11. data-bind=text:prop
data-bind=textInput:prop
data-bind=value:prop
data-bind=with:model
data-bind=foreach:array
data-bind=click:function
data-bind=attr:{atributo:observable}
data-bind

12. #KnockoutSeries
Gracias!
github.com/jesulink2514/KnockoutSeries
@jesulink2514
http://somostechies.com