Yii Project Blueprints
Description
Book DescriptionThis book is for intermediate-to-advanced level Yii developers who want to master the Yii framework and develop real-world applications. You should have experience of working with Yii, PHP 5, HTML, CSS, and JavaScript.What you will learn
Organize and structure your projects from start to finish
Create applications from scratch and use Gii to create models
Use Yii database migrations to create database agnostic applications and manage your database changes
Create secure multiuser rolebased applications that use Bcrypt password hashing
Integrate with thirdparty libraries using Composer
Develop console applications that seamlessly integrate with your applications
Utilize SendGrid to send and receive emails within your application
Who this book is for
All prices
More details
Other editions
Additional editions
Person
Charles R. Portwood II has over 10 years of experience developing modern web applications and is well versed in integrating PHP with native mobile applications. An avid proponent of Yii Framework and open source software, Charles has contributed multiple guides, extensions, and applications to the Yii community. In addition to being a programmer, he is also a Linux system administrator.
Content
A Task Management Application
What's Nearby?
Scheduled Reminders
Issue Tracking
Microblogging Platform
A Content Management System
Creating a Management Module
API Driven Application
Creating the presentation layer
Up until this point, all the code that has been written is backend code that the end user won't be able to see. In this section, we will be creating the presentation layer of our application. The presentation layer of our application is composed of three components: controllers, layouts, and views. For this next section, we'll be creating all the three components.
As a developer, we have several options to create the presentation layer. One way we can create the presentation layer is using Gii. Gii has several built-in tools that can assist you in creating new controllers, forms for our views, and even full create, read, update, and delete (CRUD) skeletons for our application. Alternatively, we can write everything by hand.
Managing projects
The first part of the presentation layer we are going to work on is the projects section. To begin with, create a new file in protected/controllers/ called ProjectControllerProjectController.php that has the following class signature:
For our controllers, we will be extending Yii's base class called CController. In future chapters, we will create our own controllers and extend the controllers from them.
Before we can start displaying content from our new action, we'll need to create a layout for our content to be rendered in. To specify our layout, create a public property called $layout, and set the value to 'main':
Next, let's create our first action to make sure everything is working:
public function actionIndex() { echo "Hello!"; }Now, we should be able to visit http://localhost/projects/index from our web browser and see the text Hello printed on the screen. Before we continue defining our actions, let's create a layout that will help our application look a little better.
Creating the layout
The layout that we specified references the file located in protected/views/layouts/main.php. Create this file and open it for editing. Then, add the following basic HTML5 markup:
Then add a title within the <head> tag that will display the application name we defined in protected/config/main.php:
Next, let's add a few meta tags, CSS, and scripts. To reduce the number of files we need to download, we'll be including styles and scripts from a publicly available Content Distribution Network (CDN). Rather than writing markup for these elements, we're going to use CClientScript, a class made to manage JavaScript, CSS, and meta tags for views.
For this application, we'll be using a frontend framework called Twitter Bootstrap. This framework will style many of the common HTML tags that our application will use, providing it with a cleaner overall look.
Tip
When you're ready to go live with your application, you should consider moving the static assets you are using to a CDN, referencing popular libraries such as Twitter Bootstrap and jQuery from a publicly available CDN. CDNs can help to reduce hosting costs by reducing the amount of bandwidth your server needs to use to send files. Using a CDN can also speed up your site since they usually have servers geographically closer to your users than your main server.
First, we're going to call CClientScript, as follows:
Secondly, we're going to set the Content-Type to text/html with a UTF-8 character set, as follows:
Next, we're going to register the CSS from Twitter Bootstrap 3 from a popular CDN, as follows:
<?php $cs->registerCssFile( '//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css' ); ?>Then we'll register the JavaScript library for Twitter Bootstrap:
<?php $cs->registerScriptFile( '//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js' ); ?>Finally, we're going to register jQuery 2.0 and have Yii placed at the end of the <body> tag, as follows:
CClientScript also supports method chaining, so you could also change the preceding code to the following:
For the last part of our layout, let's add a basic header within our <body> tag that will help with navigation, as follows:
After the closing </div> tag, add the following:
The $content variable that we've added to our layout is a special variable that contains all the rendered HTML markup from our view files and is defined by the CController class in the render() method. Yii will automatically populate this variable for us whenever we call the render() method from within our controllers.
Creating the project index action
With our layout defined, we can get back to creating actions. Let's start by modifying our actionIndex() method so that it renders a view.
First, create a variable to store a searchable copy of our model. Have a look at the following code:
$model = new Projects('search');Next, render a view called index, which references protected/views/projects/index.php, and pass the model we created to this view, as follows:
Now, create the view file in protected/views/projects/index.php and open it for editing. Begin by adding a button in the view as follows, which will reference the save action that we will create later on:
Then add a descriptive title so that we know what page we are on. Have a look at the following line of code:
<h1>Projects</h1>Finally, create a new widget that uses CListView, a built-in Yii widget designed for displaying data from CActiveDataProvider. In Yii, widgets are frontend components that help us to quickly generate commonly used code, typically for presentation purposes. This widget will automatically generate pagination for us as necessary and will allow each of our items to look the same. Have a look at the following code:
The new widget that we created consists of two parts. The first is the dataProvider, which provides data to the widget. This data comes from our project's model's search() method, a piece of code automatically generated by Gii.
The second part of the widget is the itemView, which references the specific view file that our items will be rendered out of. In this case, the view references a file in the same directory of protected/views/projects called _project.php. Create this file and then add the following code to it:
<strong><?php echo CHtml::link(CHtml::encode($data->name), $this->createUrl('/projects/tasks', array('id' => $data->id))); ?></strong>
Due on <?php echo date('m/d/Y', $data->due_date); ?>
<?php if ($data->completed): ?> Completed <?php else: ?> <?php if ($data->numberOfTasks == 0): ?>No Tasks
<?php else: ?><?php echo $data->getPercentComplete(); ?>% Completed
<?php endif; ?> <?php endif; ?> </div> <div...
