Chapters

13 Chapters | 1:14:58 |

01

Symfony 4: Let's Launch!

4:03
02

Our Micro-App & PhpStorm Setup

5:37
03

Routes, Controllers, Pages, oh my!

7:16
04

Symfony Flex & Aliases

5:51
05

The Twig Recipe

2:49
06

Twig ❤️

8:23
07

Web Debug Toolbar & the Profiler!

3:55
08

Debugging & Packs

3:16
09

Assets: CSS & JavaScript

8:51
10

Generating URLs

5:48
11

JavaScript & Page-Specific Assets

5:16
12

JSON API Endpoint

6:29
13

Services

7:24

This tutorial has a new version, check it out!

> Symfony 4 > Stellar Development with Symfony 4

05.

The Twig Recipe

Autoplay

Previous Chapter

Next Chapter

Do you remember the only rule for a controller? It must return a Symfony Response object! But Symfony doesn't care how you do that: you could render a template, make API requests or make database queries and build a JSON response.

Tip

Technically, a controller can return anything. Eventually, you'll learn how and why to do this.

Really, most of learning Symfony involves learning to install and use a bunch of powerful, but optional, tools that make this work easier. If your app needs to return HTML, then one of these great tools is called Twig.

Installing Twig

First, make sure you commit all of your changes so far:

git status

I already did this. Recipes are so much more fun when you can see what they do! Now run:

composer require twig

By the way, in future tutorials, our app will become a mixture of a traditional HTML app and an API with a JavaScript front-end. So if you want to know about building an API in Symfony, we'll get there!

This installs TwigBundle, a few other libraries and... configures a recipe! What did that recipe do? Let's find out:

git status

Woh! Lot's of good stuff! The first change is config/bundles.php:

            Copy Code

                            Show All Lines

                        9 lines
            |
            config/bundles.php
        
                Show Lines

                                                    // ... lines 1 - 2
                            
            return [
        
                Show Lines

                                                    // ... lines 4 - 6
                            
                Symfony\Bundle\TwigBundle\TwigBundle::class => ['all' => true],
        
            ];

Bundles are the "plugin" system for Symfony. And whenever we install a third-party bundle, Flex adds it here so that it's used automatically. Thanks Flex!

The recipe also created some stuff, like a templates/ directory! Yep, no need to guess where templates go: it's pretty obvious! It even added a base layout file that we'll use soon.

Twig also needs some configuration, so the recipe added it in config/packages/twig.yaml:

            Copy Code

                        5 lines
            |
            config/packages/twig.yaml
        
            twig:
        
                paths: ['%kernel.project_dir%/templates']
        
                debug: '%kernel.debug%'
        
                strict_variables: '%kernel.debug%'

But even though this file was added by Flex, it's yours to modify: you can make whatever changes you want.

Oh, and I love this! Why do our templates need to live in a templates/ directory. Is that hardcoded deep inside Symfony? Nope! It's right here!

            Copy Code

                            Show All Lines

                        5 lines
            |
            config/packages/twig.yaml
        
            twig:
        
                paths: ['%kernel.project_dir%/templates']
        
                Show Lines

                                                    // ... lines 3 - 5

Don't worry about this percent syntax yet - you'll learn about that in a future episode. But, you can probably guess what's going on: %kernel.project_dir% is a variable that points to the root of the project.

Anyways, looking at what a recipe did is a great way to learn! But the main lesson of Flex is this: install a library and it takes care of the rest.

Now, let's go use Twig!

5 Comments

Sort By

Maxim M. 6 years ago

In addition to the lesson.

Running the command:
composer require knplabs/knp-menu-bundle

Among other logs, get:
Symfony operations: 1 recipe (b8582560d80e1e5da8d9bd613b6bf8f0)
- Configuring knplabs / knp-menu-bundle (>=v2.2.1): From auto-generated recipe

Where is this recipe?
Because "knplabs / knp-menu-bundle" has "type": "symfony-bundle"?

| Reply |

Victor SFCASTS Maxim M. 6 years ago

Hey Maxim,

Yes, by default Symfony Flex run at least register bundles in config/bundles.php even if the bundle does not have a recipe in both "symfony/recipes" and "symfony/recipes-contrib" repositories. If you use Git, you can commit all changes, then install the bundle and check diff with "git diff" command - you'll see that bundles.php was changed and that's it, no additional files were created, modified, etc. That's exactly what mean the output in your case.

And yes, it because of symfony-bundle type, that's how Symfony Flex knows that you're installing a bundle.

Cheers!

1 | Reply |

Dmitriy 6 years ago

I installed the bundle and it requires to make changes to the file app/config/config.yml. But in symphony 4 there is no such file by default.

Also, Bundle did not create the *.yaml file in the "packages" directory.

Can I create the app/config/config.yml file manually? How can I add such settings to symphony 4?

Thank you.

| Reply |

Victor SFCASTS Dmitriy 6 years ago

Hey Dmitriy,

Did you run: "composer require twig"? Do you have Flex in your project? What version of the bundle did you install? And do you have the latest Composer version installed? Because Twig bundle already has a recipe, see: https://github.com/symfony/... , so it should create a config file for you in the config/packages/twig.yaml path where you need to write its configuration instead of app/config/config.yml. Also, this screencast may be interesting for you to figure out the difference between Symfony 3 and 4 version: https://knpuniversity.com/s... .

But if you don't have this config/packages/twig.yaml - you can create it manually, but probably you just need to reinstall (remove and install again) the bundle.

Cheers!

1 | Reply |

Dmitriy Victor 6 years ago

Thank you, Victor. I create manually file in config/packages/name_bundle.yaml. All works!

| Reply |

Symfony 4

What PHP libraries does this tutorial use?

// composer.json
{
    "require": {
        "php": "^7.1.3",
        "ext-iconv": "*",
        "sensio/framework-extra-bundle": "^5.1", // v5.1.3
        "symfony/asset": "^4.0", // v4.0.3
        "symfony/console": "^4.0", // v4.0.14
        "symfony/flex": "^1.0", // v1.17.6
        "symfony/framework-bundle": "^4.0", // v4.0.14
        "symfony/lts": "^4@dev", // dev-master
        "symfony/twig-bundle": "^4.0", // v4.0.3
        "symfony/web-server-bundle": "^4.0", // v4.0.3
        "symfony/yaml": "^4.0" // v4.0.14
    },
    "require-dev": {
        "easycorp/easy-log-handler": "^1.0.2", // v1.0.4
        "sensiolabs/security-checker": "^5.0", // v5.0.3
        "symfony/debug-bundle": "^3.3|^4.0", // v4.0.3
        "symfony/dotenv": "^4.0", // v4.0.14
        "symfony/monolog-bundle": "^3.0", // v3.1.2
        "symfony/phpunit-bridge": "^3.3|^4.0", // v4.0.3
        "symfony/profiler-pack": "^1.0", // v1.0.3
        "symfony/var-dumper": "^3.3|^4.0" // v4.0.3
    }
}

Previous Chapter

Next Chapter

The Twig Recipe

Share this awesome video!

Installing Twig

5 Comments

Delete comment?

What PHP libraries does this tutorial use?

Show Lines	// ... lines 1 - 2
	return [
Show Lines	// ... lines 4 - 6
	Symfony\Bundle\TwigBundle\TwigBundle::class => ['all' => true],
	];

	twig:
	paths: ['%kernel.project_dir%/templates']
	debug: '%kernel.debug%'
	strict_variables: '%kernel.debug%'