Convert Yii Boilerplate to Boostrap 3

Rather than keep this in my post Building an application with Yii , I decided this warranted a post of it’s own since it was quite specific. As a developer of course I want to use the new shiny and not Bootstrap v2.3.2 that Yii Boilerplate came with. It wasn’t as easy as updating the version in my composer.json file since all the classes for Yii-Booster changed from something like “BoostrapNavbar” to BoosterNavbar” . So, in all it’s glory, are the changes from my git commit. Note there were additional changes to composer.json and composer.lock that I did not include here… the only relevant change was bumping the version to “clevertech/yii-booster”: 4.0.1″ . Basically we’re changing references to “bootstrap” to “booster”. Some CSS was also added in main.css to make the navbar look the same since Bootstrap v3 is mobile first.

@media (min-width: 768px) {
	.nav li{display:inline-block;}
backend/components/BackendController.php |    2 +-
 backend/config/overrides/base.php        |    6 +-
 backend/views/layouts/_navigation.php    |    4 +-
 backend/views/layouts/main.php           |    2 +-
 backend/views/site/login.php             |    6 +-
 backend/www/index.php                    |    2 +-
 composer.json                            |    4 +-
 composer.lock                            | 2652 ++----------------------------
 8 files changed, 184 insertions(+), 2494 deletions(-)

diff --git a/backend/components/BackendController.php b/backend/components/BackendController.php
index a2c8c68..05c5b59 100644
--- a/backend/components/BackendController.php
+++ b/backend/components/BackendController.php
@@ -31,7 +31,7 @@ abstract class BackendController extends CController
         return array(
-            array('bootstrap.filters.BootstrapFilter - delete'),
+            array('booster.filters.BoosterFilter - delete'),
diff --git a/backend/config/overrides/base.php b/backend/config/overrides/base.php
index b068422..9d5c9ba 100644
--- a/backend/config/overrides/base.php
+++ b/backend/config/overrides/base.php
@@ -16,9 +16,9 @@ return [
     'components' => [
         // Backend uses the YiiBooster package for its UI
-        'bootstrap' => [
-            // `bootstrap` path alias was defined in global init script
-            'class' => 'bootstrap.components.Bootstrap'
+        'booster' => [
+            // `booster` path alias was defined in global init script
+            'class' => 'booster.components.Booster'
         'errorHandler' => array(
             // Installing our own error page.
diff --git a/backend/views/layouts/_navigation.php b/backend/views/layouts/_navigation.php
index c122336..aaaf8a9 100644
--- a/backend/views/layouts/_navigation.php
+++ b/backend/views/layouts/_navigation.php
@@ -6,7 +6,7 @@
-    'bootstrap.widgets.TbNavbar',
+    'booster.widgets.TbNavbar',
         'type' => 'inverse',
         'brand' => 'Project name',
@@ -14,7 +14,7 @@ $this->widget(
         'collapse' => true,
         'items' => array(
-                'class' => 'bootstrap.widgets.TbMenu',
+                'class' => 'booster.widgets.TbMenu',
                 'items' => array(
                     array('label' => 'Home', 'url' => array('/site/index')),
diff --git a/backend/views/layouts/main.php b/backend/views/layouts/main.php
index 4d097c9..35a2ba1 100644
--- a/backend/views/layouts/main.php
+++ b/backend/views/layouts/main.php
@@ -28,7 +28,7 @@
breadcrumbs)): ?> widget( - 'bootstrap.widgets.TbBreadcrumbs', + 'booster.widgets.TbBreadcrumbs', array( 'links' => $this->breadcrumbs, ) diff --git a/backend/views/site/login.php b/backend/views/site/login.php index 91e20b2..12158b9 100644 --- a/backend/views/site/login.php +++ b/backend/views/site/login.php @@ -16,7 +16,7 @@ $this->breadcrumbs = ['Login']; beginWidget( - 'bootstrap.widgets.TbActiveForm', + 'booster.widgets.TbActiveForm', array( 'id' => 'login-form', 'enableClientValidation' => true, @@ -42,8 +42,8 @@ echo CHtml::errorSummary($model, null, null, array('class' => 'alert alert-error
- widget('bootstrap.widgets.TbButton', array('buttonType'=>'submit','type'=>'primary','label'=>'Submit', 'icon'=>'ok'));?> - widget('bootstrap.widgets.TbButton', array('buttonType'=>'reset','label'=>'Reset'));?> + widget('booster.widgets.TbButton', array('buttonType'=>'submit','type'=>'primary','label'=>'Submit', 'icon'=>'ok'));?> + widget('booster.widgets.TbButton', array('buttonType'=>'reset','label'=>'Reset'));?>
endWidget(); ?> diff --git a/backend/www/index.php b/backend/www/index.php index 50636eb..bef5f00 100644 --- a/backend/www/index.php +++ b/backend/www/index.php @@ -15,7 +15,7 @@ Yii::setPathOfAlias('www', ROOT_DIR . '/backend/www'); # As we are using BootstrapFilter to include Booster, we have to define 'bootstrap' alias ourselves # Note that we are binding to Composer-installed version of YiiBooster -Yii::setPathOfAlias('bootstrap', ROOT_DIR . '/vendor/clevertech/yii-booster/src'); +Yii::setPathOfAlias('booster', ROOT_DIR . '/vendor/clevertech/yii-booster/src');

Building an application with Yii 1

I’ve built a couple projects with Yii previously and really enjoyed how easy it was to rapidly build a professional application. For my new Yii project I have a set of user requirements and about 100 hours to get it done. So, I’m going to look into some Yii extensions and packages to build this out even more rapidly than before. From a development standpoint, I have just a few requirements:

  1. Yii v1.x
  2. Boostrap CSS v3
  3. Separated front and backend
  4. User and role management


What is Yii Phundament?

I tried out this Yii package and after asking this question for about an hour and a half, I decided it wasn’t suited for my project. There isn’t any decent documentation explaining what Phundament is, other than “you will like it”. I might have liked it if there was a little documentation. Unfortunately it’s not worth any more of my time to try and figure out what it is and how to use it. It’s basically Yii with about 20 extensions, most of which I probably wouldn’t need, that are installed via composer. It appears to be a CMS application on top of Yii. Here is a link to the phundament demo.


Yii Boilerplate

For my project I ended up going with Yii Boilerplate primarily because it already has the backend and frontend separated, along with environment overrides, already thought out and implemented. Here is an installation tutorial that is mostly correct, but there were a few instructions that were no longer correct, like the names of the override files. The instructions also didn’t mention where to run yiic from, which is the /bin directory. There are a number of development tools required by composer, such as selenium and Symphony components that I won’t be using out of the box, but I’ll leave them for now and may use them later. I had this installed and was able to log into the backend and the Gii module in about 20 minutes.


Boilerplate tweaks

  1. I wanted to use Bootstrap CSS v3, and the composer package “clevertech/yii-booster”: “dev-master” that comes with boilerplate will give you Boostrap v2. Once you run “composer update”, the “dev-master” will give you the latest version of yii-booster, which will cause errors such as “Alias “bootstrap.filters.BootstrapFilter” is invalid” . So, you’ll need to change the composer.json file to “clevertech/yii-booster”: “3.1.1” . Or, if you want to use bootstrap 3 like I did, then follow these instructions to make Yii Boilerplate use bootstrap 3

How to run Yii Migrations on Linux

After developing an application on a windows box using “php yiic migrate”, I found this did not work on Linux. I received an error “yiic command not found” and also “php command not found”. Both of these executable’s need to be added to your linux user’s PATH, which is a bunch of directories that linux will search through to find executable files. Here is a great resource on working with the PATH http://www.troubleshooters.com/linux/prepostpath.htm. To make “php yiic migrate” work I added the below line to the /etc/profile file, which provides the directory to the php executable on the machine along with the location of your migrations directory. The connection/session may need to be closed and reopened for it to take effect.

export PATH=$PATH:/usr/local/bin:/var/www/youryiisitedirectory/protected

Now when you navigate to the migrations directory, you can run “php yiic migrate” as usual.

How to add buttons to CGridView when using CArrayDataProvider 1

By default, the button’s used by CGridView expect an array of objects having an “id” property that it can use with the edit and delete buttons. If you’re using CArrayDataProvider, this won’t work. I was able to get the below code working for a delete button. Note that you have to specify the button you want in the “template” attribute, otherwise it’ll try to build all the buttons using the non existent id property.

				'template' => '{delete}',
				'buttons' => array(
					'delete' => array(
							'url' => 'Yii::app()->controller->createUrl("mycontroller/myaction", array("name"=>$data["name"]))',

Join multiple tables with Yii CActiveRecord

I wanted to select records from a table using an attribute in one of the relations, which meant the underlying query would need to join two tables. I initially tried this

CActiveRecord::model('Customer')->with('Company', 'Account')->findByAttributes(array('account.id' => 1));

The above does not work. The trick is you need to use CDbCriteria and findAll() like below.

$criteria = new CDbCriteria();
$criteria->condition = 'account.id = 1';
CActiveRecord::model('Customer')->with('Company', 'Account')->findAll($criteria);