Daily Archives: November 9, 2014


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(
             'accessControl',
-            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 @@
  */
 
 $this->widget(
-    'bootstrap.widgets.TbNavbar',
+    'booster.widgets.TbNavbar',
     array(
         'type' => 'inverse',
         'brand' => 'Project name',
@@ -14,7 +14,7 @@ $this->widget(
         'collapse' => true,
         'items' => array(
             array(
-                'class' => 'bootstrap.widgets.TbMenu',
+                'class' => 'booster.widgets.TbMenu',
                 'items' => array(
                     array('label' => 'Home', 'url' => array('/site/index')),
                     array(
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