# Dockerize Local Bedrock & Sage Development with Lando

**URL:** https://discourse.roots.io/t/dockerize-local-bedrock-sage-development-with-lando/14288
**Category:** guides
**Tags:** guide
**Created:** 2018-12-05T18:10:55Z
**Posts:** 71

## Post 1 by @knowler — 2018-12-05T18:10:55Z

Originally published at: [https://roots.io/guides/dockerize-local-bedrock-and-sage-development-with-lando/](https://roots.io/guides/dockerize-local-bedrock-and-sage-development-with-lando/)  
   
I’ve been pretty obsessed with using Docker for local development lately. I love how fast and lightweight it is and how I can run software versions that I don’t need to have installed locally — avoiding the mess that that can make of your system. Docker is awesome, however, if you’ve ever used Docker, you…

---

## Post 2 by @wdeer — 2019-01-02T02:18:27Z

**Great Tutorial!** …on my new laptop I’ve kept my primary user a standard (non-admin) user which had been causing a number of headaches with my local dev setup using homebrew/valet, **but this was the perfect solution!**

I just wanted to point out my initial issues in case anyone else were to run into them as well. I was converting a valet site to lando but kept having issues getting lando to start when the wordpress salts included in the .env file. After running `lando start` i would get:

`ERROR: Invalid interpolation format for "environment" option in service "appserver": "8g?[N8=Q>$kxC.LtAL^v)!-#WX{O@U3seuz@;kngc4eK}:@M4MBBOPM}-)q$=!F4"`

**BUT** once I removed the salts and kept ONLY what you had detailed in the tutorial lando started up without any issue!

Thanks!

---

## Post 3 by @knowler — 2019-01-02T03:17:52Z

Thanks for pointing this out. I remember running into this issue when figuring all this out. I’ll update the tutorial to reflect this.

---

## Post 4 by @beauvoir — 2019-01-09T19:52:28Z

Thanks for this post, this setup looks pretty nice. I’m pretty new to lando and docker. Do you have any idea why running : **lando composer install** gives me the error **Composer could not find a composer.json file in /app**. I followed the steps and just created a basic bedrock + sage setup and have the default composer.json in my project root folder.

---

## Post 5 by @knowler — 2019-01-09T20:12:15Z

It seems like you are running `lando composer install` from `web/app` directory within Bedrock. Instead, you should run it from the root Bedrock directory since that is where the `composer.json` file is located.

---

## Post 6 by @beauvoir — 2019-01-09T22:28:14Z

Looks like I was doing the right thing but I forgot to do a **lando rebuild**. Thanks a lot for your quick answer.

---

## Post 8 by @knowler — 2019-03-01T16:49:31Z



---

## Post 9 by @ckyoung — 2019-03-30T14:19:17Z

Do you have any tutorial about deploying Lando on server?

---

## Post 10 by @knowler — 2019-03-30T17:52:10Z

Lando isn’t actually designed to be a production/remote server solution, it’s for local development. From [their docs](https://docs.devwithlando.io/):

> It’s a free, open source, cross-platform, **local** development environment and DevOps tool built on [Docker](https://docker.com) container technology and developed by [Tandem](http://thinktandem.io).

I do know that there is integration with hosting providers like [Pantheon](https://docs.devwithlando.io/tutorials/pantheon.html), however, I do not have any experience with that.

---

## Post 11 by @ckyoung — 2019-03-31T10:03:01Z

I see, thanks for clearing this out. I’m just new to Docker. But I’m trying to run Bedrock using Docker on server. But I don’t know what’s the best approach for it.

---

## Post 12 by @knowler — 2019-03-31T21:09:14Z

I don’t have any experience with Docker for PHP applications in production, but I would recommend checking out something like [Laradock](https://laradock.io/). Bedrock shouldn’t be too difficult to set up with it.

---

## Post 13 by @Paolo_Cargnin — 2019-04-02T11:26:21Z

I have a question… I use lando for other projects and it works find… With this specific recipe I can’t let yarn work properly.

The problem is that when i run “yarn start”, it compules the first time all the assets but then it doesn’t take the changes and I have to work re-running yarn start any time. Do you have any idea of what it can be?

---

## Post 14 by @Olaf_Siebert — 2019-04-08T16:15:01Z

Thank for the fantastic tutorial. I got all working in a few minutes but for some reason the Browsersync times out for me.

```
{
  "entry": {
    "main": [
      "./scripts/main.js",
      "./styles/main.scss"
    ],
    "customizer": [
      "./scripts/customizer.js"
    ]
  },
  "publicPath": "/app/themes/sage",
  "devUrl": "https://appserver_nginx.sovereign.internal",
  "proxyUrl": "https://localhost:3000",
  "cacheBusting": "[name]_[hash:8]",
  "watch": [
    "app/**/*.php",
    "config/**/*.php",
    "resources/views/**/*.php"
  ]
}
```

Any idea where I am going wrong?

---

## Post 15 by @Olaf_Siebert — 2019-04-11T08:51:10Z

I found a solution, instead of running the Browsersync from the container, just run it local. Not a great solution, preferred way would be to run inside it.

For anyone using Capistrano for deploy, I managed to get it working with those small additions to the lando.yml

name: sovereign  
recipe: wordpress  
proxy:  
theme:

- localhost:3000  
config:  
php: ‘7.2’  
via: nginx  
webroot: web  
database: mariadb  
xdebug: true

services:  
theme:  
type: node  
overrides:  
ports:  
- 3000:3000  
ruby:  
type: ruby:2.4  
install\_dependencies\_as\_me:

- gem install capistrano
- gem install capistrano-composer
- gem install capistrano-wpcli
- gem install bedrock-capistrano-uploads
- gem install capistrano-file-permissions  
tooling:  
yarn:  
service: theme  
gem:  
service: ruby  
ruby:  
service: ruby  
cap:  
service: ruby  
database:  
portforward: 3306

---

## Post 16 by @wbiggs — 2019-05-13T21:37:20Z

I’ve followed these instructions to a T but I’m unable to get browsersync to work at all. My .lando.yml:

```
name: zing-it
recipe: wordpress
proxy:
  theme: # Optional: add this if you include the Sage specific config down below
    - localhost:3000
config:
  php: '7.2'
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true

# Add the following if you plan to use Sage as a starter theme
services:
  theme:
    type: node
    services:
      ports:
        - 3000:3000
tooling:
  yarn:
    service: theme
```

`yarn start`seems to work correctly:

```
[BS] [HTML Injector] Running...
[Browsersync] Proxying: http://appserver_nginx.zing-it.internal
[Browsersync] Access URLs:
 -----------------------------------
       Local: http://localhost:3000
    External: http://172.21.0.3:3000
 -----------------------------------
          UI: http://localhost:3001
 UI External: http://172.21.0.3:3001
 -----------------------------------
[Browsersync] Watching files...
[Browsersync] Couldn't open browser (if you are using BrowserSync in a headless environment, you might want to set the open option to false)
```

but then going to `localhost:3000` doesn’t work - `can’t establish a connection to the server at localhost:3000`.

Am I doing something wrong here?

---

## Post 17 by @yaaax — 2019-06-02T16:27:33Z

Hi there,

Thanks @knowler for the great tutorial. It looks like a nice way to develop Sage themes, I’m really motivated to make it work completely!

When running :  
`lando yarn start`  
…I experience the same issue as @wbiggs: `http://localhost:3000` isn’t working (_connection refused_).  
Note: it’s the same for `http://localhost:3001`.

Thanks to @Olaf_Siebert’s comment, I’ve managed to make it work locally (running `yarn start` instead of `lando yarn start`). But it seems that this is not the right approach. Could you please tell me why? I probably don’t grasp the big picture of containers with WordPress theme development.

Finally, I think I miss some debug skills with containers. Why aren’t ports 3000 and 3001 correctly forwarded?

* * *

Here are the files I use and the outputs:

## **.lando.yml** :

```
name: my-app
recipe: wordpress
proxy:
  theme:
    - localhost:3000
  config:
    php: '7.3'
    via: nginx
    webroot: web
    database: mariadb:10.3
    xdebug: true

# Add the following if you plan to use Sage as a starter theme
services:
  theme:
    type: node
    overrides:
      ports:
        - 3000:3000
        - 3000:3001
tooling:
  yarn:
    service: theme
```

Then when running `lando start`, everything looks fine:

```
$ lando start
Let's get this party started! Starting app..
landoproxyhyperion5000gandalfedition_proxy_1 is up-to-date
Starting my-app_theme_1 ... done
Starting my-app_appserver_1 ... done
Starting my-app_database_1 ... done
Starting my-app_appserver_nginx_1 ... done
Waiting until appserver_nginx service is ready...
Waiting until database service is ready...
Waiting until theme service is ready...
Waiting until appserver service is ready...

BOOMSHAKALAKA!!!

Your app has started up correctly.
Here are some vitals:

NAME my-app
LOCATION /Users/yaaax/workspace/my-app
SERVICES appserver_nginx, appserver, database, theme
APPSERVER_NGINX URLS https://localhost:32901
                      http://localhost:32902
                      http://my-app.lndo.site
                      https://my-app.lndo.site
THEME URLS http://localhost
                      https://localhost
```

–\> `http://my-app.lndo.site` displays the website :ok_hand:

* * *

## **web/app/themes/my-theme/resources/assets/config.json** :

```
{
  "open": false,
  "entry": {
    "main": [
      "./scripts/main.js",
      "./styles/main.scss"
    ],
    "customizer": [
      "./scripts/customizer.js"
    ]
  },
  "publicPath": "/app/themes/my-theme",
  "devUrl": "http://appserver_nginx.my-app.internal",
  "proxyUrl": "http://localhost:3000",
  "cacheBusting": "[name]_[hash:8]",
  "watch": [
    "app/**/*.php",
    "config/**/*.php",
    "resources/views/**/*.php"
  ]
}
```

And when I run `lando yarn start` (from `web/app/themes/my-theme/`), again it _looks_ fine:

```
$ lando yarn start
yarn run v1.16.0
$ webpack --hide-modules --watch --config resources/assets/build/webpack.config.js

Webpack is watching the files…

DONE Compiled successfully in 12189ms 3:36:44 PM

[BS] [HTML Injector] Running...
[Browsersync] Proxying: http://appserver_nginx.my-app.internal
[Browsersync] Access URLs:
-----------------------------------
      Local: http://localhost:3000
    External: http://172.20.0.3:3000
-----------------------------------
          UI: http://localhost:3001
UI External: http://172.20.0.3:3001
-----------------------------------
[Browsersync] Watching files...

DONE Compiled successfully in 4690ms
```

But…

- going to `localhost:3000` ==\> _ERR\_CONNECTION\_REFUSED_
- going to `localhost:3001` ==\> _ERR\_CONNECTION\_REFUSED_

Modifying a scss actually file triggers :

```
WAIT Compiling...

DONE Compiled successfully in 3317ms
```

But not change when refreshing my page on my browser (`http://my-app.lndo.site`), even after a refresh (and disabling cache)

---

## Post 18 by @yaaax — 2019-06-02T16:45:07Z

FYI, my working “local config” :  
`config.json`:

```
{
  "entry": {
    "main": [
      "./scripts/main.js",
      "./styles/main.scss"
    ],
    "customizer": [
      "./scripts/customizer.js"
    ]
  },
  "publicPath": "/app/themes/my-theme",
  "devUrl": "http://my-app.lndo.site",
  "cacheBusting": "[name]_[hash:8]",
  "watch": [
    "app/**/*.php",
    "config/**/*.php",
    "resources/views/**/*.php"
  ]
}
```

:warning: it seems to work but I don’t fully understand what I’m doing here! :sweat_smile:

_Note : I haven’t modified the `.lando.yml` file_

---

## Post 19 by @Bezelinja — 2019-06-09T01:40:27Z

Love your tutorial and the idea but when I access "[https://bedrock.lndo.site](https://bedrock.lndo.site)’’ I get “404 page not found”. I’m doing something wrong but not sure what.

Thanks in advance

---

## Post 20 by @knowler — 2019-06-10T02:21:31Z

Hey everyone we’re not going to provide support for this guide until Lando 3.0 officially drops so we can work with a stable API. The guide has written for an release candidate — which in retrospect was a bad idea, but a good proof of concept — so the API hasn’t exactly been stable. Gonna lock the thread until the 3.0 release.

---

## Post 21 by @knowler — 2019-06-10T02:21:43Z



---

## Post 22 by @QWp6t — 2020-05-13T18:17:59Z



---

## Post 23 by @QWp6t — 2020-05-13T18:22:11Z

Now that a [stable version of Lando 3.x](https://github.com/lando/lando/releases/latest) has been released, I have reopened this topic.

---

## Post 24 by @coltoneakins — 2020-05-17T21:37:37Z

To others following along with this tutorial in 2020 (thank you Roots!), if you are getting the error:

_“Proxying to an unknown service”_

This relates to a change moving to 3.0.0-rc.2+. See: [https://docs.lando.dev/guides/updating-to-rc2.html#new-images](https://docs.lando.dev/guides/updating-to-rc2.html#new-images) . Lando has been updated heavily since this tutorial was written…

Or more specifically, see:

> **[Updating to 3.0.0-rc.2+](https://docs.lando.dev/guides/updating-to-rc2.html#internal-service-name-changes)**
>
> Learn how to update Lando from beta to rc and beyond.

* * *

Long story short, under the ‘proxy:’ settings in the `.lando.yml`, it should be changed from:

```
proxy:
    nginx:
       - bedrock.test
```

to:

```
proxy:
    appserver_nginx:
       - bedrock.test
```

(That is, if you are still following this tutorial. Your specific configuration may differ.)

---

## Post 25 by @max_tyrrell — 2020-05-18T12:16:39Z

@coltoneakins have you been able to get the browersync server working for you? Using the Landofile from the tutorial and a bunch of different attempts of my own from reading the Lando docs I haven’t been able to get it to work. There’s always some variation of `This site can't be reached` at localhost:3000.

---

## Post 26 by @coltoneakins — 2020-05-18T16:50:12Z

@max_tyrrell  
Last night, I did not get to fully setting up the local dev enviroment w/ Lando yet (was working on other stuff). But, I have pretty heavy experience with Node.js and Docker Compose so I am sure I will figure it out. I plan to sit down with this more in the coming days.

I will make an extensive post of what I did (if I find out), and I will be sure to update this thread here too.

---

## Post 27 by @max_tyrrell — 2020-05-18T19:53:41Z

Awesome! That’d be amazing! :slight_smile:

---

## Post 28 by @QWp6t — 2020-05-19T08:33:23Z

Update: I plan on eventually updating the Lando guide since I do still actively use Lando.

> **You can find the old post below if you need to reference it for whatever reason.**
>
> ## **Update: this probably won’t work anymore.**
> 
> This is what I’m using for webpack-dev-server and a non-standard Sage setup. It can probably be adopted to work with BrowserSync if someone wants to give it a shot. In short, replace 8080 with 3000 and then make sure browser-sync binds to 0.0.0.0 instead of default localhost. Also, this means that browser-sync (or dev-server, for me) will always be running. I’m fine with this, but others might prefer to have more control over when it starts and stops.
> 
> ```
> name: my-roots-site
> recipe: wordpress
> config:
> cache: redis
> webroot: web
> via: nginx
> database: mariadb
> xdebug: true
> config:
> # vhosts: ../lando/default.conf
> # php: ../lando/php.ini
> proxy:
> theme:
> - dev-server.lndo.site:8080
> services:
> appserver:
> build:
> - composer global require hirak/prestissimo
> - composer install --no-interaction --no-progress --no-scripts
> - wp package install aaemnnosttv/wp-cli-login-command
> - composer install --working-dir=/app/web/app/themes/my-roots-site --no-interaction --no-progress --no-scripts
> run:
> - wp core is-installed || wp @production db export - | wp db import -
> - >-
> wp plugin is-installed --skip-packages --skip-plugins --skip-themes wp-cli-login-server ||
> wp login install --activate --yes --skip-plugins --skip-themes
> - wp acorn optimize:clear
> cache:
> type: redis
> theme:
> type: node:12
> port: 8080
> ssl: true
> build:
> - yarn --cwd /app/web/app/themes/my-roots-site install --non-interactive --silent --frozen-lockfile
> command: yarn --cwd /app/web/app/themes/my-roots-site start --public https://dev-server.lndo.site --key /lando/certs/lndo.site.key --cert /lando/certs/lndo.site.crt --cacert /lando/certs/lndo.site.pem --non-interactive
> overrides:
> environment:
> DEV_SERVER_HOST: '0.0.0.0'
> DEV_SERVER_PORT: 8080
> tooling:
> redis-cli:
> service: cache
> yarn:
> service: theme
> cmd: timeout --preserve-status -k 360 300 /usr/local/bin/yarn --cwd /app/web/app/themes/my-roots-site
> nuke:
> service: appserver
> cmd:
> - rm -rf /app/vendor
> - rm -rf /app/web/wp
> - rm -rf /app/web/app/themes/my-roots-site/node_modules
> - rm -rf /app/web/app/themes/my-roots-site/vendor
> - rm -rf /app/web/app/themes/my-roots-site/dist
> events:
> pre-stop:
> - >-
> test -d /app/web/wp &&
> test -d /app/vendor &&
> wp core is-installed --skip-packages --skip-plugins --skip-themes &&
> wp db export
> post-start:
> - appserver: which php && php --version
> - appserver: which wp && wp cli version
> - appserver: which composer && composer --version
> - theme: which node && node --version
> - theme: which npm && npm --version
> - theme: which yarn && yarn --version
> ```

---

## Post 29 by @Antonio_Terreno — 2020-05-19T11:40:26Z

Wow absolute life safer. I ran into this just now!

---

## Post 30 by @Pablo_Gates — 2020-05-22T19:58:33Z

My config return only Bad Gateway, I can’t get work with bedrock :confused:

---

## Post 31 by @Sokoljr — 2020-05-31T07:44:00Z

```
name: name
recipe: wordpress
proxy:
  theme:
    - localhost:3000
config:
  php: '7.2'
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true
services:
  pma:
    type: phpmyadmin
    hosts:
      - database
  theme:
    type: node:10
    services:
      ports:
        - 3000:3000
tooling:
  yarn:
    service: theme
```

my config return bad gateway when run yarn start from container ;(

---

## Post 32 by @Sokoljr — 2020-05-31T08:04:50Z

I am found a solution!

replace

```
services:
      ports:
        - 3000:3000
```

to

```
overrides:
      ports:
        - 3000:3000
```

---

## Post 33 by @coltoneakins — 2020-06-02T03:11:55Z

Hey Max, I did sit down with this more. However, for what it is worth Browsersync practically worked outside of the box for me–my configuration differs only a little from the tutorial. For this reason, I think you might be running into an issue with your configuration–not like a problem with Lando or Bedrock/Sage.

Could you create maybe a minimal repository on GitHub of your project and post it here? I would be happy to troubleshoot with you.

---

## Post 34 by @Pablo_Gates — 2020-06-03T20:05:39Z

> [@yaaax](#):
>
> - going to `localhost:3000` ==\> _ERR\_CONNECTION\_REFUSED_
> - going to `localhost:3001` ==\> _ERR\_CONNECTION\_REFUSED_

Same problem here :confused:

---

## Post 35 by @techieshark — 2021-03-16T12:08:06Z

Thanks for this tutorial.

On this part:

> Make sure to **remove the salts** from the `.env` file as Lando does not know how to process them.

Are the salts not necessary? Perhaps they’re just not necessary in development? I wonder if the tutorial could be updated to elaborate on that?

Thanks!

---

## Post 36 by @reinis — 2021-03-16T13:48:17Z

Hi! I’m now trying to setup dev environment, did everything as it was written in the original article but I keep getting error 404 on any of dev urls. It makes a redirect to [http://project.test/wp/wp-admin/install.php](http://project.test/wp/wp-admin/install.php) and that’s it. 404 it is.

My config:

> name: project  
> recipe: wordpress  
> proxy:  
> theme: # Optional: add this if you include the Sage specific config down below  
> - localhost:3000  
> config:  
> php: ‘7.2’  
> via: nginx  
> webroot: web  
> database: mariadb  
> xdebug: true
> 
> services:  
> theme:  
> type: node  
> services:  
> ports:  
> - 3000:3000  
> tooling:  
> yarn:  
> service: theme

Any ideas? Thanks in advance!

---

## Post 37 by @reinis — 2021-03-16T14:31:36Z

Ok, problem solved, this helped:

> [@Bedrock installation on Lando](https://discourse.roots.io/t/bedrock-installation-on-lando/17726):
>
> I am trying to get Bedrock installed. I am running Linux Mint, with Lando installed. I am putting projects in ~/sites A separate (non-Bedrock) project that simply installs WordPress in ~/sites/wordpress works fine, shows in the url given; Lando is working. ( ~/sites/wordpress, $ lando rebuild gives APPSERVER\_NGINX URLS lc.lndo.site ) cd ~/sites/themedev/ lando rebuild Should I have to do wp core install, or should Bedrock installation do it? cd ~/sites/themedev/bedrock; lando wp …

I believe the original guide could be updated.

---

## Post 38 by @970design — 2021-03-23T15:34:41Z

Also having some issues getting browser sync to work with this setup; anyone know what’s wrong here?

```
name: test-site
recipe: wordpress
proxy:
  appserver_nginx:
    - test-site.lndo.site:80
  theme:
    - test-site.lndo.site:3000
config:
  php: '7.4'
  via: nginx
  webroot: web
  database: mariadb
services:
  theme:
    type: node:10
    overrides:
      ports:
        - 3000:3000
  pma:
    type: phpmyadmin
    hosts:
      - database
tooling:
  yarn:
    service: theme
```

* * *

```
{
  "entry": {
    "main": [
      "./scripts/main.js",
      "./styles/main.scss"
    ],
    "customizer": [
      "./scripts/customizer.js"
    ]
  },
  "publicPath": "/app/themes/test-site",
  "devUrl": "http://test-site.lndo.site",
  "proxyUrl": "http://test-site.lndo.site:3000",
  "cacheBusting": "[name]_[hash:8]",
  "watch": [
    "app/**/*.php",
    "config/**/*.php",
    "resources/views/**/*.php"
  ]
}
```

---

## Post 39 by @tanog — 2021-04-10T23:23:40Z

I’m not running Bedrock, but in my case setting proxy for theme as `localhost:3000`

```
proxy:
  theme:
    - localhost:3000
```

Seems to work with my Sage10 browserStack.

Full `.lando.yml` is here:

```
name: my-project
recipe: wordpress
config:
  php: 7.4
  xdebug: false
  webroot: .

proxy:
  theme:
    - localhost:3000

services:
  database:
    type: mariadb
  theme:
    type: node:13
    overrides:
      ports:
        - '3000:3000'
tooling:
  yarn:
    service: theme

excludes:
  - vendor
  - node_modules
```

---

## Post 40 by @coltoneakins — 2021-04-14T15:48:01Z

> [@Dockerize Local Bedrock & Sage Development with Lando](https://discourse.roots.io/t/dockerize-local-bedrock-sage-development-with-lando/14288/20):
>
> Hey everyone we’re not going to provide support for this guide until Lando 3.0 officially drops so we can work with a stable API. The guide has written for an release candidate — which in retrospect was a bad idea, but a good proof of concept — so the API hasn’t exactly been stable. Gonna lock the thread until the 3.0 release.

@knowler - If I write copy/revisions to the original article on the website for you, will you update it?

Lando v3 has been released for quite some time; only minor revisions need to be made to the article on the website for it to be valid again.

---

## Post 41 by @Gwyn_Hockridge — 2021-05-27T11:16:56Z

@coltoneakins  
Hey, been putting my head against this for a while. Feel like I’m close but seem to be missing something.  
If you have got the amendments to the article could you post them somewhere in the meantime until this article gets updated?  
Thanks.

---

## Post 42 by @coltoneakins — 2021-05-27T16:47:35Z

Hey Gwyn,

Sure thing. Most of the original guide is still valid. But, here are the rough steps/files you need. **This is assuming you are using the latest version of Bedrock and Sage 10 (not 9).**

# INSTRUCTIONS FOR LANDO, BEDROCK, AND SAGE 10

1. Pre-requisites: Install Docker and Lando.

2. Create a bedrock project using composer (on host machine) or cloning the project directly from Github: [https://github.com/roots/bedrock](https://github.com/roots/bedrock)

3. Add the following `.lando.yml` file within your bedrock project, subbing out the ‘name’ (example-name) and local dev URL (example.local).

4. Add a `.env` file to the root of the project. The Bedrock project on Github gives an example. HOWEVER, if you are using Lando, you **MUST** use the following values for `DB_NAME`, `DB_USER`, `DB_PASSWORD`, `DB_HOST`. (i.e. You cannot change the database name–these are hard-coded into the WordPress ‘recipe’ that Lando uses behind the scenes.)

5. Edit your hosts file on your OS to add the local dev URL. If you are on Linux, edit /etc/hosts as the root user. Add the following line:

6. Run `lando start`. This will start setting up the Docker containers that Lando uses behind the scenes for our local environment.

7. Run `lando composer install` and `lando composer update` in the project. This set will install WordPress and the PHP dependencies that Bedrock uses to run properly.

8. Go to the `web/app/themes` folder in the project.

9. Clone Sage v10 from Github ([https://github.com/roots/sage](https://github.com/roots/sage)). Alternatively, use you may use `lando composer require roots/sage:dev-master` to install Sage using Composer instead. **NOTE:** If you are using Composer, you MUST use the ‘dev-master’ version to get Sage v10. These steps will not work for Sage v9.

10. Now, go into the new theme folder we created in the previous step named `sage/`.

11. Edit the `webpack.mix.js` file in the Sage theme folder. You want to change the `.browserSync` URL. See an example of this file below:

12. Run `lando yarn` and `lando yarn build`. This will install the Node dependencies for the Sage theme to work.

13. This step is kinda optional, but install the PHP dependencies for Sage v10. Run `lando composer install` and `lando composer update` IN THE SAGE THEME FOLDER. **NOTE:** This is different than before in Step #7 when we installed PHP dependencies for Bedrock.

14. If you got this far, we are now ready for development: we have Lando, Bedrock, and Sage properly installed now. You can now visit `http://example.local` in your web browser. You should see the ‘default’ WordPress installation wizard. Proceed through the wizard as you would normally. **Don’t see the WP wizard?** Check to make sure that you don’t have other services like Apache running on your host machine. We don’t want other programs messing with how Lando is serving up websites. If you are on Ubuntu based distributions, run `sudo systemctl stop apache2` in your terminal to stop the Apache process. **Still don’t see the WP wizard?** Check to make sure you do not have other Node apps running on your PC trying to serve up a website on localhost port 80 (as this is what we are doing with Lando right now).

15. You can now see your Bedrock/Sage website at `http://example.local`. **HOWEVER** , if you want to set up hot-reloading in your browser, open another terminal on your computer. Visit the theme folder of your Bedrock project: `web/app/themes/sage`. Run `lando yarn start` in this folder. This will set up hot-reloading. Keep this terminal window open throughout your development process. **EXTREMELY IMPORTANT NOTE** : Your site will only hot-reload at `http://localhost:3000`–NOT `http://example.local` (if you followed my steps). So, be sure to do your theme development at `http://localhost:3000/` in your browser. `http://example.local` will just show your WordPress site without the hot-reloading.

---

## Post 43 by @coltoneakins — 2021-05-27T16:54:00Z

@Gwyn_Hockridge

I left you (and the world) some detailed instructions above. If you are still having issues, please do not hesitate to reach out to me. We could chat together to get this working for you. :slight_smile:

---

## Post 44 by @Gwyn_Hockridge — 2021-05-28T09:18:55Z

@coltoneakins  
Thanks so much! Will check it out this morning. Do you know if this config will work with sage 9? Doubt we’ll be able to use Sage 10 in production until it’s out of dev (and ideally working with tailwind).

---

## Post 45 by @coltoneakins — 2021-05-28T15:23:45Z

Hey Gwyn,

Most of the original tutorial by Roots still applies for Sage 9. However, the biggest change is probably the Lando config file for Lando v3–some of the directive names changed. For example, the ‘nginx’ directive changed to ‘appserver\_nginx’.

Here is my most recent, working configuration for Sage 9 from an old project:

```
name: example-name
recipe: wordpress
env_file:
  - .env
proxy:                
  appserver_nginx: # Optional: if you exclude this, Lando will serve it as name.lndo.site
    - example.local
  theme: # Optional: add this if you include the Sage specific config down below
    - localhost:3000
config:
  php: '7.3'
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true

# Add the following if you plan to use Sage as a starter theme
services:
  theme:
    type: node
    services:
      ports:
        - 3000:3000

# TODO Work on build steps w/ Lando and tooling here...
tooling:
  build:
    description: Manually invokes all our build steps
    cmd:
      - appserver_nginx: composer install
      - theme: composer install
      - theme: yarn install
  yarn:
    service: theme
```

As you can see, it is pretty similar to the original tutorial. If you have have trouble getting hot-reloading to work, just make sure you are running `lando yarn start` in the Sage theme folder of your WP installation.

Also, make sure no other services such as Apache or other Node apps are running on port numbers that Lando is also using.

---

## Post 46 by @coltoneakins — 2021-06-12T20:37:45Z

**ABOUT USING BROWSERSYNC FOR HOT RELOADING + THE BROWSERSYNC UI:**

**NOTE:** In my original reply, I forgot to also expose port 3001 (the default port used by Browsersync for its ‘UI’ panel). If you want hot reloading AND the Browsersync UI dashboard, use the following `.lando.yml` file:

```
name: example-name
recipe: wordpress
env_file:
  - .env
proxy:
  appserver_nginx:
    - example.local
  theme:
    - localhost:3000
    - localhost:3001
config:
  php: 7.4
  composer_version: 2-latest
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true

# Add the following if you plan to use Sage as a starter theme
services:
  theme:
    type: node:14 # MUST BE >12 TO WORK WITH SAGE 10
    overrides:
      ports:
        - 3000:3000
        - 3001:3001 

# TODO Work on build steps w/ Lando and tooling here...
tooling:
  yarn:
    service: theme

excludes:
  - vendor
  - node_modules
```

**BE SURE TO RUN `lando rebuild` AFTER MAKING CHANGES TO THIS FILE. THIS IS NOT OPTIONAL.**

Lastly, please note that the ‘external URL’ feature of Browsersync **will not work by default in Lando** for security reasons. This is the feature that allows you to connect to your development site on your local LAN–such as using your cell phone to browse your dev site for testing purposes.

This is because Lando uses Docker behind the scenes; it is insecure to expose your app on your local LAN because other devices on your local network _could_ essentially steal data from your app.

**However,** if you want to get Browsersync to work 100% (hot-reloading, the UI dashboard, AND the ‘external url’ feature working), you have to change the `bindAddress` to expose your services (a.k.a. Docker) on the LAN. THIS IS NOT ENABLED BY DEFAULT FOR SECURITY. See instructions here: [https://docs.lando.dev/guides/access-by-other-devices.html#lando-share-testing-over-the-internet](https://docs.lando.dev/guides/access-by-other-devices.html#lando-share-testing-over-the-internet)

Once you make these changes, you will likely have to run `lando rebuild` to rebuild Lando (Lando is not like docker-compose, most changes made to the `.lando.yml` file REQUIRE a rebuild). Also, you may have to edit the `webpack.mix.js` file to add more options to Browsersync to adjust the proxy URL and/or host. See the Browsersync documentation: [https://browsersync.io/docs/options](https://browsersync.io/docs/options)

---

## Post 47 by @Davide_Prevosto — 2021-06-13T10:45:45Z

Thanks to @coltoneakins, I was finally able to run **Lando** version 3.1.4 and **Browsersync** on a mobile device too.

If you want to try, use the following:

`vim ~/.lando/config.yml`

**[config.yml]**

```
# https://docs.lando.dev/config/security.html#exposure
# Bind my exposes services to all intefaces
bindAddress: 0.0.0.0
```

**[.lando.yml]**

```
name: myappname
recipe: wordpress
env_file:
  - .env
config:
  php: '7.4'
  via: nginx
  database: mariadb
  xdebug: false
  webroot: web
  composer_version: 2-latest
proxy:
  mailhog:
    - mailhog.lndo.site
services:
  database:
    type: mariadb
    portforward: 3306
    creds:
      user: myuser
      password: mypassword
      database: mydbname
  mailhog:
    type: mailhog
    hogfrom:
      - appserver
    portforward: true #1026
  node:
    type: node:14
    globals:
      node-sass: "latest"
    overrides:
      ports:
        - 3000:3000
        - 3001:3001
tooling:
  npm:
    service: node
  node:
    service: node
excludes:
  - vendor
  - node_modules
```

**[webpack.mix.js]**

```
mix.browserSync({
    https: true,
    host: 'localhost',
    ui: {
        port: 3001
    },
    injectChanges: true,
    notify: false,
    proxy: 'https://myappname.lndo.site',
    port: 3000,
    open: false
});
```

You should now be able to looking for your own IP address (example 192.168.1.100) and - on your mobile devices in the LAN - visit the [https://192.168.1.100:3000](https://192.168.1.100:3000) URL

Hope it helps.

---

## Post 50 by @Jack_Kudla — 2021-06-13T14:26:15Z

went smoothly up to step 14, 502 bad gateway

edit: did a lot of digging now just getting 404 not found [http://example.local](http://example.local)

---

## Post 51 by @coltoneakins — 2021-06-13T19:31:10Z

@Jack_Kudla

Hi Jack,

I’d like to help you out more with this–but, I need more details from you.

Getting a 404 error might mean either of the following:

1. A service like Apache may be running on your computer which is interfering with Lando.
2. There is a permissions issue with the WordPress file your are trying to visit in your web browser. For example, if you are visiting the home page, the `index.php` file may have bad permissions.
3. (More unlikely) Your computer may have had problems binding the `example.local` URL to your computer’s localhost.

I would try @Davide_Prevosto’s steps above. It may fix your issue.

Otherwise, if you feel comfortable doing so, maybe we could screenshare via Discord and troubleshoot this together?

* * *

**Note:** This issue is probably an issue with YOUR computer/setup–not the steps above. This is because other people tried my steps and verified they are working.

---

## Post 52 by @slam — 2021-12-28T06:41:58Z

If you want to use an external MySQL tool like Sequel Ace, change the .lando.yml like this.

1. remove the `database` directive from `config`.

2. add the following under `services`

```
services:
  database:
    type: mariadb:10.6
    portforward: 33061 # port for external app access
```

---

## Post 53 by @nolafs — 2022-03-03T08:09:14Z

I am tying to recover an older Bedrock project (1.10.2). I followed the recommended lando.yml setup.

```
name: marmalade
recipe: wordpress
env_file:
  - .env
proxy:
  appserver_nginx:
    - marmalade.lndo.site
  theme:
    - localhost:3000
config:
  composer_version: 2-latest
  php: '7.2'
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true
services:
  theme:
    type: node:10.15.0
    overrides:
        ports:
          - 3000:3000
  ruby:
    type: ruby:2.4
    install_dependencies_as_me:
      - gem install capistrano
      - gem install capistrano-composer
      - gem install capistrano-wpcli
      - gem install bedrock-capistrano-uploads
      - gem install capistrano-file-permissions
tooling:
  yarn:
    service: theme
  gem:
    service: ruby
  ruby:
    service: ruby
  sshKey:
    service: ruby
    cmd:
      - cat /etc/ssh/ssh_config
  database:
    portforward: 3306
```

.ENV

```
DB_NAME=wordpress
DB_USER=wordpress
DB_PASSWORD=wordpress

# Optional variables
DB_HOST=localhost
DB_PREFIX=msbi_

WP_ENV=development
WP_HOME=http://test.lndo.site
WP_SITEURL=${WP_HOME}/wp
```

It seems the autoloader does not work correctly. I am keep getting an error on wordpress installation.

Warning: mysqli\_real\_connect(): (HY000/2002): No such file or directory in /app/web/wp/wp-includes/wp-db.php on line 1626

`No such file or directory`

# Error establishing a database connection

This either means that the username and password information in your `wp-config.php` file is incorrect or we can’t contact the database server at `localhost`. This could mean your host’s database server is down.

- Are you sure you have the correct username and password?
- Are you sure you have typed the correct hostname?
- Are you sure the database server is running?

If you’re unsure what these terms mean you should probably contact your host. If you still need help you can always visit the [WordPress Support Forums](https://wordpress.org/support/forums/).

Any idea why?

Cheers  
Olaf

---

## Post 54 by @RistoKaalma — 2022-03-05T01:15:35Z

Now that Sage 10 officially rolled out - any suggestions on updating lando config?

One that’s probably worth noting:

> [@Updating lando theme container from node:12 to node:16 for sage 10 and bud](https://discourse.roots.io/t/updating-lando-theme-container-from-node-12-to-node-16-for-sage-10-and-bud/21760):
>
> So I just noticed that laravel mix was replaced with bud for the latest version of sage 10. Bud now requires a node version of at least 16. [Replace Laravel Mix with Bud (#2643) · roots/sage@69dfbfc · GitHub](https://github.com/roots/sage/commit/69dfbfc65c887f2df625521468700936bf3a6295#diff-7ae45ad102eab3b6d7e7896acd08c427a9b25b346470d7bc6507b6481575d519) I run my development server via lando’s wordpress recipe and they don’t list node 16 out of the box. But the fix to make it run was very easy. You basically only have to override the image used for the theme server from node:12 to node:16. ([Services | Lando](https://docs.lando.dev/config/services.html#advanced)) To make it work I had to add the…

---

## Post 55 by @aksld — 2022-03-08T20:37:06Z

+1 !  
If someone can shere his lando config + bud config that would be wonderful !

---

## Post 56 by @cim — 2022-03-14T15:39:02Z

So I spent a lot of time and reading trying to get this setup to work and I feel I am pretty close. But somehow I can’t get browsersync/localhost to work.

**The problem:**  
After `lando start` the following url is red:  
`THEME URLS http://localhost`

`lando yarn dev` seems to work fine, no errors and it notices changes I make etc.  
But http:/localhost:3000 is not accessible (‘This site can’t be reached’)

Any help would be greatly appreciated!

My configuration:

**.lando.yml**

```
name: bedrock
recipe: wordpress
env_file:
  - .env
proxy:
  appserver_nginx:
    - bedrock.lndo.site 
  theme:
    - localhost:3000
    - localhost:3001
config:
  php: 7.4
  composer_version: 2-latest
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true

# Add the following if you plan to use Sage as a starter theme
services:
  theme:
    type: node:16
    overrides:
      ports:
        - 3000:3000
        - 3001:3001

tooling:
  yarn:
    service: theme

excludes:
  - vendor
  - node_modules
```

**.env**

```
DB_NAME='wordpress'
DB_USER='wordpress'
DB_PASSWORD='wordpress'
DB_HOST='database'

WP_ENV='development'
WP_HOME='https://bedrock.lndo.site'
WP_SITEURL="${WP_HOME}/wp"

# Generate your keys here: https://roots.io/salts.html
# (I tried without salts but didn't make a difference, so I probably put them back here)
```

**bud.config,js** (identical to the latest Sage)

```
/**
 * @typedef {import('@roots/bud').Bud} bud
 *
 * @param {bud} app
 */
module.exports = async (app) => {
  app
    .entry({
      app: ['@scripts/app', '@styles/app'],
      editor: ['@scripts/editor', '@styles/editor'],
    })

    .assets('images')

    .watch('resources/views/ **/*', 'app/** /*')

    .proxy('http://bedrock.lndo.site')

    .serve('http://localhost:3000');
};
```

---

## Post 57 by @noahott — 2022-03-15T15:44:55Z

I’ve also been fighting with this issue. I had a working lando + bedrock + sage config (basically the same as @cim posted above) that worked well while using mix and with bud 5.3.0. Once I updated to bud 5.5.0 I could not get bud dev to work properly.

When I use bud.serve(‘[http://localhost:3000](http://localhost:3000)’) it runs but I get no response from localhost:3000 and the ‘[dev]’ and ‘[proxy]’ urls in the terminal show as grey. When I use bud.serve(‘[http://bedrock.lndo.site:3000](http://bedrock.lndo.site:3000)’) i get the error:

Error: listen EADDRNOTAVAIL: address not available 172.19.0.5:3000

If I remove bud.serve(), it succeeds using a random port which I also can’t access.

---

## Post 58 by @Julien_Winant — 2022-03-15T16:29:10Z

Yep same problem for me inside my own docker image for compiling assets.

---

## Post 59 by @noahott — 2022-03-15T17:20:14Z

Some more info…  
Reverting to bud 5.4.0 lets me load [http://localhost:3000](http://localhost:3000) and [http://bedrock.lndo.site:3000](http://bedrock.lndo.site:3000), but hot reloading is broken. I get a CORS error

`Access to fetch at 'http://bedrock.lndo.site/app/themes/sage/public/app.afb458e755e818e47fec.hot-update.json' from origin 'http://bedrock.lndo.site:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.`

---

## Post 60 by @cim — 2022-03-16T14:46:20Z

I can confirm that reverting back to Sage 10 beta 3 (with bud 5.3.2) fixes hot reloading for me.

Maybe [this](https://github.com/roots/bud/issues/1210) bug in bud has something to do with it?

---

## Post 61 by @Atari — 2022-03-18T01:12:27Z

I’m using Lando (Docker wrapper) and I have exposed the port 3000 for node. But if I remove the .serve() line, i cant use the generated localhost:xxxx as this port hasn’t been exposed in docker and site using localhost:xxxx is unreachable.

If i instead use

```
.serve('http://localhost:3000');
```

and run lando yarn dev, the site is still unreachable at [http://localhost:3000](http://localhost:3000)’;

I can however always reach the site at the domain ie [http://example.test/](http://example.test/)

So my understanding is since I am using Docker, I have to remove the serve() line, but I also need to find a way to expose any random generated port on localhost through docker?

---

## Post 62 by @noahott — 2022-03-18T02:52:23Z

I’ve been trying to troubleshoot this all week. I’m not sure if it’s a Bud issue or Lando. My lando file looks like this, but I’ve also tried a separate sub domain for the theme proxy, with and without a specific port.

```
proxy:
  appserver:
    - sage.lndo.site
  theme:
    - localhost:3000
config:
  php: '7.4'
  composer_version: 2-latest
  webroot: web
services:
  theme:
    type: node:16
    overrides:
      ports:
        - 3000
```

When i visit [http://localhost:3000](http://localhost:3000) directly or curl -I '[http://localhost:3000](http://localhost:3000) i get ’ Empty reply from server’, but if I lando ssh -s theme and then run the same curl command, I get the expected response:

```
HTTP/1.1 200 OK
content-type: text/html; charset=UTF-8
date: Thu, 17 Mar 2022 16:09:15 GMT
link: <https://sage.lndo.site/wp-json/>; rel="https://api.w.org/", <https://sage.lndo.site/wp-json/wp/v2/pages/23>; rel="alternate"; type="application/json", <https://sage.lndo.site/>; rel=shortlink
server: Apache/2.4.52 (Debian)
x-powered-by: PHP/7.4.28
connection: close
x-proxy-by: @roots/bud
x-bud-proxy-origin: https://sage.lndo.site
x-bud-dev-origin: http://localhost:3000
content-length: 0
```

It seems, for some reason, that requests are being properly directed to the theme container, or are somehow being modified, but I can’t track down why.

Also, when i specify the same domain in bud.serve as in proxy, i get the error `Error: listen EADDRNOTAVAIL: address not available 172.19.0.2:3000 `

---

## Post 63 by @Atari — 2022-03-18T04:05:26Z

@noahott Yeah I have the exact same issue. I also installed a fresh Sage 10.1.2 just released a few hours ago, still same issue.

---

## Post 65 by @Atari — 2022-03-22T14:45:47Z

@noahott Have you had any luck getting this working on your end?

---

## Post 66 by @noahott — 2022-03-22T17:34:33Z

No, I’m still stuck on this one. Not really sure what the next troubleshooting steps are, but happy to help if you have any ideas. I’ve settled on using v5.3.2 for now.

---

## Post 67 by @cim — 2022-03-23T10:57:55Z

No luck here either. Working with Trellis now. But I’m keeping an eye on [this](https://github.com/roots/bud/issues/1250) bug report that was recently added and is probably related to our problem.

---

## Post 68 by @kellymears — 2022-03-28T12:24:50Z

The random port designation issue is fixed as of 5.7.0 (but you should install 5.7.3 if you’re giving it a go now).

---

## Post 69 by @noahott — 2022-03-28T12:56:37Z

Hi @kellymears, I’m still having the same issue with bud and Lando, even with version 5.7.3. I’ve tried specifying ports 3000, 3030, and 31234 all with the same results. I can SSH into the container running bud and receive the proper response there, but from outside the container I always get an “Empty reply from server.”

---

## Post 70 by @ben — 2022-03-28T13:24:10Z

Hey y’all, I’m gonna close out this topic.

1. This is an old guide that is not up-to-date with the current state of Sage
2. These replies give the impression that there is an issue with Bud

This is just a matter of configuring Lando correctly. There is not anything in either Bud or Lando that are preventing the tools from working with each other. We are using Lando with Bud on two different internal projects at Roots: one with Sage, one with Laravel.

We’d love either an update to this guide or a new one. If you’re interested in contributing and getting paid to write, please see [Write for Roots](https://discourse.roots.io/t/write-for-roots/22618)

* * *

### :information_source: The Sage 10 + Lando discussion is continued at **[https://discourse.roots.io/t/lando-bud-sage-configuration/22740](https://discourse.roots.io/t/lando-bud-sage-configuration/22740)**

---

## Post 71 by @ben — 2022-03-28T13:24:13Z