- [Instructor] Unlike React and Angular,
Vue.js gives you two ways of working with the framework.
Now first, you can use a simple script tag in your HTML.
So if you go here,
to the Get Started link on the main website,
and you'll scroll down a little bit,
you'll be able to see the links that you can use.
There's a development version of a script tag
that you can include in your HTML,
and then there is a production version,
which is optimized for speed.
There is another way of installing,
and that is to use the Vue CLI, or Command Line Interface.
Now that is something that you can install
using a terminal application,
and it essentially automates the installation process
when you want to create a full application.
The script tag is fine if all you're doing
is including Vue in an existing project.
But typically when you want to create a full application,
you use something like the CLI.
And a CLI is how you install things like Angular and React.
So because in this course,
I'm comparing how Vue compares to those frameworks,
I'm going to use the CLI.
If you want to learn how to use Vue without the CLI,
then do a search for Sue Essential Training in our library,
and you'll see a good example of using the CLI,
as well as the script version.
Now in order to work with this CLI,
you do need to have some requirements pre-installed.
You'll need a copy of Node.js,
which you can get from this URL,
as well as a copy of Git installed,
which you can get at this URL.
Now part of the Git installation offers you the ability
to install something called Git Bash.
It lets you run Linux-style commands.
So I suggest that, if you're on a PC,
you install that as well.
Once you've installed both of those,
you're going to need to run a terminal.
Now I'm going to use something called Hyper,
which you can get at hyper.io.
I'm on a Mac, but you can also use the Mac Terminal
or Git Bash if you're on a PC.
The first thing to do is to install the CLI.
I'm going to make sure that I'm on the desktop,
so I'll do a cd ~/Desktop here.
And then I'm going to run the mpm install -g @vue/cli.
This is going to install the Vue CLI globally,
which makes it available
to any application in your machine.
Once the CLI is installed,
let's go ahead and clear that out.
To create an application,
I'm going to issue the vue create command,
and then give it a name of a directory
that I'm going to use for my project.
I'm going to call mine vue-interface.
Now if you're on a PC,
you're going to need a slightly different version of this.
The reason is that this command will be interactive
and the bash terminal isn't interactive by default,
so you'll need to add wimpty and then vue.cmd
and then the rest of the command right here.
But we're on a Mac so we can just run vue create
and name of the folder.
So, let's go ahead and hit return.
Now this is going to give you a series of options,
and that's why we had to run the
wimpty command on the PC.
You can see that I've done a few different projects.
Your list will be a bit shorter.
You can hit the arrows to move down
to the different options.
I'm just going to use the default.
You'll notice that once you go through a
manually select features option,
you'll be able to save your option
for use in future projects,
and that's why you see these two extra ones on my machine.
So, I'm just going to hit default,
and this going to create and folder
and create a default application for you.
So once that's done,
notice that it's telling you at the end
that you need to change the directory
to the folder that you created,
and then you can run the mpm run serve command.
So let's do that,
cd vue-interface
and then mpm run serve,
This is going to start the development server,
and it's going to do that by creating a server
at the localhost:8080.
You can type that into your browser,
and this is the sample application
that you get when you install Vue.js with the Vue CLI.
We'll dig into how the folder looks
that was created by the Vue CLI in the next video.