The document discusses MVC frameworks in JavaScript and covers topics like why use MVC, Backbone and Spine fundamentals, Backbone views, models, collections, routers and history, as well as tips and tricks for using Backbone including bootstrapping data, handling nested models, custom ajax requests, and testing with Jasmine. It provides code examples and explanations of concepts to illustrate how to build applications using the MVC pattern with Backbone.js.
Dr. Strangelove or: How I learned to stop worrying and love HTML, CSS and Jav...RobotDeathSquad
In this session we'll take a hands on approach to building reusable and scaleable front end code. We walk through building a modern web application UI using microformats, gracefully degrading CSS3 and Javascript closures. Finally, we'll see how the same code can be used throughout an application with little modification.
*
Dsc02922_small Mike Hostetler 4.07
CEO at appendTo, LLC
4 talks
Description:
This talk will be a quick but thorough introduction to the jQuery Javascript Library. If you have zero experience with jQuery, this is the talk to start with. We will begin with a brief overview of jQuery and its history. We'll then introduce basic jQuery concepts and principles. To wrap up the session, we'll build a basic jQuery plugin.
This talk will be composed mainly of live coding, showing off examples of how to work with jQuery.
The content of this talk will be quite a bit different from the jQuery training offered prior to the conference. Because of the available time, the training will explore jQuery concepts in great depth, while this talk will cover them briefly.
This presentation covers some jQuery basics, as well as some general concepts you should understand about jQuery. You will find other tips and tricks sprinkled throughout before the live coding session starts.
The code from the live coding session is available here: https://github.com/dcneiner/jQuery-Bling and covers far more advanced topics than the slide portion of this presentation.
Dr. Strangelove or: How I learned to stop worrying and love HTML, CSS and Jav...RobotDeathSquad
In this session we'll take a hands on approach to building reusable and scaleable front end code. We walk through building a modern web application UI using microformats, gracefully degrading CSS3 and Javascript closures. Finally, we'll see how the same code can be used throughout an application with little modification.
*
Dsc02922_small Mike Hostetler 4.07
CEO at appendTo, LLC
4 talks
Description:
This talk will be a quick but thorough introduction to the jQuery Javascript Library. If you have zero experience with jQuery, this is the talk to start with. We will begin with a brief overview of jQuery and its history. We'll then introduce basic jQuery concepts and principles. To wrap up the session, we'll build a basic jQuery plugin.
This talk will be composed mainly of live coding, showing off examples of how to work with jQuery.
The content of this talk will be quite a bit different from the jQuery training offered prior to the conference. Because of the available time, the training will explore jQuery concepts in great depth, while this talk will cover them briefly.
This presentation covers some jQuery basics, as well as some general concepts you should understand about jQuery. You will find other tips and tricks sprinkled throughout before the live coding session starts.
The code from the live coding session is available here: https://github.com/dcneiner/jQuery-Bling and covers far more advanced topics than the slide portion of this presentation.
jQuery is a JavaScript library which allows you to develop solutions with less code, in less time. You can build interactive prototypes for your prospective clients, or take an existing solution and add new dynamic behaviour with little effort.
We will see how jQuery can be used to quickly and concisely apply JavaScript behaviour to your web app. It will cover selectors, Ajax, DOM manipulation and more. The aim: to produce lean unobtrusive JavaScript with jQuery.
Last year, AOL adopted a new content strategy and has positioned itself as a premier destination for original content. Core to this strategy is having reusable, highly efficient and optimized common code and experiences at scale, which is where jQuery comes in. Check in with Dave Artz to see how jQuery has helped his front-end standards team tackle unique challenges like optimizing 3rd party widget performance, overriding plugin functionality, and managing dependencies and updates across 100+ sites spanning multiple back-end platforms.
Things you should know about jQuery JavaScript library. A JavaScript library designed to hide painful cross-browser compatibility issues while presenting a solid, usable, API.
PrimeFaces, JavaServer Faces icin gelistirllen ve dunya capinda populer olan zengin bir arayuz kutuphanesidir. Bu sunumda PrimeFaces Bilesenleri, Mobil, Ajax Push, Tema Destegi gibi modullerin yani sira PrimeFaces ekibinin gelistirdigi yeni jQuery javascript kutuphanesi PrimeUI'da tanitilmaktadir.
The world of JavaScript client-side frameworks is overflowing with contenders vying for the crown, but which one do you choose for your next project? Which one has what it takes?
In this talk we’ll look at the “Big 3”, AngularJS, Ember.js, and Backbone.js. We’ll compare them head to head, toe to toe. We’ll look at the pros and cons of each one. How do they handle form bindings? Talking to APIs? Code organization? Routing? Etc?
Who’ll come out victorious in this battle of the JavaScript frameworks, or will we all just come out bloodied and bruised on the other side? Guess we’ll find out!
This session will introduce the audience to the workflow capabilities available in Alfresco. We will discuss the workflow UI in Share and the configuration options available. A working example will also show how custom Activiti workflows can be implemented, deployed, configured and monitored.
This session will introduce the audience to the workflow capabilities available in Alfresco. We will discuss the workflow UI in Share and the configuration options available. A working example will also show how custom Activiti workflows can be implemented, deployed, configured and monitored.
Get ready to dive into the details of Alfresco’s advanced workflow engine with members of the core Activiti team. Everything you ever wanted to know about Activiti but were afraid to ask. Stand back, because code will be slung. You may want to attend the Introduction to Advanced Workflows session before this one if you are new to the advanced workflow engine.
Javascript and first-class citizenry: require.js & node.js
Javascript on web pages is ubiquitous and its problems are legendary. Javascript, seen as a second-class code citizen, is usually hacked together even by seasoned developers. New libraries (jQuery, prototype, backbone, knockout, underscore) and runtime tools (firebug, jasmine) look like they solve many problems - and they do. But they still leave poorly written code as just that. One key problem is that all javascript code lives globally and this results in poorly managed, tested and delivered code.
In this session, I will illustrate that we can treat javascript as a first-class citizen using with require.js and node.js: it can be modular, encapsulated and easily unit tested and added to continuous integration cycle. The dependencies between javascript modules can also be managed and packaged just like in C# and Java. In the end, we can resolve many javascript difficulties at compile time rather than waiting until runtime.
jQuery is a JavaScript library which allows you to develop solutions with less code, in less time. You can build interactive prototypes for your prospective clients, or take an existing solution and add new dynamic behaviour with little effort.
We will see how jQuery can be used to quickly and concisely apply JavaScript behaviour to your web app. It will cover selectors, Ajax, DOM manipulation and more. The aim: to produce lean unobtrusive JavaScript with jQuery.
Last year, AOL adopted a new content strategy and has positioned itself as a premier destination for original content. Core to this strategy is having reusable, highly efficient and optimized common code and experiences at scale, which is where jQuery comes in. Check in with Dave Artz to see how jQuery has helped his front-end standards team tackle unique challenges like optimizing 3rd party widget performance, overriding plugin functionality, and managing dependencies and updates across 100+ sites spanning multiple back-end platforms.
Things you should know about jQuery JavaScript library. A JavaScript library designed to hide painful cross-browser compatibility issues while presenting a solid, usable, API.
PrimeFaces, JavaServer Faces icin gelistirllen ve dunya capinda populer olan zengin bir arayuz kutuphanesidir. Bu sunumda PrimeFaces Bilesenleri, Mobil, Ajax Push, Tema Destegi gibi modullerin yani sira PrimeFaces ekibinin gelistirdigi yeni jQuery javascript kutuphanesi PrimeUI'da tanitilmaktadir.
The world of JavaScript client-side frameworks is overflowing with contenders vying for the crown, but which one do you choose for your next project? Which one has what it takes?
In this talk we’ll look at the “Big 3”, AngularJS, Ember.js, and Backbone.js. We’ll compare them head to head, toe to toe. We’ll look at the pros and cons of each one. How do they handle form bindings? Talking to APIs? Code organization? Routing? Etc?
Who’ll come out victorious in this battle of the JavaScript frameworks, or will we all just come out bloodied and bruised on the other side? Guess we’ll find out!
This session will introduce the audience to the workflow capabilities available in Alfresco. We will discuss the workflow UI in Share and the configuration options available. A working example will also show how custom Activiti workflows can be implemented, deployed, configured and monitored.
This session will introduce the audience to the workflow capabilities available in Alfresco. We will discuss the workflow UI in Share and the configuration options available. A working example will also show how custom Activiti workflows can be implemented, deployed, configured and monitored.
Get ready to dive into the details of Alfresco’s advanced workflow engine with members of the core Activiti team. Everything you ever wanted to know about Activiti but were afraid to ask. Stand back, because code will be slung. You may want to attend the Introduction to Advanced Workflows session before this one if you are new to the advanced workflow engine.
Javascript and first-class citizenry: require.js & node.js
Javascript on web pages is ubiquitous and its problems are legendary. Javascript, seen as a second-class code citizen, is usually hacked together even by seasoned developers. New libraries (jQuery, prototype, backbone, knockout, underscore) and runtime tools (firebug, jasmine) look like they solve many problems - and they do. But they still leave poorly written code as just that. One key problem is that all javascript code lives globally and this results in poorly managed, tested and delivered code.
In this session, I will illustrate that we can treat javascript as a first-class citizen using with require.js and node.js: it can be modular, encapsulated and easily unit tested and added to continuous integration cycle. The dependencies between javascript modules can also be managed and packaged just like in C# and Java. In the end, we can resolve many javascript difficulties at compile time rather than waiting until runtime.
Backbone.js — Introduction to client-side JavaScript MVCpootsbook
Using Backbone.js to move state to the client-side and the benefits of using a JavaScript MVC framework.
Delivered at SuperMondays, Newcastle upon Tyne, on 26th September 2011.
Turn your spaghetti code into ravioli with JavaScript modulesjerryorr
JavaScript is the language that powers the interactive web of the future. But as our web applications become larger and more complex, we begin to strain the old paradigm of throwing a bunch of JavaScript functions into a few files. Complex dependencies, tight coupling, and global state can turn our code into a huge plate of spaghetti. Though browsers do not natively support JavaScript modules, there are many tools that can help us to write clean, modular JavaScript.
In this session, we will explore the benefits of writing modular JavaScript. We will also take a deep dive into specific JavaScript module systems, such as Browserify, RequireJS, and the module standards that are coming in ES6.
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012crokitta
APEX& jQuery Mobile
Binnenkort zal Oracle versie de lang aangekondigde upgrade naar release 4.2 van Oracle Application Express beschikbaar maken. Een van de meest besproken nieuwe features die voor dit nieuwe release zijn aangekondigd is de integratie van het jQuery Mobile framework. Met de integratie van dit framework zal het mogelijk worden om met APEX applicaties te ontwikkelen, die geschikt zijn voor mobiele toestellen.
Wat is en hoe werkt jQuery Mobile en wat betekend dit voor het ontwikkelen in APEX. Dat zijn de onderwerpen die de presentatie aan bod komen. En waarom wachten tot het release van 4.2. Het is namelijk nu al mogelijk om jQuery Mobile in APEX te integreren en gebruiken. Hoe, wordt in een demo getoond. Deze sessie is waarschijnlijk de enige waarin u gevraagd zal worden om uw mobile telefoon aan te laten staan.
Session highlighting and demonstrating approaches to common challenges in modern portlet development. Topics include AJAX in JSR-168 and JSR-286 portlets, CSS and Javascript toolkits, security, and optimization of front-end resources. This session was presented at the Jasig Spring 2010 conference in San Diego, CA by Jennifer Bourey.
Velocity EU 2014 — Offline-first web appsandrewsmatt
The upcoming HTML5 feature known as Service Worker is set to turn the web on its head, enabling websites to run without an internet connection and to load quickly even when the connection is bad.
But with that evolutionary step, web applications need to become more complex, and to handle the fact that their source code may remain on a device for much longer than a single session. Without the safety net of starting fresh every time the user hits a link, considerations such as memory management, data consistency, encapsulation and backwards compatibility now come into play. Front-end developers are suddenly fully-fledged software engineers! The web page is our app platform, and the browser our runtime.
The fastest byte is a byte not sent, so the fastest website is the website that doesn’t need to load anything. Step with me into a world of good hacks, unbeatable performance and smart, multivariate responsiveness, drawn from experience building web apps for the FT and The Economist.
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Key Trends Shaping the Future of Infrastructure.pdfCheryl Hung
Keynote at DIGIT West Expo, Glasgow on 29 May 2024.
Cheryl Hung, ochery.com
Sr Director, Infrastructure Ecosystem, Arm.
The key trends across hardware, cloud and open-source; exploring how these areas are likely to mature and develop over the short and long-term, and then considering how organisations can position themselves to adapt and thrive.
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...DanBrown980551
Do you want to learn how to model and simulate an electrical network from scratch in under an hour?
Then welcome to this PowSyBl workshop, hosted by Rte, the French Transmission System Operator (TSO)!
During the webinar, you will discover the PowSyBl ecosystem as well as handle and study an electrical network through an interactive Python notebook.
PowSyBl is an open source project hosted by LF Energy, which offers a comprehensive set of features for electrical grid modelling and simulation. Among other advanced features, PowSyBl provides:
- A fully editable and extendable library for grid component modelling;
- Visualization tools to display your network;
- Grid simulation tools, such as power flows, security analyses (with or without remedial actions) and sensitivity analyses;
The framework is mostly written in Java, with a Python binding so that Python developers can access PowSyBl functionalities as well.
What you will learn during the webinar:
- For beginners: discover PowSyBl's functionalities through a quick general presentation and the notebook, without needing any expert coding skills;
- For advanced developers: master the skills to efficiently apply PowSyBl functionalities to your real-world scenarios.
Accelerate your Kubernetes clusters with Varnish CachingThijs Feryn
A presentation about the usage and availability of Varnish on Kubernetes. This talk explores the capabilities of Varnish caching and shows how to use the Varnish Helm chart to deploy it to Kubernetes.
This presentation was delivered at K8SUG Singapore. See https://feryn.eu/presentations/accelerate-your-kubernetes-clusters-with-varnish-caching-k8sug-singapore-28-2024 for more details.
DevOps and Testing slides at DASA ConnectKari Kakkonen
My and Rik Marselis slides at 30.5.2024 DASA Connect conference. We discuss about what is testing, then what is agile testing and finally what is Testing in DevOps. Finally we had lovely workshop with the participants trying to find out different ways to think about quality and testing in different parts of the DevOps infinity loop.
Elevating Tactical DDD Patterns Through Object CalisthenicsDorra BARTAGUIZ
After immersing yourself in the blue book and its red counterpart, attending DDD-focused conferences, and applying tactical patterns, you're left with a crucial question: How do I ensure my design is effective? Tactical patterns within Domain-Driven Design (DDD) serve as guiding principles for creating clear and manageable domain models. However, achieving success with these patterns requires additional guidance. Interestingly, we've observed that a set of constraints initially designed for training purposes remarkably aligns with effective pattern implementation, offering a more ‘mechanical’ approach. Let's explore together how Object Calisthenics can elevate the design of your tactical DDD patterns, offering concrete help for those venturing into DDD for the first time!
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
Generating a custom Ruby SDK for your web service or Rails API using Smithyg2nightmarescribd
Have you ever wanted a Ruby client API to communicate with your web service? Smithy is a protocol-agnostic language for defining services and SDKs. Smithy Ruby is an implementation of Smithy that generates a Ruby SDK using a Smithy model. In this talk, we will explore Smithy and Smithy Ruby to learn how to generate custom feature-rich SDKs that can communicate with any web service, such as a Rails JSON API.
15. MVC Benefits
Structure
Classes, inheritance, common patterns.
Modular
Communication via events, lousily coupled & testable components.
Common services
Back and forward history, clients-side url resources, utilities.
Persistence layers
RESTful sync, local storage, web sockets and more.
Community
Patterns, mixins, conferences and more.
16. Challenges
• Going out of the box
• Nested models
• Complex ajax requests
• Understanding the limitations
• Its still hard
18. To mvc, or not to mvc ?
Use for one page apps
Use for complex client-side UIs & crud
Use not only for UI sugar
Use not for just rendering HTML
Use not for inflexible backends
30. Events
• Consists of on, off & trigger methods
• All Backbone modules can trigger events
• All Javascript object can be extended with
the Backbone events module
31. Event example
Event triggered inside User class when name is changed
this.trigger("change:name", "Mr Hilmarsson");
Bind to a name change event
user.on("change:name", function( name ) {
! alert( "Name changed to " + name );
});
40. Views
• Bridge the gap between the HTML and
models
• DOM element ( this.el ) represents the
context
• Uses jQuery / Zepto / ender for DOM
manipulation
• Listens for UI events & model events
• Use render method to create view
46. Router & History
• Provides a way to map URL resources
• Enables client-side back & forward
navigation
• Use Hash-change by default. Supports
push state ( History API )
47. Be Careful!
• Its stateful !
• Its not easy
• Don’t set navigate trigger to true
49. History - example
Start listening for hash-change events
// Start the history
Backbone.history.start();
Use html5 history API
// Start the history
Backbone.history.start({pushState: true});
52. Tips & Tricks
• Tip #1 - Bootstrapping data
• Tip #2 - Async user interfaces
• Tip #3 - Nested models
• Tip #4 - Custom ajax requests
• Tip #5 - Zombies to heaven
• Tip #6 - The toolbox
• Tip #7 - Test, test, test
• Tip #8 - CoffeeScript
• Tip #9 - Remember the basics
• Tip #10 - Bonus points
54. Bootstrapping data
• Using fetch extends waiting time
• Possible to bootstrap the most important
data when the page is rendered
• No loading spinners !
55. Bootstrapping Data
The code
// Current user
APP.currentUser = new APP.Models.User(<%= @current_user.to_json.html_safe %>);
// Notes
APP.notes.reset(<%= @notes.to_json.html_safe %>);
After render
// Current user
APP.currentUser = new APP.Models.User({
id: 1, username: "hjortureh",
name: "Hjortur Hilmarsson",
avatar: "avatar.gif"
});
// Notes
APP.notes.reset([
{ id: 1, text: "Note 1" },
{ id: 1, text: "Note 2" },
{ id: 1, text: "Note 3" }
]);
59. Importance of speed
Amazon
100 ms of extra load time caused a 1% drop in
sales (source: Greg Linden, Amazon).
Google
500 ms of extra load time caused 20% fewer
searches (source: Marrissa Mayer, Google).
Yahoo!
400 ms of extra load time caused a 5–9%
increase in the number of people who clicked
“back” before the page even loaded (source:
Nicole Sullivan, Yahoo!).
37 Signals - Basecamp
500 ms increase in speed on basecamp.com
resulted in 5% improvement in conversion rate.
61. Async user interfaces
• Models are optimistic by default
• UI is updated before server response
• Use cid as a unique identifier on the client
• No loading spinners !
65. Nested models
• Nested models are common
• No official way of doing it
• Overwrite parse after ajax request
• Overwrite toJSON before ajax request
• Backbone-relational mixin could help
72. Zombies to heaven
• Its not enough to remove views from the
DOM
• Events must be released so you don’t have
zombies walking around
73. Zombies to heaven
// same as this.$el.remove();
this.remove();
// remove all models bindings
// made by this view
this.model.off( null, null, this );
// unbind events that are
// set on this view
this.off();
75. Use the toolbox
• Underscore has some wonderful methods
• isFunction, isObject, isString, isNumber,
isDate & more.
• Underscore: http://
documentcloud.github.com/underscore
76. Underscore
Line 865 from the Backbone.js code.
// Underscore methods that we want to implement on the Collection.
var methods = ['forEach', 'each', 'map', 'reduce', 'reduceRight', 'find',
'detect', 'filter', 'select', 'reject', 'every', 'all', 'some', 'any',
'include', 'contains', 'invoke', 'max', 'min', 'sortBy', 'sortedIndex',
'toArray', 'size', 'first', 'initial', 'rest', 'last', 'without', 'indexOf',
'shuffle', 'lastIndexOf', 'isEmpty', 'groupBy'];
// Mix in each Underscore method as a proxy to `Collection#models`.
_.each(methods, function(method) {
Collection.prototype[method] = function() {
return _[method].apply(_, [this.models].concat(_.toArray(arguments)));
};
});
78. Testing
• Recommend Jasmine for testing
• Recommend Sinon to fake the server
• jQuery-jasmine to test views
• Use setDomLibrary method to fake jQuery
79. Jasmine with fake server & spy
it('Should sync correctly', function () {
// mockup data
var note = new APP.Models.Note({ text: "Buy some eggs" });
// fake server
this.server = sinon.fakeServer.create();
// fake response
this.server.respondWith( "POST", "/notes",
[ 200,
{"Content-Type": "application/json"},
'{ "id": 1, "text": "Remember the milk" }' ]
);
// spy on sync event
var spy = sinon.spy();
note.on("sync", spy );
// save model
note.save();
// server repsonse
this.server.respond();
// assert
expect( spy ).toHaveBeenCalledOnce();
expect( spy ).toHaveBeenCalledWith( note );
expect( note.get("text") ).toEqual( "Remember the milk" );
// restore fake server
this.server.restore();
});
82. CoffeeScript
• Advanced programing language
• Compiles to javascript
• Same creator of Backbone and
CoffeeScript
• Integrates well with Backbone
83. Coffee Script example
Extending Backbone module
class TodoList extends Backbone.View
Double arrow to bind to the context
Use @ instead of this
Last line is the return value, returns this
_.bindAll( this, 'render' )
render: =>
@$el.html( @template( @.model.toJSON() ))
@
Need to call super on parent constructors
initialize: ->
! super
85. The basics
• The basics still apply with MVC in place
• Minimize ajax requests
• Keep your views thin & models fat
• Understanding Javascript is the key