Why Vue.js?
Getting started with a new JavaScript framework can be a difficult task to approach. To help with this, we will take a look at the value that Vue.js brings to development and create our first app with Vue.
- PDF / 326,723 Bytes
- 8 Pages / 504 x 720 pts Page_size
- 44 Downloads / 163 Views
Why Vue.js? Getting started with a new JavaScript framework can be a difficult task to approach. To help with this, we will take a look at the value that Vue.js brings to development and create our first app with Vue.
The Value of Vue.js Getting started creating a Single Page Application (SPA) can be a difficult task. There are a lot of choices that have to be made up front with most frameworks. Some frameworks make those choices for you when you decide to go with them. Others require you to make those choices. Either way, those choices probably need to be decided at the beginning of a project, since changing them later in the development process will incur a greater cost. It’s a lot to process and decide, all before you do any “real” work that can you can show to your boss/client/stakeholder that they will perceive as valuable. What’s a developer to do? One option is to choose a preset way to build your SPA that someone else had some luck with or go with what is recommended by the framework creators. Another option to is to go with a framework that lets you start small and make choices for your app as the need arises. And you can do that with Vue.js. Vue.js is called a progressive framework by its creators. This is because it allows you to start building your app with minimal effort as the core Vue.js library focuses only on the view layer. Over time as the requirements grow, you can adapt additional libraries for functionality. The idea of adding features to the app you are creating over time doesn’t limit the use of more complex development tools. Need to add a router? No problem; use the Vue-Router, a third-party option, or roll your own (see Chapter 11). Looking to manage in memory state? You can use a Plain Old JavaScript Object, a store pattern, or the Vue.js specific Vuex (see Chapter 6). By now you get the idea. © Brett Nelson 2018 B. Nelson, Getting to Know Vue.js, https://doi.org/10.1007/978-1-4842-3781-6_1
1
Chapter 1
Why Vue.js?
This all probably makes Vue.js sound complicated, but it’s not. In fact, one of the reasons that developers often say they choose Vue.js is because of how easy it is to get started12. With little overhead, a developer can get to work and produce results without the added complexity of other popular frameworks. And this ease of beginning doesn’t limit the complexity of the app you can build, as Vue.js can scale in complexity with your project’s requirements.
Our First Vue.js Instance One of the best parts of using Vue.js is that it requires little overhead to get started. Add a script tag referencing the Content Delivery Network (CDN) for the library to your page and you are ready to get going! Let’s take a quick look at what it requires to get started. We will start with a pretty empty HTML file, shown in Listing 1-1.
Listing 1-1. Empty HTML File
Getting to Know Vue.js
To take this empty HTML file to a working Vue.js app, we need to add three things: •
An HTML element where we “mount” our app
•
A
{{ propertyName }}
3
Chapter 1
Why Vue.js?
Now we
Data Loading...
