Launch A Todo App Using Laravel Homestead

Our goal? To launch a simple to-do app using Laravel Homestead on macOS. ✅️

I created a simple to-do app in Laravel 5.3 using Homestead as part of an engineering internship screening for In the end, nothing really came of it. 💀️

The source code can be found at full process for setting up Laravel 5.3 is pretty tedious so I created my own tutorial which you can find below.

Our goal? To launch a simple to-do app using Laravel Homestead on macOS.

This is QUITE a tedious process (if you ask me), but I’ll try to condense it into a simple 30 step process (LOL). 😂This is how the completed app looks like.

You will need…

  • Basic Terminal Knowledge I will be referring to a lot of commands you’ll have to type in.

Installation Process

  1. Download Vagrant
  2. Download VirtualBox
  3. Clone or download my sample to-do app
  4. Option 1. Use a GitHub client like Tower
  5. Option 2. git clone //
  6. Make note of the file path for this repo by using pwd, i.e. ~/Dropbox/github/ds-todos
  7. cd ~ && vagrant box laravel/homestead
  8. They will ask for the provider so we are going to enter in 1 since we are using VirtualBox
  9. cd ~ && mkdir Code We will need this folder later
  10. Clone down Laravel Homestead and install it in a folder called Homestead usingcd ~ && git clone // Homestead
  11. Initialize Homestead using cd Homestead && bash
  12. While still in ~/Homestead folder, sudo nano /private/etc/hosts to edit the hosts file and add on these two lines (refer below)
  13. Create a key to authorize ssh using cd ~/Homestead && ssh-keygen -t rsa -b 4096
  14. Hit Enter twice (you don’t have to enter a password)
  15. Time to start up Vagrant using cd ~/Homestead && vagrant up and enter password when asked
  16. Edit the Homestead.yaml file to configure locations of code using nano ~/.homestead/Homestead.yaml and make thefolder and sites sections look like this (refer below) ❗ Anytime you edit this Homestead.yaml file, you have to perform the next 3 steps in order for it to work, so let’s go ahead and do those now.
  17. Stop vagrant temporarily by using vagrant halt
  18. Reload yaml configurations by using vagrant reload --provision and enter password when asked
  19. While still in ~/Homestead folder, use vagrant ssh to enter into your Vagrant setup
  20. Enter into your Code folder you created earlier and then your ds-todos app using cd ~/Code/ds-todos
  21. While you’re in your ds-todos folder, use composer install to install the necessary dependencies for the to-do app
  22. You will also need to configure your environment for ds-todos by creating an .env file and typing the following in (refer below) using touch .env && nano .env
  23. Use php artisan migrate to migrate the app data over
  24. Then use php artisan db:seed to seed the database
  25. Finally, use php artisan key:generate to generate an app key for security purposes
  26. At this point, you should be able to head over to // in your browser and marvel at being able to set this all up! 🎉

Optional - Compiling SASS

If you want to compile SASS files, you will first have to install all npm dependencies using npm i. Then just perform a gulp watch and you’re good to go. Anytime you edit the SASS files, gulp will check it and compile it down to CSS.


YAML Config

❗ Since my ds-todos code is located in ~Dropbox/github/ds-todos, that’s where I map it to. However, you probably have it located elsewhere so make sure to get the right file path of that app using pwd in Terminal.folders:

- map: ~/Code

to: /home/vagrant/Code

type: "nfs"

- map: ~/Dropbox/github/ds-todos

to: /home/vagrant/Code/ds-todos

type: "nfs"


- map:

to: /home/vagrant/Code/Laravel/public

- map:

to: /home/vagrant/Code/ds-todos/public

[Environment Setup]






















Subscribe to my newsletter Today

In my newsletter, I share personal and career learnings, advice, collaboration opportunities, and more.