Pupcake ResponseRender Of The Jade Template
This is a component to allow rendering jade template in the response object in Pupcake Framework, (*1)
Installation:
install package "Pupcake/ResponseRenderJade" using composer (http://getcomposer.org/)
Usage:
Before we get started, we would like to set up the following file structures for our web application:, (*2)
- public/index.php --- the main index file
- public/views --- the folder contains all the view files
- vendor --- the vendor folder, storing all composer packages
- vendor/autoload.php --- the comoser's auto-generated file for class autoloading
We then need to install jade compiler globally by: npm install -g jade, (*3)
We also need to make sure php's shell_exec function can execute the jade compiler /usr/local/bin/jade, (*4)
See more details on https://github.com/superjimpupcake/PHPNativeJadeRenderer since this plugin replies on PHPNativeJade/Renderer, (*5)
Now we are going to edit public/index.php, (*6)
<?php
//Assuming this is public/index.php and the composer vendor directory is ../vendor
require_once __DIR__.'/../vendor/autoload.php';
$app = new Pupcake\Pupcake();
$app->usePlugin("Pupcake.ResponseRender"); //this is required
/**
* $app->usePlugin("Pupcake.ResponseRenderJade") is ok too
* if we do not pass the jade_compiler option to the configuration array, Pupcake.ResponseRenderJade will try to find the default one
*/
$app->usePlugin("Pupcake.ResponseRenderJade", array('jade_compiler' => '/usr/local/bin/jade'));
$app->setViewDirectory("../views");
$app->setViewEngine("jade");
$app->get("render_test", function($req, $res){
$data = array();
$data['word'] = "world";
$res->render("index.jade", $data);
});
$app->run();
Now we are going to add views/index.jade, (*7)
!!!5
p hello #{word}
In the jade template above, we are looking for the php varialbe $word which is passed along in the $res->render method, (*8)
Now navigate to /render_test and you should see:, (*9)
<!DOCTYPE html>
<p>hello world</p>