Book Image

Learning JavaScriptMVC

By : Wojciech Bednarski
Book Image

Learning JavaScriptMVC

By: Wojciech Bednarski

Overview of this book

<p>JavaScriptMVC is a client-side, JavaScript framework that builds maintainable, error-free, lightweight applications as quickly as possible. As it does not depend on server components, it can be combined with any web service interface and server-side language.<br /><br />"Learning JavaScriptMVC" will guide you through all the framework aspects and show you how to build small- to mid-size well-structured and documented client-side applications you will love to work on.<br /><br />This book starts from JavaScriptMVC installation and all its components are explained with practical examples. It finishes with an example of building a web application. You will learn what the JavaScriptMVC framework is, how to install it, and how to use it efficiently.<br /><br />This book will guide you on how to build a sample application from scratch, test its codebase using unit testing, as well as test the whole application using functional testing, document it, and deploy the same. After reading Learning JavaScriptMVC you will learn how to install the framework and create a well-structured, documented and maintainable client-side application.</p>
Table of Contents (13 chapters)

$.Controller


The $.Controller plugin helps to create an organized, memory leak-free JavaScript code.

A great example of how to use $.Controller is the Todos controller from Chapter 1, Getting Started with JavaScriptMVC, is as follows:

$.Controller('Todos', {
            // init method is called when new instance is created
            'init': function (element, options) {
                this.element.html('todos.ejs', Todo.findAll());
            },

            // add event listener to strong element on click
            'li strong click': function (el, e) {
                // trigger custom event
                el.trigger('selected', el.closest('li').model());

                // log current model to the console
                console.log('li strong click', el.closest('.todo').model());
            },

            // add event listener to em element on click
            'li .destroy click': function (el, e) {
                // call destroy on the model to prevent memoryleaking
      ...