How to Set up a Local Web Development Environment

In this post, we will go over how to set up a local web development environment. Before we begin, you will first want to download the following programs:

  • Visual Studio Code - a nice IDE that has a built-in terminal app making it easy for you to run command line operations. 
  • Virtualbox - a program that allows you to create virtual machines on your computer.
  • Vagrant - a lightweight tool that makes it easy for you to spin up a virtual machine (installs on VirtualBox).

Once you have successfully downloaded and installed these programs, you will then want to download Scotchbox. 

There are two ways to install Scotchbox; you can install it using git or you can go to Github, download the zip file, extract it and save it locally.

If you are not familiar with Git, no worries, it's actually quite easy. First, open up Visual Studio and toggle Terminal (Ctrl + `). There you should see a command line prompt that looks something like this:

Type the following command:

git clone https://github.com/scotch-io/scotch-box

For those of you interested, this command is telling the computer to initiate the git, run the clone command, and copy this file from GitHub onto your computer. Generally speaking, you can break down any command line action into the following pattern [computer initiate program] [program run this action] [using these parameters] in a bit you will see other commands and hopefully, you will notice they all follow a similar pattern. 

Once the files are on your computer, in terminal navigate into the folder using the command

 cd scotchbox 

(cd stands for change directories). Next, we will need to spin up scotchbox, to do so simply run this command

 vagrant up

This command initiates vagrant to build and provision the virtual machine via VirtualBox using the configurations provided by scotchbox. The entire process should take between 3 - 5 minutes depending on your internet connection. 

Afterwards, type the following IP address http://192.168.33.10 in your browser and you now have a working local environment! To add files, you simply need to add them to the scotchbox public folder to access them via the browser. If you would like to set up a custom domain open up terminal and type in the following:

sudo nano /etc/hosts 

This is your computer's host files where you can create your own custom route for your domain. 

Once done you can now use your custom domain name to point to the local environment. In a future post, we will go over how to set up Drupal and or Wordpress locally.

Testimonials

"Misha is the most kind and flexible web developer I've ever met. Easy going and always up for a challenge!" Kelsey B. - Video Creator & Social Influencer
"Working with Misha is always a great experience. He is goal oriented, fun and respectful with everyone." Andrew Y. - Consultant
"Misha has a great sense of design and direction when it comes to creating digital and marketing products." Nalini P. - Marketing Specialist