Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Lessons:10Length:51 minutes

Next lesson playing in 5 seconds


Free Preview: A Designer’s Introduction to Vue.js

Welcome to the Course

  • Overview
  • Transcript

Vue is a progressive framework for building user interfaces using HTML and JavaScript. In this short course aimed at designers, you will learn the basics of pulling data into your web pages using Vue’s simple templating syntax.

Learn Vue.js

Learn Vue.js with our complete Vue.js tutorial guide, whether you're a seasoned coder or a web designer looking to pick up new front-end development techniques.

1. Introduction

1.1 Welcome to the Course

Hello, and welcome to a designer's introduction to Vue.js. My name is Craig Campbell. And in this short course, I'm going to introduce you to a JavaScript Framework called Vue.js. Now, Vue is a very powerful, very versatile framework for building user interfaces, and as we'll discover in this course it's also very easy to learn. So as long as you've come to the table with a solid understanding of HTML, CSS and JavaScript, we should be good to go. So I wanna thank you for watching and we'll get started in the next lesson.

2. Vue.js: The Basics

2.1 What Is Vue.js?

Hello and welcome back. In this lesson, we're gonna talk very briefly about what the Vue.js framework is and how we can get started using it. Now, you can find the Vue.js website at vuejs.org, that's V-U-E-J-S .org. And you probably want to go ahead and bookmark this website, cuz you're gonna come back to it a lot, as you learning the Vue framework. It has a lot of helpful information including the full documentation for the framework. And once you get to the website, you can click on Get Started link to see some information on what we need to do to get started, of course. So Vue.js is a JavaScript framework that makes it really easy to bind data to your HTML. Now, this course is aimed towards designers, so we're not gonna get into a whole lot of detail about where that data is coming from. But we are gonna talk about how to use that data to build websites. So on this getting started page, if we scroll down just a little bit, you can see this script tag which has a CDN link for the Vue framework. And this CDN link is what we're gonna be using in this course. Now, there's also a CLI or command line interface that you can use with the Vue if you've got Node.js installed on your system. And that will allow you to build your own Vue projects locally using Node. But we're not gonna get into that in this course. We're just going to using, like I mentioned, this CDN link and moving forward from there. So in our next lesson, we're going to take a look at the sample HTML file that we're going to use as a starting point as we learn the Vue.js framework. So thank you for watching and I'll see you then.