Getting Started with Vagrant for Local Development: Lesson 10 of 20

Networking (vm.network): How to see inside and access the Box

Up Next

Folder Syncing (vm.synced_folder): How to code with and change the box

Autoplaying in 7 seconds!

Cancel

Networking (vm.network): How to see inside and access the Box

Accessing the Box

Now that we have turned on our box via vagrant up, let's go access it and see what's inside. Simply type:

vagrant ssh

We're not inside of the virtual box! Pretty neat. You can do whatever you want inside this VM as if you were SSH into a server.

But, what if we want to make it a web server...

Table of Contents

    Make it a Web Server

    Let's install apache! From inside the box, type:

    sudo apt-get install apache2

    This will start installing apache. If you're totally unfamiliar with the building process of a web server, this will obviously be new to you.

    We're going to walk through all these various steps to show what's going on. Truthfully, you don't need to be a pro at it. It will definitely be a great intro through to server building.

    Now we can see that it added the var/www/html/ folder with a standard index.html file from apache.

    Well, what if we want to see this file from our browser...

    Create a Forward Port

    Let's jump back over to our Vagrantfile. We're going to now "forward" the port for the web server to our computer. If you don't know anything ports or forwarding, it's fine. Just know we are adding a line of code that will connect our virtual machine box (called the guest) to our actual computer (called the host).

    Apache listens by default for web request from port 80. So let's take that port and forward / map it our laptop:

    config.vm.network "forwarded_port", guest: 80, host: 8080

    Now let's rerun the Vagrantfile with:

    vagrant reload --provision

    You could technically destroy and re-up it, but this method will be much quicker.

    After this runs, if we visit: localhost:8080 in our browser, we'll now see the Apache default file.

    We did it! We've built a dead-simple web server and connected it to our laptop.

    Other stuff

    This "network" stuff gets complicated. I'm in no way a network engineer but I'll try to highlight 3 differences on how you could have done the port fowarding.

    There's also a million different settings for this depending on how complex you want to make it beween private, public, and protocol.

    You really don't have to understand this entirely if you're only looking to get setup. I will highlight some examples of the configuration options to help you better understand this though.

    Port Forwarding

    The default easiest way. Technically this public though though. So any app or thing with access to port 8080 on your machine can access the VM. This is a little scary for security but not too scary.

    config.vm.network "forwarded_port", guest: 80, host: 8080

    Port Forwarding Limit Host IP

    A little bit more secure way to do this would be:

    config.vm.network "forwarded_port", guest: 80, host: 8080, host_ip: "127.0.0.1"

    So now the port is only accessible through the 127.0.0.1 IP address.

    Private Network with Specific IP

    If you don't want to use localhost and would prefer a private IP (don't even have to type host), you can do:

    config.vm.network "private_network", ip: "192.168.50.4"

    I would argue this is the best method and to follow this. This simulates a real server pretty closely.

    This also allows you to update your host file to point to the IP. For example:

    192.168.50.4 example.local www.example.local

    Now, you can develop with a "dev" domain!