Installing Roots Trellis / Bedrock / Sage

Not sure how I feel about Roots.io –> The tutorials seem super easy, but I noticed you can quickly run into issues. What doesn’t help is that I can’t really find any reviews / user tutorials past 2016, the Roots discourse forum appears to be a bubble (not accepting new or differing ideas), and I heard the founder is difficult; but some big websites still use it.

Apparently, Laravel Valet is where its at!

Still, I spent the morning learning how to use it, and wanted to share what worked for me (Mac Pro 4,1 – High Sierra).

Getting started, first you need to install these dependencies (or, make sure they are up-to-date):

Setting up a Project

In terminal, Make a new directory:
mkdir ~/Sites

Add a web folder:
mkdir example.com && cd example.com

Clone Trellis:
git clone --depth=1 https://github.com/roots/trellis.git && rm -rf trellis/.git

Clone Bedrock:
git clone --depth=1 https://github.com/roots/bedrock.git site && rm -rf site/.git

Install Sage:
composer create-project roots/sage site/web/app/themes/sage

Local Setup

Go to the root directory (up one folder):
cd ..

Add Roots Example Project:
git clone https://github.com/roots/roots-example-project.com.git

Install the components:

cd roots-example-project.com/site/web/app/themes/sage
composer install
yarn && yarn build
cd ../../../../..
cd trellis
vagrant up

Test the WP install roots-example-project.test

To shut down the server: vagrant halt

Setting up Staging / Production servers will have to be in another post.

What is Roots Trellis, Bedrock, and Sage?

WordPress has been one of the most prominent open source Content Management System used today. With more than 75 million websites worldwide, people are looking for ways to improve their website. This leads to them using various tools for WordPress development. Three of these happen to be from Roots.

What is Roots?

Roots has been in collaboration since 2011. Roots developers are firm believers of open source and peer production. Ever since induction, they’ve been growing and now have over 300 contributors helping to develop various tools for WordPress. NASA, HBO, and Mercedes Benz are just some of the companies that trust and use the tools that Roots has created.

Roots has created three tools for WordPress development. Roots have developed tools that will make the creation of WordPress sites better and faster. These tools are Trellis, Bedrock, and Sage.

Trellis

Trellis is a tool that uses Vagrant to stop clutters in your host machine by creating a self-contained virtual machine. This allows you to use the same software as you would when producing. Powered by Ansible, Trellis will give you a WordPress server that will configure the software that you need.
You won’t have to worry about downtime because this will ensure that your web server is always serving new codes for each deployment. You also just need a single command to provision and deploy and a remote server. Using this tool will speed up the setup of a complete WordPress serv

Bedrock

This tool is a WordPress boilerplate that will give you an improved WordPress project structure. Similar to having an own subdirectory, the organization that Bedrock has will prove to be much more impressive for things like renaming wp-content/ to app/.

This will also make development more collaborative and reliable, not to mention, a better maintained Git depository. Developers will be able to see the same version of libraries for the entire project.

Composer, a PHP dependency manager, will be used to manage your WordPress plugins and templates. With just one command, you’re able to install plugins which lessens the possibility of encountering problems. The configuration will also be made easy with PHP Dotenv. Improved security also comes with this tool that guarantees secured passwords through wp-password-bcrypt.

Sage

Sage is a WordPress starter theme which uses Laravel’s Blade templating engine. This is based on HTML5 Boilerplate. It comes with a lot of features to hasten website building. The latest version of Bootstrap come with this tool. You can also replace Bootstrap with Bulma, Foundation, etc., or you can just start off with a fresh one after installation.

With Bedrock, you can just easily optimize your pictures and automatically check for errors in your Javascript. You can also write stylesheets with Sass. For most, it’s claimed to be developer-friendly and efficient for automation.

This is a favourite by most because it’s highly documented, which helps developers know more about. From the first step which is installation to extending the theme, Sage has provided intuitive documentation with every step of the way.

Raw Install Code

Isaac Adams-Hands

Full Stack Developer, Digital Marketer, and InfoSec enthusiast. He received his Bachelor’s Degree from the University of Western Sydney and his Business Diploma from Georgian College before joining various marketing positions in search portals, e-commerce, higher education, and addiction recovery services.

Follow @ twitter

Related posts

Fixing the blog page title in WP

If your blog page is pulling the title of the last/latest post, here is a quick and dirty fix Add this to your title tags: Examples:

Bulletproof / Simple Contact Form

I just need a simple contact form that always works. Less code the better. No bells or whistles. If spam becomes an issue, I can add a Google reCAPTCHA. Contact Form Code: