Vagrant setup

tudip-logo

Tudip

24 July 2019

Vagrant is a tool for building and managing virtual machine environments in a single workflow. It is easy to configure and easy to use. For development purposes, if the vagrantfile is already created then you just need to run ‘vagrant up’ and everything will be configured and installed and ready to use.

Vagrant setup

1. Install VirtualBox

2. Now VirtualBox is installed on your machine, install the latest version of the Vagrant for your current operating system.

3. Create a folder in which you will be placing your project.
4. Open the terminal and go in the project directory and run the following commands

  • vagrant init hashicorp/precise64
  • By this command vagrant file will be created in the directory. You will need to run the ‘vagrant up’ command.
  • By this command, vagrant will see if the ‘hashicorp/precise64’ box is installed on your machine or not.
  • If it is not installed, then this command will install this box and will create the:
    • SSH Address
    • SSH Username
    • SSH auth method

Project setup

1. Create a project directory and go in that directory in the terminal.
2. Run the ‘vagrant init’ command.

  • This command will place the VagrantFile in your project directory.
  • The purpose of VagrantFile is TwoFold:
    • Mark the root directory of your project. Many of the configuration options are relative to this root directory.
    • Describe the kind of machine and resources you need to run your project, as well as what software to install and how to access it.
  • You can run the ‘vagrant up’ command in the pre-existing directory to set up Vagrant for an existing project.
  • Now, if you have already installed the box you need to update the VagrantFile with the following content.
    Vagrant.configure("2") do |config|
    config.vm.box = "hashicorp/precise64"
    end
  • The ‘hashicarp/precise64’ must match the name you used to add the box above. This is how the vagrant will know which box to use.
  • You may specify an explicit version of the box by specifying ‘config.vm.box_version’ for example:
    Vagrant.configure("2") do |config|
    config.vm.box = "hashicorp/precise64"
    config.vm.box_version = "1.1.0"
    End
  • You may also specify the URL to a box directly using ‘config.vm.box_url’:
    Vagrant.configure("2") do |config|
    config.vm.box = "hashicorp/precise64"
    config.vm.box_url = "http://files.vagrantup.com/precise64.box"
    End

3. Up and SSH

  • It is time to boot your first vagrant environment. Run the following command from your terminal: vagrant up
  • This command will finish in less than a minute and you will have a virtual machine running Ubuntu.
  • You will not be able to see it though since vagrant runs the virtual machine without UI.
  • To prove that it is running, you can SSH into the machine through: vagrant ssh
  • This command will place you in a full-fledged SSH session. Go ahead and interact with the machine.
  • You can terminate the session using ‘Ctrl + D’ or ‘logout’ command.

4. virtual box configuration:

  • Add the following content in your VagrantFile
    config.vm.provider "virtualbox" do |vb|
    vb.memory = "1024"
    End

5. Synced folders

  • When you do ‘vagrant ssh’ you are not in the ‘/vagrant’ directory but in /home/vagrant directory.
  • Now run ‘ls /vagrant’.
  • You will see the VagrantFile in the directory. This is the same VagrantFile that is on your actual host machine.

6. Provisioning

  • Add the following contents in the Vagrantfile
    # provisioning
    config.vm.provision "shell", privileged: false, inline: <<-SHELL sudo apt-get update # developer packages installation sudo apt-get install build-essential curl vim -y > /dev/null
    # git installation
    sudo apt-get install git -y > /dev/null
    # node and nvm installation
    curl -o- https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash
    source ~/.nvm/nvm.sh
    nvm install node
    nvm alias default node
    cd /vagrant
    # installing project dependencies
    npm install
    SHELL
    end
  • The provision line is new and tells Vagrant to use the shell provisioner to set up the machine with bootstrap.sh file.
  • After everything is configured, just run the ‘vagrant up’ to create your machine and Vagrant will automatically provision it.

7. Networking

  • Now we have a web server up and running with the ability to modify files from the host and have them automatically synced to the guest.
  • However, accessing the web pages from the terminal from inside the machine is not very satisfying.
  • We will use Vagrant’s networking features to give us additional options for accessing the machine from our host machine.
    • Port forwarding
      • One option is to use port forwarding which allows you to specify ports on the guest machine to share via a port on the host machine
      • Let’s set up a forwarded port so we can access Apache in our guest by simply editing the VagrantFile
    • Use private network
      • The IP address you add here will be used to access the project on the host machine.
        Vagrant.configure("2") do |config|
        config.vm.box = "hashicorp/precise64"
        config.vm.network "forwarded_port", guest: 80, host: 8080
        config.vm.network : private_network, ip: “10.10.10.63”
        end
      • Run ‘vagrant reload’ or ‘vagrant up’ so these changes can take effect.
      • Then you need to update the webpack.config.js file for adding the port on which you will be running the project. For example,
        devServer: {
        port: 8882,
        historyApiFallback: true,
        inline: true,
        }
      • Once you have updated the webpack.config.js file, you need to add the port and IP address in the start or dev script of your project’s package.json. It should look like,
        "start/dev“: "webpack-dev-server --env development --host 0.0.0.0 --public 10.10.10.63:8882 --watch-poll",

8. Run the project on a virtual machine

  • Now, run the ‘vagrant up’ command.
  • The, run ‘vagrant ssh’ command. You will get the screen like this means you are in virtual machine now.

Vagrant-Setup

  • Then go into ‘/vagrant’ directory.
  • Now, if you do ‘npm start’ or ‘npm run dev’ here, your project will be running on ‘http://10.10.10.63:8882’.
  • You can access your project now on your local machine’s browser which was automatically set up by Vagrant.

For more information about the vagrant setup, please refer the link – https://www.vagrantup.com/intro/getting-started/index.html

Request a quote