The Beginner's Guide to BracketSpace

As a WordPress developer, establishing a balance between efficiency and quality can sometimes be challenging. Creating products from scratch – whether they be themes, plugins, or entire websites or apps – can become tedious and time-consuming.

However, you don’t have to sacrifice coding standards to streamline your workflow. Incorporating reusable libraries and open-source repositories such as those offered by BracketSpace can help reduce development time while also making it easier to produce modular code.

In this post, we’ll explain what BracketSpace is. Then we’ll explain how its library of reusable code, including five specific micropackages, can benefit your WordPress development projects. Let’s get started!

An Introduction to BracketSpace

BracketSpace is a WordPress-focused development company that specializes in plugin development:

You may recognize it as the company behind the popular Notification plugin, as well as Advanced Cron Manager, which is a handy tool for managing WP-Cron events:

However, most recently, BracketSpace released Micropackage:

The BracketSpace Micropackage library on GitHub.

Micropackage is a library of open-source repositories containing reusable code for WordPress plugin and theme development. As explained in a BracketSpace blog post, the Micropackage projects arose from the need to create a more standardized method of reusing code than simply copying and pasting.

The Benefits of BracketSpace Reusable Micropackages for WordPress Development

When it comes to plugin, theme, and site development, maintainable code is key. Best practice is to produce code that is modular, meaning it’s not only maintainable but reusable and extensible as well.

In a nutshell, Micropackage libraries can help with this while also reducing development time and extending the functionality of your projects. They’re also loosely coupled, leaving a lot of room and flexibility for configurations.

You can use BracketSpace micropackages with WordPress themes and plugins via Composer or Node Package Manager (NPM). Some of the packages are wrappers for WordPress APIs while others introduce new developer features.

Additionally, most don’t have a single dependency. In other words, you can use individual packages or the entire library.

5 BracketSpace Reusable Micropackages for WordPress Developers

There are currently 13 BracketSpace micropackages available, although you can expect more to be added over time. Let’s take a look at five that could benefit your WordPress development projects.

1. Responsive Embeds

Being a WordPress developer, you’re likely no stranger to the importance of responsive design. However, sometimes embedding content such as YouTube iframe videos doesn’t translate well in responsive themes.

The Responsive Embeds micropackage aims to fix that. It offers a JavaScript function you can use to automatically make any embed responsive, including iframe videos.

Below is an example of its usage:

import responsiveEmbeds from 'responsive-embeds';

// See arguments description below.
responsiveEmbeds( element, params );
 
const iframe = document.getElementById( 'some-iframe' );
const embeds = document.querySelectorAll( '.responsive-embed' );

responsiveEmbeds( 'iframe[src*="youtube.com"]', {
   watch: true,
   wrapClass: 'my-custom-wrap',
} );
responsiveEmbeds( iframe );
responsiveEmbeds( embeds );

It wraps the HTML element in a <div> tag, positioned absolute. The height and width are set to 100 percent to ensure it matches the parent width. Padding-top is set as a percentage that matches the element’s original proportions.

For detailed installation and usage instructions, head over to the GitHub repository.

2. Templates

When you’re developing WordPress themes, using a template engine can streamline the process significantly. In a nutshell, it can simplify complex programming languages.

The Templates repository is a solution for basic PHP templating. The simple template engine comes with multi-storage and variable support.

One of the main differences between the BracketSpace template engine and others such as Twig or Blade is that it does not cache or parse templates. It’s a basic file loader that supports data passing to templates.

You can define your template storage:

Micropackage\Templates\Storage::add( 'frontend', $plugin_dir . '/frontend/templates' );

Then use the following code to render the template:

$template = new Micropackage\Templates\Template( 'frontend', 'profile', [
	'user_name' => $user_name,
	'posts'     => get_posts( [ 'author' => $user_id ] ),
] );

$template->render()

While the variables are optional, you must define the parameters for the template and storage names. To download or learn more about this micropackage, you can visit the GitHub Templates repository.

3. Filesystem

The Filesystem micropackage offers a simplified wrapper you can use around the WordPress Filesystem API. Basically, it makes it easier to manipulate your files in the wp-content directory by prefixing all relevant paths to full paths.

In addition to custom upload directories and custom wp-content directories, it also supports plugins and themes. You can initialize the Filesystem class from the main plugin or template file by running the following script:

use Micropackage\Filesystem\Filesystem;

Then, to add a base directory, use:

$filesystem = new Filesystem( DIR );

You can use the Filesystem micropackage for any method provided by the WP_Filesystem class. WordPress offers a full list of those methods.

4. DocHooks

The DocHooks micropackage is for PHP comment and WordPress hook annotations, which can help keep your projects organized. It supports actions, filters, and shortcodes:

@action <hook_name*> <priority>
@filter <hook_name*> <priority>
@shortcode <shortcode_name*>

There are multiple ways you can use this micropackage. For example, you can extend the HookAnnotations class:

use Micropackage\DocHooks\HookAnnotations;

class Example extends HookAnnotations {

 /** 
 *  @action test
   */
  public function test_action() {}

}

$example = new Example();
$example->add_hooks();

Visit the GitHub DocHooks repository page to download the micropakage and learn more about how to use it.

5. Requirements

If you’re developing WordPress plugins, then the Requirements micropackage may be of particular interest to you. This repository makes it easy for you to test environment requirements for running your plugin, such as:

PHP and WordPress versions
PHP Extensions
Active plugins and theme
DocHooks

For basic usage, you would incorporate the following in the main file of your plugin:

<?php
 /*
 Plugin Name: My Test Plugin
 Version: 1.0.0
 */
 // Composer autoload.
 require_once DIR . '/vendor/autoload.php' ;

$requirements = new \Micropackage\Requirements\Requirements( 'My Test Plugin', array(
     'php'                => '7.0',
     'php_extensions'     => array( 'soap' ),
     'wp'                 => '5.3',
     'dochooks'           => true,
     'plugins'            => array(
         array( 'file' => 'akismet/akismet.php', 'name' => 'Akismet', 'version' => '3.0' ),
         array( 'file' => 'hello-dolly/hello.php', 'name' => 'Hello Dolly', 'version' => '1.5' )
     ),
     'theme'              => array(
         'slug' => 'twentysixteen',
         'name' => 'Twenty Sixteen'
     ),
 ) );
 /**
 Run all the checks and check if requirements has been satisfied.
 If not - display the admin notice and exit from the file.
 */
 if ( ! $requirements->satisfied() ) {
 $requirements->print_notice();
 return;
 } 
 // … plugin runtime.

Additionally, you have the option of creating your own custom checks. You can see the advanced usage options on the micropackage repository page.

Conclusion

The efficiency and productivity of your workflow hinge on the WordPress development tools and methods you use. For example, reusable code libraries can help reduce development time and increase the quality of your projects.

As we discussed in this post, BracketSpace’s recently released micropackages offer a handful of open-source repositories you can use for WordPress development, such as the five we covered in this post:

Responsive Embeds makes it easier to ensure embedded elements such as iframe videos are responsive.
Templates is a simple PHP engine solution and comes with data passing, multi-storage, and variable support.
Filesystem provides easier methods for manipulating files in WordPress directories.
DocHooks can help keep your projects organized with WordPress hook annotations.
Requirements will test the environment requirements for your plugin.

Do you have any questions about BrackSpect Micropackage? Let us know in the comments section below!