Creating a Module for the ContactsApp Sub-Application

Explore how to refactor your Marionette application by structuring it into modular sub-applications, including forming a ContactsApp module with a List sub-module. Understand moving views, resolving naming conflicts, and creating a controller to coordinate models, collections, and views for listing contacts effectively.

We'll cover the following...

Moving our views
Creating a controller
Try it yourself

So far, we’ve created a separate module for our entities, and we’ve moved our Contact model and collection there.

If we think about it, the entities are general concepts that will be used throughout the ContactManager app. However, our main ContactManager app could contain several sub-applications, such as:

An app that manages contact information (create new contacts, edit their information, etc.)
An app that manages contact groups (friends, coworkers, etc.) and also manages the contacts that belong to them
An app that gives information about the ContactManager app (copyright info, compatibility, etc.)

We’ll create a module to contain our ContactsApp, which will, in turn, contain a ContactsApp.List sub-module to list our contacts. This List sub-module will contain our controller to manage the listing of the contacts and will also ...

1.Introduction

2.Displaying a Static View

3.Displaying a Model

4.Displaying a Collection of Models

5.Structuring Code with Modules

6.Creating Tables in Views

7.Events, Bubbling, and TriggerMethod

8.Displaying Contacts in Dedicated Views

9.Implementing Routing

10.Dealing with Persisted Data

11.Handling Data Latency

12.Managing Forms

13.Displaying a Modal Window

14.Complex Views and Base Views

15.Managing Dialogs with a Dedicated Region

16.Filtering Contacts

17.Addition to Sub-Application

18.Conclusion

19.Appendix: Using Web Storage for Persistence

20.Appendix: Creating a FilteredCollection

Creating a Module for the ContactsApp Sub-Application