Now we'll round off our study of Vue by giving you a list of resources that you can use to go further in your learning, plus some other useful tips.
|Objective:||To learn where to go to find further information on Vue, to continue your learning.|
Here’s where you should go to learn more about Vue:
- Vue Docs — The main Vue site. Contains comprehensive documentation, including examples, cookbooks, and reference material. This is the best place to start learning Vue in depth.
- Vue Github Repo — The Vue code itself. This is where you can report issues and/or contribute directly to the Vue codebase. Studying the Vue source code can help you better understand how the framework works, and write better code.
- Vue Forum — The official forum for getting help with Vue.
- Vue CLI Docs — Documentation for the Vue CLI. This contains information on customizing and extending the output you are generating via the CLI.
- NuxtJS — NuxtJS is a Server-Side Vue Framework, with some architectural opinions that can be useful to creating maintainable applications, even if you don’t use any of the Server Side Rendering features it provides. This site provides detailed documentation on using NuxtJS.
- Vue Mastery — A paid education platform that specializes in Vue, including some free lessons.
- Vue School — Another paid education platform specializing in Vue.
Building and publishing your Vue app
The Vue CLI also provides us with tools for preparing our app for publishing to the web. You can do this like so:
- If your local server is still running, end it by pressing Ctrl + C in the terminal.
- Next, run the
npm run build(or
yarn build) in the console.
This will create a new
dist directory containing all of your production ready files. To publish your site to the web, copy the contents of this folder to your hosting environment.
Note: The Vue CLI docs also include a specific guide on how to publish your app to many of the common hosting platforms.
Vue 3 is a major release of the framework with a lot of major changes. It went into active beta in April, 2020. The biggest change is a new Composition API that works as an alternative to the current property-based API. In this new API, a single
setup() function is used on the component. Only what you return from this function is available in your
<template>s. You are required to be explicit about "reactive" properties when using this API. Vue handles this for you using the Options API. This makes the new API typically considered a more advanced use case.
There are also a handful of other changes, including a change in how Apps are initialized in Vue. To read more about the changes involved with Vue 3, refer to this article by Vue School which goes over most of the major changes in Vue 3.
In this module
- Introduction to client-side frameworks
- Framework main features
- Getting started with Vue
- Creating our first Vue component
- Rendering a list of Vue components
- Adding a new todo form: Vue events, methods, and models
- Styling Vue components with CSS
- Using Vue computed properties
- Vue conditional rendering: editing existing todos
- Focus management with Vue refs
- Vue resources