HTML and CSS Reference
In-Depth Information
8
Chapter
JavaScript: Models,
Views, and Controllers
There are many development design patterns. One that has really stood out and
can be applied across almost all programming languages is MVC (Model View
Controller). MVC breaks down how an application should be structured into
various layers of responsibility.
It's all too common that we, as developers, jump in and begin working on a
project with no real understanding of how that project will eventually evolve or
grow. For example, we pull in data from external resources using Ajax and then
simply render that data in HTML in the same code block. What happens when
you then want to use that same HTML in another part of your application, but for
a different purpose, using a different data source? The quickest thing to do is to
copy and paste that code and alter the variables.
As you begin to bolt more features onto your application in this manner, it might
begin to look more like you've built your application out of jelly and chocolate
rather than code and logic. As tasty as that sounds, the point is that if you build
your application from the beginning in such a way that it can easily be built upon
later, it will cost less time and money to add more features in the future.
Part of making this happen is to standardize or create rules for certain aspects
of your application. This can make the code longer to write, but easier to work
with by developers other than yourself. By adopting MVC, you adopt a method
of working that's easy to understand. Your skill level shouldn't dictate whether
you should learn about design patterns. You may implement MVC any way that
you like; however, this chapter will show you only one way of working with MVC
in JavaScript.
Through this chapter, you will learn how to create and implement your own MVC
framework. You will learn what models are and how they act as the lifeblood of
