What is a Software Framework
A software framework provides a level of abstraction in writing application code relevant to an environment.
Although this may sound like a mouthful, it’s quite simple when you start to unpack it.
As a result software extensions often build on the noted environment, by adding some level of abstraction and addressing this repetitiveness. This essentially allows developers to start building with the assumption that some lower-level requirements have already been fulfilled by the extension.
Frameworks are software extensions that we add to our application, generally to provide a level of simplification to creating a coding outcome that might otherwise be cumbersome or not even possible to achieve without the extension.
What is Vue
Vue is licensed under the permissive MIT license, with very few restrictions and a reasonable degree of licensing compatibility. You are therefore free to download, modify and redistribute the codebase. As well as utilize a combination of copyright and copyleft licencing for commercial or non-commercial usage.
You do not need to download and include the Vue source code in your program in order to use Vue. The Vue gitHub repository is an uncompiled version of the Vue source code that is primarily for the purposes of maintaining Vue, itself. We will discuss, in more detail, how to include and utilize Vue in your projects a little later.
Supported Paradigms and Architectural Patterns
Amongst, the solutions Vue provides for application development is a multi-paradigmatic approach that builds on the Model-View-View-Model (MVVM) architectural pattern (but not strictly) and combines familiar concepts of Object Orientation Programming (OOP) such as an emphasis on data encapsulation.
Vue is often described as fulfilling the purposes of the “View” within in the Model View Controller (MVC) programming paradigm. Although this may be true, it does not fully describe one of Vue’s most powerful features known as it’s reactivity system which when utilized tends to better describe Vue as following an MVVM architectural pattern.
Primarily MVC and MVVM are intended to decouple an application’s presentation layer from its functionality layer. In other words, we can use Vue to separate the design of our application, at it’s most basic, into two components that being,
- What the user sees and interacts with from
- what happens in the background after a user interacts with the application’s interface (or presentation layer).
The difference between MVC and MVVM becomes apparent in the emphasis that is placed on this separation in the former, and how this separation is maintained. As such, a developer utilizing the MVC approach will define how the presentation (View) and functionality (Model) layers interface and subsequently update each other.
The Vue approach differentiates in that there is an inherent link between the Model and the View. Updating the model, updates the view and updating the view updates the model. This is largely attributed to what is know as Vue’s reactivity system. Although Vue’s reactivity system will maintain the relationship between the Model and View and update both in realtime accordingly, it is, however, worth noting that there will remain aspects of presentation that need to be updated by the application’s codebase, and not inherently through the reactivity system.
When this is applicable largely depends on matching user expectations and can, for example, be as simple as explicitly adding the code that removes text from an HTML text input field after a user has typed in a value then hit the Enter key. In other words, the data entered into the text input field can effectively be captured within Vue’s functionality and work matching a developer’s expectations however the same data might persist within the User Interface this might not match user expectations. Of course, more complex examples of decoupling and reconciling data within the Model and View exist and would require an in-depth look at User Experience (UX) and User Interfaces (UI).