Interested in learning Vue but having trouble getting started?
We'll teach you how it all works - for free.
Over the next 30 days, we'll walk through everything you need to know to work with Vue. From the very beginning through topics like the Vue Instance, Components, and even Testing.
Over the next 30 days, we’re going to walk through everything you need to know to get started with the Vue framework. From the very beginning through topics like the Vue Instance, Components, and even Testing.
Now that we know how to instantiate a Vue application with the Vue instance, let's take a deeper look into how the data property of a Vue instance helps enable reactivity.
In yesterday’s article, we’ve come to understand how data behaves reactively in Vue. Today, we’re going to spend a little more time discussing this behavior since it plays an especially important role in how we build applications in Vue.
The last article was a little heavy on discussion. In today's article, we’ll dive into more code examples by addressing some important native Vue directives.
Today we're going to work through how the v-for directive can be used to dynamically render a list of elements based on a data source.
In yesterday’s article, we discussed the v-for directive and its role in helping display lists of elements. Today, we’ll spend a little time taking a look at the v-model directive and its ability to create two-way data binding.
Today’s article is going to introduce the Vue Devtools - a browser extension tool built to help debug Vue applications.
Today, we'll take a look at the computed property of a Vue instance and see how it differs from using a standard instance method.
Yesterday, we discussed how methods and computed properties work within a Vue instance. Today, we’ll briefly discuss another instance property called watchers (or sometimes known as the watch property).
Today, we're going to talk a bit about how an instance lives in an application. That is, we'll talk about the Vue instance’s lifecycle.
In today's session, we'll be building our first global Vue component.
Today, we'll discuss how props can help us pass data from parent components down to child components.
Yesterday, we saw how props can be used to pass data downwards from parent to child. Today, we'll see how custom events can facilitate communication in the opposite direction - from child to parent.
Today, we'll cover some interesting points that govern the use of Vue components such as the ability to locally register components, the requirement to having the component
data property always be a function, and the restriction to using a single root template.
Today, we'll be taking a look at some of the different ways we can declare the template/markup of a component.
Today, we'll discuss one of Vue's most useful features in helping build large scale Vue applications - Single File Components.
Today, we're going to discuss Vue's official development tool in helping build and scaffold Webpack bundled Vue applications rapidly.
Today's session will be the first of a series of articles discussing different methods to managing application wide data. We'll begin by reintroducing props and custom events before taking a look at how a global EventBus can facilitate application wide communication.
Yesterday, we gathered an understanding of how a global EventBus can use its events interface to have isolated components communicate with one another. Today, we’ll see how a Simple Global Store can be a more useful approach to handling state management.
Handling data inside large client-side applications is a complex task. Today we're looking at a one method of handling complex data proposed by Facebook called the Flux Architecture.
With the knowledge of the Flux pattern and Vuex, let's integrate Vuex onto a Vue application to build on top of the things we've learned using a simple global store.
The majority of large-scale applications we tend to create will usually have multiple views be kept in different routes. Today, we'll discuss client-side routing and set up the starting point of the routing application we'll build.
With our application scaffold established in the last article, let's use Vue's official client-side routing library, Vue Router, to enable routing in our application.
Test suites are an upfront investment that pay dividends over the lifetime of a system. Today, we'll introduce the topic of testing and discuss the different types of tests we can write.
Yesterday, we discussed the importance of testing and some of the different types of unit testing libraries/suites that exist. Today, we'll begin to see unit testing in action.
Today, we'll start creating unit tests by looking at a few features of our application, thinking about where the edge cases are and what we assume will happen with the component.
Today, we'll look at Vue’s official testing library called Vue Test Utils that makes testing fun and relatively easy.
In today's article, we'll take a brief look at some of the cool features Vue 3.0 is expected to bring when it arrives.
What is this?
This course is a series of articles which teach you how to use Vue from the ground up. The series provides a step-by-step process you can use to learn Vue from an empty folder to a Webpack-bundled Vue app.
What if I get stuck?
Just send us an email and we'll be happy to help you get unstuck.
Who wrote this?
We're the authors of the Fullstack Vue Book.
Join us on our 30-day journey in Vue. Join thousands of other professional Vue developers and learn one of the most powerful web application development frameworks available today.