Chapters

20 Chapters | 1:53:05 |

01

Setting up our Symfony App

4:34
02

Getting to Know our Tiny Project

4:14
03

Routes, Controllers & Responses

6:17
04

Magical Flex Recipes

5:40
05

Twig & Templates

8:12
06

Twig Template Inheritance

3:50
07

Debugging with the Amazing Profiler

4:28
08

Creating JSON API Endpoints

7:17
09

Services: The Backbone of Everything

7:47
10

Creating your own Service

7:04
11

Fancier Routes: Requirements, Wildcards, and More

6:56
12

Generating URLs

5:31
13

CSS & JavaScript with Asset Mapper

6:17
14

Tailwind CSS

6:15
15

Twig Partials & for Loops

2:44
16

PHP Enums

3:30
17

Smart Model Methods & Making the Design Dynamic

4:44
18

Stimulus: Writing Pro JavaScript

8:00
19

Turbo: Your Single Page App

4:32
20

Maker Bundle: Let's Generate Some Code!

5:13

> Symfony > Cosmic Coding with Symfony 7

19.

Turbo: Your Single Page App

|

|

Autoplay

Previous Chapter

Next Chapter

Login or Register to check out the script

8 Comments

Sort By

Login or Register to join the conversation

Ludovic-J 1 year ago edited

hello do you have any idea why when i install symfony/ux-turbo, i have this exception :

An exception has been thrown during the rendering of a template ("Could not find an asset mapper path that points to the "turbo-core" controller in package "symfony/ux-turbo", defined in controllers.json.").

i use asset-mapper and my controller.json file seem good :

{
    "controllers": {
        "@symfony/ux-turbo": {
            "turbo-core": {
                "enabled": true,
                "fetch": "eager"
            },
            "mercure-turbo-stream": {
                "enabled": false,
                "fetch": "eager"
            }
        }
    },
    "entrypoints": []
}

what i missing ?

|

Ludovic-J Ludovic-J 1 year ago edited

Re, after many hours i check how Symfony UX bundles provide path to asset-mapper.
For symfony/ux-turbo, i think this method is used for define path to asset-mapper (or maybe i am totally wrong :D).

// vendor/symfony/ux-turbo/src/DependencyInjection/TurboExtention.php
    public function prepend(ContainerBuilder $container): void
        {
            if (!$this->isAssetMapperAvailable($container)) {
                return;
            }

        $container->prependExtensionConfig('framework', [
            'asset_mapper' => [
                'paths' => [
                    __DIR__.'/../../assets/dist' => '@symfony/ux-turbo',
                ],
                'importmap_script_attributes' => [
                    'data-turbo-track' => 'reload',
                ],
            ],
        ]);
    }

If i am right, why isAssetMapperAvailable return false ?

Into asset_mapped.yaml i define the path manully :

framework:
    asset_mapper:
        # The paths to make available to the asset mapper.
        paths:
            - assets/
            - { value: '%kernel.project_dir%/vendor/symfony/ux-turbo/assets/dist', namespace: '@symfony/ux-turbo' }
        missing_import_mode: strict

When i run php bin/console debug:asset-map, i see @symfony/ux-turbo path:

 --------------------------------------------------- --------------------------
  Path                                                Namespace prefix
 --------------------------------------------------- --------------------------
  C:\sites\starshop\vendo...ulus-bundle\assets\dist   @symfony/stimulus-bundle
  C:\sites\starshop\assets
  C:\sites\starshop\vendo...ny\ux-turbo\assets\dist   @symfony/ux-turbo
 --------------------------------------------------- --------------------------

|

sadikoff Ludovic-J 1 year ago edited

Hey @Ludovic-J

Have you tried to remove the cache directory completely? Maybe something was cached too hard and system can't detect AssetMapper installed and configured properly.

Cheers!

|

Krishnadas-Pc 2 years ago

If we use react/angular it updates only part of the page right? full page reload over Ajax will have performance issues when we use Turbo compared to react in bigger applications?

|

MolloKhan SFCASTS Krishnadas-Pc 2 years ago edited

Hey @Krishnadas-Pc

The AJAX requests made by Turbo does not trigger a full page reload. It will make a normal request to your backend, but it will update only the HTML content that needs to change, so it won't load all of your assets, scripts, etc on each page load

Cheers!

1 |

Mahmut-A 2 years ago

Hello,

To do activate Turbo in my web, do I have to add stimulus controller to any element?
In my my web page, I did not connect stimulus controller to any element. I see turbo is not working now.
is it normal?

thank you

|

MolloKhan SFCASTS Mahmut-A 2 years ago edited

You should be able to run Turbo without Stimulus, they aren't dependent on each other. If you load a Stimulus controller does Turbo starts working? Do you see any errors in the browser's console?

Cheers!

1 |

Mahmut-A MolloKhan 2 years ago

Hi,

I fixed by addind javascipt block to my twig file thank you so much

|

This tutorial works perfectly with both Symfony 7 & 8!

Symfony 7

What PHP libraries does this tutorial use?

// composer.json
{
    "require": {
        "php": ">=8.2",
        "ext-ctype": "*",
        "ext-iconv": "*",
        "php-cs-fixer/shim": "^3.46", // v3.46.0
        "phpdocumentor/reflection-docblock": "^5.3", // 5.3.0
        "phpstan/phpdoc-parser": "^1.25", // 1.25.0
        "symfony/asset": "7.0.*", // v7.0.3
        "symfony/asset-mapper": "7.0.*", // v7.0.2
        "symfony/console": "7.0.*", // v7.0.2
        "symfony/dotenv": "7.0.*", // v7.0.2
        "symfony/flex": "^2", // v2.4.3
        "symfony/framework-bundle": "7.0.*", // v7.0.2
        "symfony/monolog-bundle": "^3.0", // v3.10.0
        "symfony/property-access": "7.0.*", // v7.0.0
        "symfony/property-info": "7.0.*", // v7.0.0
        "symfony/runtime": "7.0.*", // v7.0.0
        "symfony/serializer": "7.0.*", // v7.0.2
        "symfony/stimulus-bundle": "^2.13", // v2.13.3
        "symfony/twig-bundle": "7.0.*", // v7.0.0
        "symfony/ux-turbo": "^2.13", // v2.13.2
        "symfony/yaml": "7.0.*", // v7.0.0
        "symfonycasts/tailwind-bundle": "^0.7.1", // v0.7.1
        "twig/extra-bundle": "^2.12|^3.0", // v3.8.0
        "twig/twig": "^2.12|^3.0" // v3.8.0
    },
    "require-dev": {
        "symfony/debug-bundle": "7.0.*", // v7.0.0
        "symfony/maker-bundle": "^1.52", // v1.53.0
        "symfony/stopwatch": "7.0.*", // v7.0.0
        "symfony/web-profiler-bundle": "7.0.*" // v7.0.2
    }
}

Previous Chapter

Next Chapter