How to Javascript in 2015...

nadeesha.me 

@ncthis

Or, how to get taken seriously as a JS developer...

Concepts
Tools
Practice

Data Immutability

Why?

• Improved change tracking (no Object.observe())
• Better performance *
• Easier reasoning about code. (strings vs objects)

Uni-directional

data-flow

MVC in theory

http://code.tutsplus.com/tutorials/intro-to-the-react-framework--net-35660

MVC in practice

https://keyholesoftware.com/2015/05/11/lessons-from-facebook-reactflux/

An alternative

https://keyholesoftware.com/2015/05/11/lessons-from-facebook-reactflux/

Functional, Reactive Programming

Let's look at some code...

Libraries over monolithic framewoks

Inversion of control

In most cases...

But for the rest of us?

Let's talk tools.

Immutable.js

RxJs

Webpack with npm scripts

React.js/Flux

Falcor/GraphQL

Immutable.js

No defensive copying

Better performance in Javascript VMs

RxJS

Create "streams" from multiple sequences in your app.

Subscribe to to the streams.

Perform actions. 

Example

Build Systems

Grunt 

Gulp

NPM scripts

+

Webpack

React.js/Flux

React.js: Your views are immutable, and updated reactively.

Flux: Your data flows one way. We'll help you connect your views to your data.

GraphQL

GET /users/nadeesha

{
   user(id: 'nadeesha') {
     id,
     name,
     profilePicture(size: 50)  {
       uri,
       width,
       height
     }
   }
}

In REST: Perform this operation, at this HTTP endpoint, and give me the result. My client will validate, cache, filter, [....] it.

GraphQL: This is the data my client needs.

In real life

(Look up Relay)

Isomorphic Rendering