The Architecture of Gap Inc's SCMS

SCMS PO is an application that helps Gap Inc. manage purchase orders. The architecture of the application is well liked by its development team and thus makes a good expositional architecture for a system with a rich javascript front end working with a back-end serving json. Interesting design features include using knockout.js form of the Presentation Model pattern, a javascript validator running on both client and server, encapsulating data access with repositories, using MongoDB as an application database, and the testing portfolio.

23 April 2013

This page is a fallback page for the proper infodeck.

There are couple of reasons why you are seeing this page

The following is dump of the text in the deck to help search engines perform indexing


The Architecture of Gap Inc.'s SCMS PO System

SCMS PO is an application that helps Gap Inc. manage purchase orders. The architecture of the application is well liked by its development team and thus makes a good expositional architecture for a system with a rich javascript front end working with a back-end serving json. Interesting design features include using knockout.js form of the Presentation Model pattern, a javascript validator running on both client and server, encapsulating data access with repositories, using MongoDB as an application database, and the testing portfolio.

Martin Fowler

2013-04-23 11:02 EDT

Hints for using this deck

My thanks to Ryan Murray, Steve Hill, Andrew Kiellor, Tobias Clemson, and Daniel Siwiec for providing information for this infodeck. Thanks to Gap Inc. for supporting us in writing about this project.


SCMS PO is an internal enterprise application

I have altered some names used by modules within SCMS PO to be consistent with the usual vocabulary I use on this website.


SCMS PO Architecture

The client is a single-page javascript application that communicates with the java server using JSON documents.

The javascript uses the Presentation Model pattern (aka MVVM) to provide a clear base for the HTML presentation. SCMS PO uses knockout.js to do data binding between the presentation model and the HTML DOM.

A javascript Repository handles all communication with the server. Its clients can ask for an order with an ID and get back the appropriate object.

Data validation uses the same javascript code on both client and server. The validation code is organized as a simple Production Rule System.

The server exposes a Resource API, providing json to clients, defined by Spring's http bindings. On receiving an http message it initiates service objects to coordinate business logic and data logistics.

There are a variety of data sources for the application, including a MongoDB data store for application data, external systems, integration databases, and a couple of CSV files. All access to these sources are through gateway objects with interfaces in domain object terms.


Knockout has been an effective way to use the Presentation Model pattern to organize the UI logic.Presentation Model

(aka MVVM)

Represent the state and behavior of the presentation independently of the GUI controls used in the interface.

more ...

The presentation model (aka view model) arranges information from the underlying model to provide a simple interface for the view. As such it hides the structure of the underlying model from the view.

All information, including display information for the view, is held in the presentation model in such a way as to make a simple mapping for the view elements

The UI controls (view) use a simple synchronization mechanism between their state and the presentation model's state. Knockout provides a data-binding mechanism between the the HTML DOM and the presentation model to do this.

The javascript code can be tested by tests that use the presentation model. These tests can be run outside of the browser and are thus easier and faster to run. (SCMS PO's test bed runs about 900 jasmine specs in around 70 seconds.) Such tests won't catch errors in the data binding, but these have not been a problem in practice.

Domain logic is kept in separate javascript modules. This ensures that presentational issues, and code using jquery and the DOM, is well separated from domain logic which makes both easier to work with.


A js repository manages communication with the server
Validation is done by a general purpose javascript validation engine
Rules are javascript functions that can be organized into rulesets
The SCMS PO team has differing views about implementing the rules in javascriptFor Against
The web service uses a Resource API
Resource-oriented service acts as an excellent test point
Access to Data Sources is done through GatewaysGateway

An object that encapsulates access to an external system or resource       (more…)

(AES stands for An External System)


MongoDB has worked well for application persistence

While NoSQL databases are often touted for their performance characteristics, in this case the driving force was ease of development and deployment


SCMS PO has modest concurrency needs, thus uses simple mechanisms
The test portfolio has many styles of test

In terms of lines of test code (an admittedly crude measure), 50% of tests are unit tests, 30% are service tests, and 10% are user journey tests