This project aims to provide complete solution for WordPress development and deployment to heroku, even though it isn't completed just yet. π¬
Inspired by wordpress-heroku by Phillip Heuer and based on the exact same boilerplate of Bedrock, this project will give you better experiences while developing your very own WordPress themes and plugins that easily deployed to heroku.
- Integrated Unit and end-to-end testing
- Custom heroku buildpack
- Automated changelog generator
- Better assets compilation
- Easily create archive that ready to distribute to WordPress themes or plugins directory
- Thoughts? let me know π
Its always good to have WP-CLI installed globally on your system. For Database and HTTP Server requirements please refer to this documentation.
Using this button you can deploy a new instance of WordPress. All required extensions will be deployed automatically. This also works if you fork your own project to work on your site.
$ composer create-project feryardiant/wpdev [project-folder]
Create new database through PHPMyAdmin or from CLI
$ mysql -u[username] -p -e 'create database <database-name>'
Configure your .env
file to suit your local setup, described here, also don't forget to set the url
key on wp-cli.local.yml
file as well. Once you're done, let's install WordPress core with the following command:
# Please consult to the official documentation for additional option you might needed for the setup
# See: https://developer.wordpress.org/cli/commands/core/install/
$ vendor/bin/wp core install
# Or you can simply run the following sortcut
$ composer wp:install
Please make sure to configure your HTTP server' document root
to public
directory.
I using gulp
for almost all development workflow in this project, not only for compiling scss
files, minify images and compressing js
, but also to run development server. Once you're done with installation process above, please install the development dependencies through yarn
$ yarn
To start the development server you can simply run command below:
# yarn global add glup-cli or npm -g install gulp-cli, in case you don't have one
$ gulp
The gulp default task will fire up PHP Developent Server, start BrowserSync on port 3000
and watch the changes you made. That way, all you need to do is open your web browser and type http://localhost:3000
on the address bar, open the project on your favorite code editor or IDE and start working.
All the changes you've made will be automatically linted and compiled, once it done BrowserSync will reload the browser for you.
Since this project is based on Bedrock, the project directory structure is pretty much similar, but with some tweaks.
- bin directory : Consists of all buildpack executables only, feel free to delete this directory once you've cloned this project or install it on your local machine,
- config directory : Consists of all build utilities and configuration files, including all the scripts you'd be using on all environment,
- public directory : The server document root directory,
- packages directory : The Themes and Plugins development directory of your project,
- tests directory : Testing directory, obviously.
βββ bin
βββ config
βΒ Β βββ environments
βΒ Β βββ heroku
βββ public
βΒ Β βββ app
βΒ Β βββ wp
βββ packages
βββ resources
βββ tests
βββ e2e
βββ stubs
βββ unit
The gulp
scripts will autoatically scan any sub-directories under plugins
and themes
and generate all the required gulp
tasks if the sub-directory meets the following structures:
<dirname>
βββ assets
βΒ Β βββ img
βΒ Β βββ js
βΒ Β βββ scss
βββ languages
Once you've create <dirname>
above inside plugins
or themes
directory, you'll see similar gulp tasks as following:
$ gulp -T
βββ theme-plugin:php
βββ theme-plugin:zip
βββ¬ theme-plugin:build
β βββ¬ <parallel>
βΒ Β βββ theme-plugin:php
βββ theme:php
βββ theme:img
βββ theme:css
βββ theme:js
βββ theme:zip
βββ¬ theme:build
β βββ¬ <parallel>
βΒ Β βββ theme:css
βΒ Β βββ theme:img
βΒ Β βββ theme:js
βΒ Β βββ theme:php
βββ theme-child:php
βββ theme-child:zip
βββ¬ theme-child:build
β βββ¬ <parallel>
βΒ Β βββ theme-child:php
βββ¬ zip
β βββ¬ <series>
βΒ Β βββ theme-plugin:zip
βΒ Β βββ theme:zip
βΒ Β βββ theme-child:zip
βββ¬ build
β βββ¬ <parallel>
βΒ Β βββ theme-child:php
βΒ Β βββ theme-plugin:php
βΒ Β βββ theme:css
βΒ Β βββ theme:img
βΒ Β βββ theme:js
βΒ Β βββ theme:php
βββ e2e
βββ release
βββ default
<dirname>:build
task will execute all task under<dirname>
namespace, except for<dirname>:zip
task.- Each
*:css
,*:img
and*:js
will only available if you haveimg
,js
andscss
directories underassets
directory. build
task will combine all*:build
tasks on each namespace.zip
task will combine all*:zip
tasks on each namespace.release
task will runbuild
task, generateCHANGELOG.md
, runzip
task and bump version number of this project.
- WordPress - GPLv2 License
- Bedrock - MIT License
- Underscores - GPLv2 License
- Bulma - MIT License
- Gulp and its plugins
- BrowserSync
(c) 2019 Fery Wardiyanto - MIT license.