8 tips on SilverStripe 4

Our preferred web development framework SilverStripe has being re-written and will be released  as SilverStripe 4 in next year. Up to now there has been 3 alpha releases and 3 beta releases , which you can download from here. According to the SilverStripe roadmap, the new version 4 will be released and fully supported till mid 2018. See the road map attached below. As SilverStripe is our core development framework we’ve been trying it out, upgrading our modules and sites etc for the last 8 months, and we thought of blogging some of the interesting facts about the new version.

PHP 7 & Namespaces

SilverStripe 4 supports PHP 7. As PHP 5.5 was unsupported by the PHP project (http://php.net/supported-versions.php) and the current active version 5.6 will be unsupported somewhere in 2018, SilverStripe 4’s focus is to support the latest PHP version 7.1. With this SilverStripe also started to have namespaces.

In the previous versions of SilverStripe (3.6.1 latest stable) the classes, interfaces did not  have any namespaces and you could call classes with their names directly. However this is not the case anymore, and each SilverStripe class is under a namespace. If you are looking to have relationships from one class to another the codes will look like this.

use SilverStripe\ORM\DataObject;
use SilverStripe\Assets\Image;
class MyDataObject extends DataObject {
 Private static $has_one = array(
  'Image' => Image::class
 );
}

It is recommended to use Class::class to retrieve the class names where possible, and if not to use php’s get_class function.

Namespaced templates

With the data objects and classes being namespaced, it reflects on the arrangement of the templates. Unlike the previous versions having just the templates, Layout and Includes folders like below, the new templates are arranged by the namepace of the class.

/templates 
 /Layout
 /Includes 

For an example the Security controller’s templates will sit in a folder like the following.

/templates
 /Layout
 /SilverStripe
  /Security
   /Layout
    /Security.ss 
   /Includes

This works in combination with the Controller or the forms name space. The new Security controller sits under SilverStripe\Security. where its full class name is going to be SilverStripe\Security\Security. This reflects the folder structure for the template files.

Forms and request handlers

If you’ve used forms extensively for your SilverStripe projects you might have extend the forms class and create your own forms classes for different purposes. This way you can develop your custom forms into their own class and handle the actions within the form class itself.

With the new SilverStripe 4 you still can write your own form classes, however these accompanies a separate request handler class to handle the actions of the form.

See the code block below.

use SilverStripe\Forms\FieldList;
use SilverStripe\Forms\Form;
use SilverStripe\Forms\FormAction;
use SilverStripe\Forms\FormRequestHandler;
use SilverStripe\Forms\RequiredFields;
use SilverStripe\Forms\TextField;
 
class MyForm extends Form 
{
 
 public function __construct($controller, $name)
 {
  $fields = new FieldList(
   TextField::create('MyTextField')
  );
  $actions = new FieldList(
   FormAction::create('doMyForm', 'Submit')
  );
  $validator = new RequiredFields(array(
   'MyTextField'
  ));
  parent::__construct($controller, $name, $fields, $actions, $validator);
  $this->requestHandler = MyForm_RequestHandler::create($this);
 }
}
class MyForm_RequestHandler extends FormRequestHandler 
{
 
 function doMyForm($data, $form){
   // handle the submission here. 
 }
}

React JS

SilverStripe 4 uses react. In many of the modules it uses ReactJS to build the frontend components. And unlike the previous versions the current version uses yarn to build its JS. However still the good old entwine is being used for binding actions, initialising react components on ajax loaded contents etc.

Its good to take a look at how the SilverStripe-asset-admin module was written. And there's a brief introduction on how to structure a project, and how to config react.
https://github.com/silverstripe/silverstripe-asset-admin/
https://github.com/silverstripe/silverstripe-asset-admin/blob/1/docs/en/architecture.md

There is also a new Node package for SilverStripe development, https://www.npmjs.com/package/@silverstripe/webpack-config. This is a shared common webpack configuration aimed at reducing the third party requirements, by sharing them among the modules. The documentation is a good reference on how to structure your configs.

Images / assets and php image intervention

Unlike the previous versions of SilverStripe for image manipulation it has borrowed Intervention Image bundle from http://image.intervention.io/. This enables you to call a set of methods on a custom Image Intervention, to manipulate your images. It also reduce the complexity of working with the GD plugin and provides you a shopisticated layer.

There are a whole lot of functions, like blur, canvas, crop, fill, flip etc.

Traits

Traits were a part of PHP from the version 5.4.0, it enables to reuse code among different classes, and extract common functionality from a class. This sounds a bit like the decorators / extensions of SilverStripe, but it’s not the same. SilverStripe 4 uses a lot of traits to reuse code.

Read more on traits here. http://php.net/manual/en/language.oop5.traits.php

New folder structure for SilverStripe modules

The folder structure for a SilverStripe 4 supported module is as follows.

/
 /_config
 /client
  /dist
  /lang
  /src
   /styles
   /components 
 /src
 /docs
 /lang
 /templates
  /Layout
  /Includes

1. _config - where your YML configs are going to be
2. Client - the front end elements
3. Dist - the compiled javascripts
4. Lang - i18n translations for the front end
5. Src - where you source files will be at
6. Src -  where your PHP files, models controllers etc will be. Also these will be namespaces if you are following the new SilverStripe recommended coding patterns.
7. Docs - that explains it, these are the docs for the module
8. Lang - i18n translations for the lang files
9. Templates - where your ss files will be stored,  and will follow a folder structure as explained above.

ICU Project Date times

In SilverStripe 3.6.1 the date times were being using the PHP’s default, date function. When it comes to SilverStripe 4 this has been changed, and it uses the ICU project to format dates, and you’d be using this API to format the date times. http://userguide.icu-project.org/formatparse/datetime

However this doesnt mean that you shouldn’t be using the php’s native functions like strtotime or date, but if you are going to use the DBDate or DBDatetime classes this is what you should be looking at.

These are 8 new tips / tricks to remember while developing in SilverStripe 4, well there’s a lot more, but we thought of sharing these as these looked to be important to get your hand dirty. Hope you enjoyed reading and we helped in understanding the upcoming new version of SilverStripe.