Skip to content

Demo UI's

kgrgreer edited this page Sep 26, 2014 · 2 revisions

A catalog of FOAM demos can be found here.

We've created several small FOAM apps which both help to demonstrate how to use FOAM, and to contrast the FOAM method of application development with that of other JS libraries.

  1. TodoMVC.com is a project which offers the same simple Todo application implemented using most of the popular JavaScript frameworks used today. Google technologies such as: Closure, Angular, Polymer, GWT, and Dart, are all represented.

For comparison, the FOAM implementation can be found at: https://github.com/foam-framework/foam/tree/master/apps/todo

(The FOAM Version is dramatically shorter than any other version. 13X smaller than Closure.)

  1. The Angular project has a nice 12-step tutorial showing how to create a Phone Catalog application using Angular. We've rewritten this app in FOAM for comparison and will write a similar style tutorial for FOAM.

The Angular source: https://github.com/angular/angular-phonecat/tree/master/app

The FOAM source:: https://code.google.com/p/foam-framework/source/browse/#git%2Fapps%2Fphonecat

  1. We've written a FOAM version of the Chrome calculator app. This application is interesting because, while FOAM typically excels at data-rich applications, primarily on the strength of the DAO interface and implementations, this application has no data other than the calculator history. But still, the FOAM JS code is three times smaller.

Original (jQuery) source: https://github.com/GoogleChrome/chrome-app-samples/tree/master/calculator

The FOAM source: https://code.google.com/p/foam-framework/source/browse/#git%2Fapps%2Fcalc

Clone this wiki locally