For Vue-specific coding style and pattern recommendations please see the official Vue style guide.
Some questions you may want to ask yourself:
If you find yourself answering, “Yes,” to those questions, Vue may be a great fit for your project or component! If not, a more traditional build may be the best.
While we tend to build large-scale applications with React at 10up, Vue is a great tool for building small to medium sized features.
There are several ways to include Vue.js in your project. We will take a look at the different methods and explain when to use them.
The standard way to include Vue in your application is by using a
Npm is the recommended installation method when building npm-enabled and ES6+ applications with Vue. This method of installation gives you more fine-grained control over the dependencies being used via the
package.json file. Keeping dependencies in the
package.json file also serves as a quick reference to any engineers during a project onboarding period.
The Vue CLI provides us a quick way to setup and scaffold a Vue project. It sets up a modern frontend workflow providing hot reloading, minification, asset management, module bundling, linting and a development server to test your application under realistic circumstances. It works with zero configuration from your part as everything is already set up in the vue-CLI templates.
Although we probably won’t use Vue in this context, as we tend to build larger applications at 10up using React, it is still important to know that it does exist and the patterns can help guide you in creating a meaningful structure for your project.
There are three main styles of templating built into the Vue framework:
Which of these three options you utilize will heavily depend on the type of project you’re building.