slides.md

title: Why use a framework? output: index.html theme: theme controls: false logo: theme/logo.png

--

Use a framework?

Why... or why not...

And how to find one

--

Brought to you by

-- presenter

David Luecke

• daffl
• @daffl

-- presenter

Eric Kryski

• ekryski
• @ekryski
• erickryski.com

-- sponsors

Our Sponsors

--

Last Month

Optimizing Your JS Workflow

• Modules and build tools
  • AMD + RequireJS
  • Component + Makefiles
  • Browserify
  • Grunt & Gulp
• Using Gulp + Browserify

--

Today...

• A web developer story
  • JavaScript & jQuery
  • Modularity
  • Build tools
  • Package management
  • Framework
  • Testing
• InstaCan

--

Once upon a time...

... there was a site with some plain JavaScript and maybe some jQuery plugins.

--

<script src="https://gist.github.com/daffl/43749f8e99a8e000a277.js"></script>

--

Modularity

Split your appication into individual files. We talk more about it in our jQuery 202 session (slides, video).

var APP = (function() {
	// Do stuff
	var privateVariable = 'Hello ',
		sayHi = function(name) {
			return privateVariable + name;
		};
	// Return API
	return {
		init : function() { /* ... */ },
		hi : sayHi
	}
})();

--

Build tools

Build tools make your life way easier and allow you to dev faster. We talk more about them in our Optimize Your Workflow session (slides).

--

Package management

A framework is only as good as its package manager. Thankfully we have good ones! We also talk about them in our Optimize Your Workflow session (slides).

--

Library vs. Framework

Library:

• A set of tools to reduce overhead and improve application consistency by providing reusable pieces of code.
• A library provides useful tools for a specific purpose (functions, helper libs) so you can build your app your way.

Framework:

• A more opinionated set of tools to reduce overhead and improve application consistency by providing reusable pieces of code.
• Inversion of control. Frameworks specify how you should write your app.

--

Model View Controller

Separates the representation of information from the user's interaction with it

• Controller: Updates both, view and model according to user interaction
• Model: The data/domain model
• View: Creates a representation of the model

--

TodoMVC

The same Todo application implemented using MV* concepts in most of the popular JavaScript MV* frameworks of today.

• Backbone
• CanJS
• Ember
• AngularJS
• React
• KnockoutJS
• ...

--

You Don't Always Need a Framework

• Web Pages
• Widgets
• Components
• Small applications

--

What To Look For

Choosing a framework is like getting married. You'll probably be stuck with it for a loooong time. Choose wisely:

• Flexibility & Modularity
• Maintenance & Development Activity
• Community Support
• How big is your app actually going to get?
• Do you REALLY need everything that it provides?
• Developer culture
• Learning Curve
• Code Size

--

Next Month

• Something awesome
• More awesomeness
• Even more awesome sauce