# macOS setup for Vue

### Install macOS :P

### Install Homebrew

Open terminal and run the follow command to install the latest version of Homebrew. 
This will also install the XCode utils if you don't have them already installed.

`/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"`

### Install Git

`brew install git`

### Install Node Version Manager

Use the install script to install nvm. To do this, run the following in terminal.

`curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash`

### Add nvm to bash profile

To make use of the Node Version Manager through its `nvm` command, you need to add the following to your `~/.bash_profile` file.
Create a new file if it does not already exist.

```
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm
```

### Install Node

Run `nvm install node` in terminal. Once installed, you should be able to run both `node -v` and `npm -v` to see their versions.

### Install required node packages

In order to create (and use) Vue efficiently, we'll need some packages installed. You can use `npm i -g [package]`
(or `npm install --global`) to install a package to be used globally by your system.

For Vue, we need the Vue CLI (for creating our Vue boilerplates) and eslint (for JS linting) from npm. To install these, run
`npm i -g vue-cli eslint` in terminal.

### Create a test Vue app

In terminal, create and navigate to your workspace directory, and run `vue init webpack hello-vue` to create a new project named
`hello-vue`, using the webpack boilerplate. Step through the setup guide and edit any info as needed (or just press enter for
testing).

Next, navigate into your project with `cd hello-vue` and install the project's local dependencies by running
`npm install` (or `npm i`).

### Run the app

You should now be able to run the app by executing the command `npm run dev` - navigate to its running address in your web
browser and you should be greeted with the initial Vue app.