Skip to main content
search

Step Up Your WordPress Development Using Bedrock and Modern Dev Tools

Bedrock is a modern WordPress stack that helps you get started with the best development tools and project structure.

Much of the philosophy behind Bedrock is inspired by the Twelve-Factor App methodology including the WordPress-specific version.

Jumpstart My Project

What is Bedrock?

We use Roots.io’s Bedrock framework, which pulls in WordPress as a composer dependency. This allows us to have a controlled, shareable staging environment around our team, and comes with niceties like .env support out of the box. There are also other niceties like upgraded security, and a little security by obscurity, too, in the form of non-standard file paths which protect sites from a small number of automated attacks and exploits.

Advantages Pros that we have realized

Version control

Due to numerous files from public dependencies, the storage needs for version control in Bedrock are minimal. This allows the entire Bedrock directory to be included in version control, ensuring consistent plugin and requirement management among developers, a feature not available in standard WordPress.

Webpack and Laravel Mix

Our preference is to take this a little further by pulling in some Laravel dependencies – namely mix() – so that we can integrate our build process into Webpack JS. This allows us to run all development and live file builds automatically in the terminal window and, crucially, allows us to run the same in our automated deployment and testing environment.

Plugins

https://wpackagist.org, which is effectively a WordPress plugin repository mirror with all plugins factored as dependencies for composer. It’s WPackagist which brings true version control to your WordPress builds.

Uploads

With using WordPress plugin/module which enables your media storage to be based on services like Amazon S3 (and others). Storing media files on S3 gives the benefits of separation of concerns this affords us: This means your application can become scalable as there is no locally required EC2 file or data storage.

Theme

With Bedrock and various dependencies from WPackagist, you gain flexibility in replacing the default theme boilerplate within your theme. Our team tends to favor using the Twig templating language, but alternatives like Blade or Liquid are viable. This approach offers a more accurate Model-View-Controller application structure within the theme directory, fostering faster development and ensuring standardized collaboration among multiple developers.

Deployment

Finally, as the entire website has been built as an app with decentralised storage (and we host databases on separate DB servers), this means the deployment of the application/website is compatible with Amazon’s (and others) deployment processes. Although there are other options, we use Amazon OpsWorks through a variety of Chef Recipes we’ve adapted over time.

Bedrock – Folder Structure

Requirements

PHP >= 7.4, Composer

Extension required for PHP :

gd extension, MySQL, pdo, pdo_mysql, Simple XML, mbstring, tokenizer, curl

Composer check in comsoser.json and update version: 2
$ sudo composer self-update

Also check this stuffs by using this command:
$ sudo apt install openssl php-common php-json php-xml php-zip

svg+xml;charset=utf

Bedrock – Importance of file

Composer.json: All of the plugins, all of the themes managed through composer so composer is a php package manager just like NPM is javascript manager.

Config: Have different php files for different environments if you work on suppose development environment so you simply wp_debug true for this environment.

Vendor:  Where those composer.json. Basically it’s not wordpress related.

Web  -> app: All themes, plugins, uploads folder managed by here.

wp-config / index.php: This is needed to order the WordPress first. It finds the wp folder if it is not found then they look up the directory and look for this there and basically wp-config file login the config folders file.

Wp: Core installation of WordPress.

Dependency management with Composer: Manage your WordPress install and plugins with Composer, a PHP dependency manager. Composer will make development more reliable, help with team collaboration, and it helps maintain a better Git repository.

How to Setup WordPress via Bedrock ?

Goto the folder and click right click and open the terminal where you need to install

(like : https://user5@user5/var/www/html$) and run the command.

$ composer create-project roots/bedrock [project_folder_name]

Update environment variables in the .env file : (Before this create database first)

DB_NAME – Database name
DB_USER – Database user
DB_PASSWORD – Database password
DB_HOST – Database host

Change the all parameters + WP_HOME (check below screenshot)

Now generate the salt key by using this url : WordPress Salts and replace with .env salt key.

(Why Salt key is important in wordpress: WordPress salts are long strings of random characters that are used by WordPress to secure the credentials of logged in users.)

  • Add theme(s) in web/app/themes/ as you would for a normal WordPress site. Copy paste the theme here which you want to activate.
  • Set the document root on your webserver to Bedrock’s web folder: /path/to/site/web/ (Need to setup virtual host in localhost first :

Here is the installation guide url:

bedrock 1 1 768x588 1

 

Setup virtual host in localhost

Open the command prompt or terminal window and enter the command:

$ sudo nano /etc/hosts : and enter the password (here you can see the domain name register on your localhost)

OR
$ sudo gedit /etc/hosts: open in default notepad

$ cat /etc/hosts : see content of file

127.0.0.1 localhost
127.0.0.6 bitcotpage.live

# add domain and ip like following

127.0.0.7 example.live

After add domain name press control+x for save and exit above screenshot window.

bedrock 2 1

 

Configuration for our domain/set document root for our domain

 

Check ls (for list ) or ll (list with details)

$ cd /etc/apache2/sites-available
$ ls

Now enter command $ cp 000-default.conf example.live.conf (copy default file with new file with the same name domain name) if permission issue then use sudo

$ sudo nano example.live.conf (for file edit and its content)

or use $ sudo gedit example.live.conf for open file in editor.

# Change with project domain name which is set in /etc/hosts

ServerName example.live

# if use www then use serveralias (optional)

ServerAlias www.example.live

ServerAdmin webmaster@example.live

# change with project path

DocumentRoot /var/www/html/example/web

ErrorLog ${APACHE_LOG_DIR}/error.log

CustomLog ${APACHE_LOG_DIR}/access.log combined

# vim: syntax=apache ts=4 sw=4 sts=4 sr noet

<Directory "/var/www">

AllowOverride All
</Directory>

If we use folder outside the wamp/xamp

<VirtualHost *:80>
# Change with project domain name which is set in /etc/hosts

ServerName example.live

# if use www then use serveralias (optional)

ServerAlias www.example.live

ServerAdmin webmaster@example.live

# change with project path

DocumentRoot /home/bitcot/Documents/example/web

ErrorLog ${APACHE_LOG_DIR}/error.log

CustomLog ${APACHE_LOG_DIR}/access.log combined

# vim: syntax=apache ts=4 sw=4 sts=4 sr noet
<Directory “/home/bitcot/Documents”>
AllowOverride All
</Directory>

Enable this virtual host or domain configuration:

$ sudo a2ensite wprock.local.conf

Server restart (if needed use sudo) :

$ systemctl reload apache2

Now goto project .env file:

How to Access WordPress Admin Panel

Access WordPress admin at https://example.live/wp/wp-admin/

Set the domain path in web server with the name http://example.live/

So I am able to wordpress admin with this url: http://example.live

[ Note : How can set virtual host in windows ]

Setting virutal host in windows xampp and wamp – Setup Bedrock for WordPress Development on Windows OS

Jumpstart your project today the  smart  way
Let's Discuss Now

Affordable, Reliable, Responsive, Smart - BitCot is all of those things, which were and are important to my growing company's needs. They have knowledgeable resources that really know technology. I look forward to working a lot more with them in the future for Website and Apps Development!

Cat KomFounder, Studio SWEAT onDemand

I discussed the concept with Raj, he really helped me to map out the plan & strategy to get my concept into a real software platform. If you have an idea and you want to make it real, I would recommend Raj and his team.

Patrick HadleyFounder, Biglio

Raj and his team at BitCot has made me a believer. BitCot delivers quality products, timely communication and most importantly hits committed timelines. I was so impressed with BitCot’s speed and standards that I’ve asked them to begin a second project.

Joe RobertsFounder, Poured

BitCot have been excellent development partners for Stomp Sessions. BitCot's rapid development approach works in concert with our highly iterative process.

Robert SuarezCo-Founder- StompSessions