This is the very start of our journey creating a theme using Sage. Full disclosure – Im learning too! and thats why you should comment whenever you have a question or a better way of doing something. I have done a lot of research in each section and try to keep to best practices, so make sure to tell me when I don’t.

A few prerequisites – Local is easy enough to install, Composer is probably the trickiest to get working, make sure it’s installed globally (type “composer” in your terminal and see if you get “command not found”)

1. “Composer” installed globally
2. Local By Flywheel installed, and a new site setup.

Great, now we need to make the new site you just set up work with Bedrock. A good place to begin will be to install Bedrock. Our first step will be to navigate to the correct folder in the terminal. If you are like me, then this is always a pain, so let’s cheat. If you are running on a Mac, follow along if not then you will have to do some changes to work with Windows… I haven’t developed on a. windows machine so unfortunately, I cant be much help.

Go to your Local Site and click the small arrow next to the path. This will bring up the finder in the correct location.

Now, load up the terminal and type in “cd ” (note the space, this is important!)

cd 

You can now drag the “app” folder from the finder onto the terminal window and press enter, you will now be in the correct location in the terminal. See the video for an example.

As the terminal is now in the correct location copy and paste the following command:

composer create-project roots/bedrock

Awesome! if it begins downloading and installing things you are on your way – if you have an error you will likely now need to go and look into installing Composer globally. I will assume it all worked great!

Let’s do some cleanup, we can now go into the app/ folder in finder and you should see one folder called “bedrock” and another called “public” Let’s delete the public folder.

Now we need to load the folder up into Visual Studio in terminal type

cd ../

This will take us back to our root folder. We can now type

code .

And we should have VS code load the folder for us. This did not work as default for me, so if you have issues with VS not loading just open the folder as you usually would in VS Code, or see the accepted answer on StackOverflow to fix it! We will now need to edit a few files. Edit this file first :

app/bedrock/.env

At the top of the file add your username and password for the database, this should be the same as mine :

DB_NAME='local'
DB_USER='root'
DB_PASSWORD='root'

On line 14 you will also need to change the WP_HOME variable, mine is shown below, but use whatever is listed in Local :

WP_HOME='http://localhost:10008'

Almost done, one last file to change, and this will be in

conf/nginx/site.conf.hbs

on line 9 you will see :

    root   "{{root}}";

we need to get the correct path so go back to finder and navigate to the folder :

app/bedrock/web/

Now copy the path, watch this video for an easy way to do this.

Now head back to Local right-click the site name and click restart server. You may see some database errors in the Local database tab, these can now be ignored as everything should be working. The next step in our Workflow setup will be to Install Sage, check our next tutorial in the series.