Thinking in terms of components (Views)

We've talked about the monolithic JavaScript code bases that plague most of the Web, which that are code bases that are impossible to test. And the best way not to fall into this trap is by coding the application driven by tests.

Consider the mockup interface of our Investment Tracker application:

This shows the Investment Tracker application's mockup interface

How would we go about implementing it? It is easy to see that this application has two different responsibilities:

• One responsibility is to add an investment

• Another responsibility is to list the added investments

So, we could start by breaking this interface into two different components. To better describe them, we are going to borrow a concept from MVC frameworks, such as Backbone.js, and call them Views.

So, here it is, at the top level of the interface, with two base components:

• NewInvestmentView: This will be responsible for creating new investments

• InvestmentListView: This is going to be a list...