Getting Started with Vue.js
4.4 (20 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
86 students enrolled

Getting Started with Vue.js

Learn the fundamental Vuejs concepts
4.4 (20 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
86 students enrolled
Last updated 2/2017
English [Auto-generated]
Current price: $69.99 Original price: $99.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 2.5 hours on-demand video
  • 2 articles
  • 2 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Utilize Vuejs in applications
  • Learn the fundamental Vuejs concepts
  • Learn what can be done with Vuejs and how to apply it to your applications
  • Learn about Single Page Applciations and how to make them
  • Learn how to build fully functional application from scratch
  • Learn about creating Vue instances and how to connect them to your page view
Course content
Expand all 33 lectures 02:28:45
+ Introduction to the Course
1 lecture 02:58

Vuejs is a great starting point to learning more complex JavaScript Frameworks, or even as a simple easy to implement solution to save time when developing your applications.   

Download source code here

Preview 02:58
+ Introduction to using Vue.js Data Handling
11 lectures 57:05

 How to add Vue js into your website and how Vuejs works

Preview 03:09

 LifeCycle of the Vue instance

Vuejs LifeCycle hooks

Binding Data to Form fields, v-model

Data Binding with Form fields

Rendering out an array as a list of items, v-for directive

Render List array to page view

 Sorting and applying filters to object arrays

Apply Filters

Creating values on the fly, Tracks data values as dependencies and automatically syncs them

Computed Values

setup HTML for shopping cart, Add items arrays and data

Vue project Setup: Vue Shopping Cart project Setup

Demonstrate filters, lists and computed values

Vue project Setup: Vue Shopping Cart computed values and filters
Section Summary
+ Getting Creative with Vue.js
13 lectures 56:06

Methods for more functionality, Event listeners made easy - custom directives, Components - make your own custom elements, Global components vs instance components 

Section Introduction

v-if  v-else  V-for v-bind

Directives Vuejs

Global method and instance methods

Introduction to methods

v-on:click (events) ,Blur,change,select,mouseover, click, load, submit, Bind to function when event is triggered

Event listeners

Ability to easily bind classes on boolean values

Binding Classes

Creating templates that can be used and reused,Passing data into a template

Components Template Building

 Decoupling data from the data object and using isolated values for each component

Isolated scopes

 add item and sort

Project Building Shopping Cart Sort Order Methods

Methods click events to update cart and quantities, Moving content between arrays

Project Building Add Methods use Inventory Data

 Update array

Remove from array

If else elements

Dynamic inputs to array

Add dynamic items to Shopping cart

Clear shopping cart

Bind Classes Clear Shopping Cart add Discounts

Binding data to the page view

 Dynamically data updates
 Using new values within logic of page
 Hide show display as needed
 How we can generate value dynamically
 Use filters and methods
 Project completion

Section Summary
+ Doing more with Vue.js
5 lectures 25:44

 Pull data in from an external source, Binding img paths to data, Binding urls to data, Built in helpers $remove,

Section Introduction

 Using plugin libraries for added functionality

Use Vue Resource Libraries Get API data

Creating empty data arrays to hold data 

Data and arrays

Build a data sorting app in minutes full of functionality 

Mini Project Use API data

Lots of resources that are ready to go,Easy data binding and sorting large amounts of data

Section Summary
+ Course Summary
2 lectures 06:38

Download source files here

Closing message from instructor
+ Bonus Material
1 lecture 00:13
Bonus Lecture: Course Discounts
  • Students should have some HTML, and JavaScript experience. Also other code languages help as well, but not necessary.
  • Computer access and a desire to learn are the others.

The technology world is awash with web developers. While this means there are plenty of new and exciting developments and creations emerging on a regular basis, it also has a downside. For an employer, it can be difficult to find a really, REALLY good web developer. Knowing a few different web app frameworks and libraries is guaranteed to get you noticed, and one of the most beneficial choices around is Vue.js. This course will teach you everything you need to know to get up and running.

Take your Web Development Skills to the Next Level

  • Learn fundamental Vue.js concepts
  • Utilize Vue.js in your web applications
  • Build a fully functioning application from scratch with Vue.js
  • Create instances, learn about single page apps, and more
  •  Upgrade your web development skills

Everything You Need to Know About Vue.js

This Vue.js online course teaches you the core skills you need to know to utilize reactive components in your web applications. Each aspect is taught in a hands-on manner, so you’ll not only get to grips with the fundamentals, but have a crystal clear idea of how to use them in your own projects.

The only requirements for this course are a working knowledge of HTML and JavaScript, access to a computer, and a desire to learn! After a very brief introduction you’ll get started with data handling. You’ll add data structures, learn about data binding, get to grips with render listing and computed values and more.

Once you’ve gotten a handle on the basics you’ll move on to the really fun stuff. Binding classes, isolated scopes, advanced shopping cart functionality and various other cool features are covered. Then it’s on to even more interesting elements like resource libraries, data and arrays.

By the end of this course you’ll know how to implement functionality that is expected in all top-class, modern applications. You’ll be using Vue.js as a solution to everyday web development tasks to make your apps easier and more dynamic. And lastly, you’ll know every step to take to start creating applications from the ground up with Vue.js.

What is Vue.js?

To put it as simply as possible, Vue.js is an advanced web app framework architecture. Think of it as another Laravel PHP or React.js. It provides reactive components for modern web interfaces. Basically, it’s a simple but powerful library for building cool web stuff. Any web developer who knows their stuff will know Vue.js, so if you’re not one of them now is time to get up to speed. 

Who this course is for:
  • Web developers and designers looking to learn Vuejs
  • Developers who want to implement reactive technology to web applications
  • Developers and designers who are looking for newer ways to create easy web interfaces