famo.us Framework

famo.us

Famo.us is a free, open source JavaScript framework that helps you create smooth, complex UIs for any screen

Vizelia bought by Schneider Electric in 2011

Yoobic is a "Mobile productivity App"
Yoobic simplifies short term logistic processes and transform logistic costs into a stream of revenues
Yoobic is leveraging crowdsourced workforce and harnessing geolocation technology

Do we really need to code for multiple platforms ?

“The biggest mistake we've made as a company is betting on HTML5 over native.”

Mark Zuckerberg - 2012

Mobile devices and HTML5 stacks have rapidly evolved

The render tree

Scene graph

Surface, Modifier, Transitionable

transitionables

famo.us makes use of CSS3’s Matrix3D transforms, which gives it its GPU-accelerated performance
requestAnimationFrame (60 FPS)
Agnostic output layer (DOM, WebGL, ...native?!)


var myView = new View();
var mySurface = new Surface();
mySurface.setContent("I'm a surface");
myView.add(mySurface);



  
    I'm {{data.bound}}

Notice how easy it is to databind!

Awesome work Zack Brown & David Graunke @thomastreet!

Since angular's scope hierarchy maps to famo.us's render tree hierarchy, this lets us write library directives that create famo.us's render tree components
This has turned out to be an excellent use of angular's directives to extend the vocabulary of HTML
famo.us/angular directives are essentially an HTML DSL for famo.us
It makes it extremely easy to integrate famo.us with any existing HTML or Angular apps.
It allows you to use Angular's data-binding within famo.us components.
It encourages a clean architectural separation of concerns (view layer.)
It allows you to use custom directives (pre-existing, third-party, or new ones) inside of your famo.us apps
And of course you get the rest of the benefits of angular, like testability, organization, and streamlined data management.

Download the starter kit

                        
http://code.famo.us/famous-angular/latest/famous-angular-starter-kit.zip

or install with Bower

                            
bower install famous-angular

or use a yeoman generator (https://www.npmjs.org/package/generator-mcfly)


yo mcfly

This is boooring... Show me the code

Let's play with the baby and see how easy it is to build a flickr like mobile app

and one more thing...