Throughout your training here at Know the Code, you will use a local Sandbox test website. This site gives you a place to reverse engineer WordPress, play with code, and test without breaking one of your projects. It’s your playground, i.e. sandbox.
What will you need for this site?
- A local web server up and running. You can use Local by Flywheel, Desktop Server, MAMP, WAMP, AMP, VVV, etc.
- Your favorite code editor or IDE.
- Version Control – You need Git
- A default theme that you like to work with.
- Debug Tools – Kint, Whoops, and Query Monitor
Setting Your Local Web Development
We help you to get your local web development environment setup and ready not only for training but also for your own workflow.
Debug Tools – Kint, Whoops, and Query Monitor
You will use Kint in just about every lab. It’s superior to var_dump() and print_r. There are multiple ways for you to install it. Select one of these options:
- UpDevTools – Use the Developer Suite I built;
- Install the Kint PHP Debugger plugin from the WordPress plugin directory;
- Or build your own plugin with this lab
Query Monitor is available in the WordPress Plugin Directory. You can install that by going into your sandbox website, go to Plugins > Add New > and then search for Query Monitor. Go ahead and install and activate it.
Whoops comes with both the UpDevTools and the Starter Plugin lab. It’s a beautiful and informative error interface, much better than the standard PHP orange error display. It’s not required, but very handy.
Turning on Debug Mode
Whenever you are in your local environment, make sure you turn on the debug mode. Open up wp-config.php and add the following:
| /** | |
| * When you are building your code (i.e. in development), you should turn on | |
| * all error reporting in wp-config.php. Why? Because you want to find all | |
| * warnings, notices, errors, etc. before you ship it to your client. Even | |
| * the minor errors are telling you something is wrong in the code. | |
| * Suppressing them does not fix the problem. It merely quiets them down. | |
| * | |
| * @link https://codex.wordpress.org/Debugging_in_WordPress | |
| */ | |
| // turns on the WordPress debug mode. It will then show all PHP errors, | |
| // notices, and warnings. You want to see these when you are building and testing. | |
| define('WP_DEBUG', true); | |
| // will save the errors into a debug.log file inside of your wp-content folder. | |
| // It gives you a record of the errors to help you to find the problems. | |
| define( 'WP_DEBUG_LOG', true ); | |
| // will show the errors on the pages. If you set it to false, then all | |
| // errors are hidden. | |
| define( 'WP_DEBUG_DISPLAY', true ); | |
| // forces WordPress to load the full version of scripts and stylesheets | |
| // rather than the minified versions. That’s handy in debug/build mode. | |
| define( 'SCRIPT_DEBUG', true ); | |
| // Uncomment when you are working on profiling and tuning performance. | |
| // define( 'SAVEQUERIES', true ); |
Sandbox Starter Plugin
In many videos, I will use the WordPress Starter Plugin. You can download it from GitHub.
