![]() In my opinion, the greatest benefit of Marionette is that it empowers you to easily build modular Backbone applications.Īs previously stated, Marionette offers modules, which are our go-to objects for segregating the different pieces of our application. It offers a sensible boilerplate that supplies several view types, an application router, modules, an event aggregator, and many other objects. Marionette is an awesome library created by Derick Bailey to eliminate a host of the pains associated with building applications in vanilla Backbone. However, countless other people have faced a similar issue, and someone has probably already built a robust solution that solves the problem. I advocate trying it out yourself and stretching your current understanding and abilities. Well, this leaves us with rolling our own solution, which isn’t a terrible idea. If you try to do this all with a single view, I’m fairly certain you’ll violate the single responsibilty principle. You would need both business logic and the boilerplate code to facilitate adding and removing to the DOM (without creating memory leaks). Yes, we have views which are reusable, but we would need to add several methods to a view to make it like a component. However, when it comes to Backbone.js, we don’t necessarily have our go-to object to handle components. You can even use them inside other directives in a way that would make Xzibit proud (fine, old joke, shame on me). ![]() Define your own HTML element and then just plop it into your application views where you need it. The beauty of directives is how easily reusable they are. You may also define a controller and scope for the directive to handle related business logic and state, respectively. Directives allow you to create custom HTML elements via a handful of syntactical options. When it comes to JavaScript frameworks, Angular overtly offers components in the form of directives. A component is akin to a sub-application, with its own views, models, state, business logic, and even sub-components. I’ve already hinted at my understanding of a component. Now, for the purpose of this article, we should have a shared idea of what a component is. Components GOOD, monolithic applications BAD. Then, all you need to do is configure each instance of the datagrid with its data. If you need to build a few datagrids with the same style but different data, then you should abstract that out into a reusable datagrid component. In case you don’t know, the DRY principle stands for “Don’t Repeat Yourself.” You will waste extra time in the long run if you repeatedly write the same code, especially when you need to go back to refactor or add another feature. Suddenly, you’re traveling down the recursive Twilight Zone of refactoring ad nauseam and other smart-people Latin phrases.Ĭomponents also encourage the DRY principle. Discovering everything that breaks usually involves a trial-and-error process of integration tests with your eyeballs. Altering a function here breaks a function there, which then requires this other function to handle another parameter. Adding a single feature could require changing code in several places. Applications with tightly coupled modules or a lack of division of work will become incredibly more difficult to maintain and amend with newer features. Each piece of an application, including components, should have one responsibility and not heavily depend on the other pieces. ![]() Building and Maintaining Applications with ComponentsĬomponents are critical to scaleable applications because they encourage separation of concerns. It functions entirely on its own, but together with other components it makes up a dashboard page. For example, imagine the cliché stock widget that displays stock symbols along with their current prices. ![]() Components are the objects that encapsulate some specific functionality and typically operate independently of the application as a whole. More specifically, I am interested in how I can build reusable components within the framework. Despite the framework I find myself in, I immediately gravitate toward whatever modular patterns that framework facilitates. I really like other frameworks such as Angular.js too. Modularity and Components in MarionetteĪ lot of my JavaScript work involves using Backbone.js and Marionette.js for the front-end.Building and Maintaining Applications with Components. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |