Home > Article > Backend Development > How to use Pug with CakePHP?
As web applications continue to develop, modern frameworks integrate more and more features to improve development efficiency and code quality. CakePHP is a popular web development framework that has components such as ORM, routing and views, allowing developers to focus more on the implementation of business functions.
The view part in CakePHP uses PHP as the main template language, which allows developers to easily use PHP code to create HTML pages. However, PHP templates often require a large number of front-end aspects of HTML elements and tags, which can appear too verbose in some cases. To solve this problem, a template engine called Pug was introduced into CakePHP and has won wide recognition from more and more developers.
Pug is a simplified HTML template language that does not require the annoying tag structure like HTML. Instead, it uses an indentation-like method to determine the relationship between elements, as well as the attributes and attributes of specific elements. content. Using Pug makes it faster to write and manage templates and allows developers to focus on design and business logic rather than template structure. Using Pug in CakePHP is also very simple, let’s explore it together.
Installing Pug
First, we need to make sure that Pug is installed in the CakePHP application. The installation process is the same as for other Composer packages, you can use the following command:
composer require pug-php/pug
This will download and install the latest version of Pug with all its Dependencies.
Create Pug View
Creating a Pug view is as easy as other view templates. Create a new file in the views directory and name it your-view-file.pug
. In a file, you can write HTML content in an indented manner. Here is a simple example:
html head title Welcome to My Site! body h1 My Site p This is my site.
The above code will create a simple HTML page with a title (Welcome to My Site) and an H1 title (My Site), and a P paragraph ( This is my site.).
Inherited Layout
Pug allows you to use "inherited layout" templates, which is similar to template inheritance in other modern template engines. This can greatly reduce duplicate HTML content and make the code more maintainable.
To use layout, you first need to create a template with the extension .pug
in the root directory, which contains some common layout elements. Then, use the "extends" option in other views to inherit this template. You can use "block" in a view to indicate that this view covers the layout element. Below is a simple example with a layout.
/public/layouts/default.pug
html head title My Site body block content
/views/pages/home.pug
extends ../layouts/default.pug block content h1 Welcome to My Site p This is my site.
This will create a view called "home" and When adding content around common elements set in a layout file, place the content into a "content" block.
Application Settings
When running a CakePHP application, PHP is used by default as the view template engine. Enabling Pug in your application is relatively simple, just change the instantiation method of the View
class to use Pug:
use JollymagicPugViewViewPugView; // In your controller public $viewClass = PugView::class;
This will enable Pug and then render your view using the Pug template . Now, you just need to store the .pug
file in the view directory and use the $this->render()
function in the controller to render the Pug file corresponding to the view. .
$this->render('home');
Conclusion
Using the Pug view engine in a CakePHP application is very simple, you just need to install Pug and change the instantiation method of the View
class in the application settings. That is Can. Additionally, the Pug templating language, which represents HTML elements in an indented manner, greatly reduces the verbosity of HTML tags, allowing you to focus on other important aspects of your application. Enjoy Pug!
The above is the detailed content of How to use Pug with CakePHP?. For more information, please follow other related articles on the PHP Chinese website!