Chapters

27 Chapters | 3:13:54 |

01

Hello Layouts+ Setup!

7:30
02

Creating & Mapping Layouts

11:31
03

Adding Twig Blocks to your Dynamic Layout

4:33
04

Shared Layouts

7:25
05

Adding More Customized Blocks

5:16
06

Adding Lists: Value Type

9:58
07

Value Converter

8:50
08

Item View Template

6:27
09

Frontend Item View

7:41
10

Ajax Pagination & CSS/JS

6:43
11

Content Browser

9:02
12

Content Browser: Returning the Items

5:33
13

Value Loader + Preview Template

7:31
14

Contentful: Loading Data from an External CMS

8:02
15

Mapping a Layout to Contentful Pages

7:55
16

Building the Contentful Page

6:07
17

Customizing the Contentful Slugger

5:36
18

The Skills List Page + A Grid of Skills

7:36
19

Themes & Overriding Templates

5:19
20

Block Views & View Types

9:33
21

Deep Dive into Item Views

6:47
22

Prepending Config

3:55
23

Contentful Item Template

6:12
24

Block Views & Block Definitions

4:48
25

Custom Block View

7:45
26

Custom Item View Type

6:04
27

Block Plugins

10:15

> Symfony 5 > Netgen Layouts: Building Pages with Symfony

Buy Access to Course

01.

Hello Layouts+ Setup!

|

|

Autoplay

Next Chapter

Login or register to check out the script

22 Comments

Sort By

Login or Register to join the conversation

Rufnex 2 years ago

Hi, i tried to install netgen layouts but i got this error:

composer require netgen/layouts-standard
Using version ^1.4 for netgen/layouts-standard
./composer.json has been updated
Running composer update netgen/layouts-standard
Loading composer repositories with package information
Updating dependencies
Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - netgen/layouts-standard 1.4.2 requires netgen/layouts-core ~1.4.3 -> satisfiable by netgen/layouts-core[1.4.3, 1.4.4, 1.4.5, 1.4.6].
    - netgen/layouts-standard[1.4.0, ..., 1.4.1] require netgen/layouts-core ~1.4.0 -> satisfiable by netgen/layouts-core[1.4.0, ..., 1.4.6].
    - netgen/layouts-core[1.4.0, ..., 1.4.6] require egulias/email-validator ^2.1.25 || ^3.2 -> found egulias/email-validator[2.1.25, 3.2, ..., 3.2.6] but the package is fixed to 4.0.1 (lock file version) by a partial update and that version does not match. Make sure you list it as an argument for the update command.
    - Root composer.json requires netgen/layouts-standard ^1.4 -> satisfiable by netgen/layouts-standard[1.4.0, 1.4.1, 1.4.2].

Use the option --with-all-dependencies (-W) to allow upgrades, downgrades and removals for packages currently locked to specific versions.
You can also try re-running composer require with an explicit version constraint, e.g. "composer require netgen/layouts-standard:*" to figure out if any version is installable, or "composer require netgen/layouts-standard:^2.1" if you know which you need.

Installation failed, reverting ./composer.json and ./composer.lock to their original content.

Is there an installation step before .. like yarn and node modules? Thank you for help.

|

Victor SFCASTS Rufnex 2 years ago

Hey Rufnex,

Seems you have a dependencies incompatibility issue in Composer. We're using Netgen Layouts v1.3.2 in this course, could you try to run:

composer require "netgen/layouts-standard:^1.3.2"

or do like Composer suggests you:

composer require netgen/layouts-standard --with-all-dependencies

But it will also upgrade your dependencies that may require more changes from your side after this.

Please, let us know what command helps.

Cheers!

|

Rufnex Victor 2 years ago edited

Hi Victor,
thank you for your response. the all dependencies flag i tried already

...

Package operations: 0 installs, 1 update, 1 removal
  - Removing nyholm/psr7 (1.8.0)
  - Downgrading symfonycasts/reset-password-bundle (v1.18.0 => v1.17.0): Extracting archive
Package php-http/message-factory is abandoned, you should avoid using it. Use psr/http-factory instead.
Package sensio/framework-extra-bundle is abandoned, you should avoid using it. Use Symfony instead.

...

  - Installing nyholm/psr7 (1.8.0): Extracting archive
Package php-http/message-factory is abandoned, you should avoid using it. Use psr/http-factory instead.
Package sensio/framework-extra-bundle is abandoned, you should avoid using it. Use Symfony instead.

...

-  WARNING  netgen/content-browser (>=1.0): From github.com/symfony/recipes-contrib:main
    The recipe for this package comes from the "contrib" repository, which is open to community contributions.
    Review the recipe at https://github.com/symfony/recipes-contrib/tree/main/netgen/content-browser/1.0

but this gives me warnings i dont want .. or is it not a big problem?

composer require "netgen/layouts-standard:^1.3.2" gives me the error from my start posting.

Thank you

Greetings

|

Victor SFCASTS Rufnex 2 years ago

Hey Rufnex,

That warning about executing a recipe from a contrib repo? That should be OK, it means that the bundle will add more files to your project or may change some files in it... but if you trust the bundle - that it's OK. You see this warning because that bundles is not maintained by Symfony core team, and so its recipe is located in the https://github.com/symfony/recipes-contrib repo.

Btw, you can ignore installing that recipy and pull all those files manually, but that's not very convenient. Also, no matter if you trust the repo or no - it's always a good idea to double-check all the changes that Symfony Flex made in your project. So, before installing a bundle that will execute a recipe, you first commit all the changes, then run the Composer install command, and then check the diff you have and new files that appear in your project.

Cheers!

|

Thierry 2 years ago

Hi, I was searching such a "layout bundle" for a new project, an this one looked very promising.... until these lines : One caveat is that these migrations are written for MySQL specifically. Layouts only supports MySQL right now.

In a nutshell, do you know what are the incompatibilities with PostgreSQL ? Are you aware of any known alternative to implement a CMS kinda layout solution in a SF project ? Thanks all for the amazing work !

|

Victor SFCASTS Thierry 2 years ago

Hey Thierry!

Good question :) And I see you even found some answers on the related GitHub repo: https://github.com/netgen-layouts/layouts-standard/issues/6 - well done! I attached it as a reference for others because your question is a good one, and probably only maintainers could shed a good light on it :)

Cheers!

|

Tac-Tacelosky 2 years ago

This looks like an awesome tool. Starting at the end (the 'finish' folder in the source), I'd like to see the final site with data. But there are no layouts. I see there's a nglayouts:import console command, butt I don't the see layouts from this tutorial there. Is it possible to get those layouts, so I can see it running locally without having to manually create each layout? Or am I missing something during the setup.

|

Victor SFCASTS Tac-Tacelosky 2 years ago

Hey Tac,

Are you sure you're in the finish/ code? Are you sure you're looking at the course download code of this exact tutorial? I just downloaded the zip archive of the course project code and I can see "src/Layouts/" and "templates/nglayouts/" folders with files inside.

Please, double check you're in the correct folder.

Cheers!

|

Joris-Mak 3 years ago

Starting now, I'm excited to see what this does.

In our agency we do Symfony or Drupal... and in a lot of projects which we start as Symfony, we end up doing 'a little bit of CMS-alike functionality'. So I've been looking for some bundle or something to add something simple to an existing project.

Recently, Sulu was made Symfony 6.x compatible, so I jumped on it. And I'm very, very happy with the CMS part. The documentation is a bit sketchy, but that might be because I'm used to the Symfony pages :wink:.

But that Sulu Admin that is written as a single React app is a bit of a downer. It means we either need to ship with two admins, one for our normal admin stuff (using custom code, or Easy Admin, or whatever) and then one for the CMS part. Yes, it can be extended, but with quite some scaffolding and then you 'only' get a simple CRUD style, like a data table with an add/edit form. That often won't be enough in the real world, and that means writing custom React views to add something to the admin...while I prefer to keep it in twig / php, or at least use my Vue expertise... but to learn React just to extend an CMS admin...

|

MolloKhan SFCASTS Joris-Mak 3 years ago

Hey Joris!

Thanks for sharing your thoughts about Sulu, and yea... I got your point, it's a bummer to be forced to learn new technology just because a third-party library is not flexible enough.
I hope you like Netgens, and let us know what you think about it once you've finished with the tutorial ;)

Cheers!

|

Tasatko 3 years ago

Hi Ryan!
What about license agreement of code in example? Can I customize it for any reason of use?

|

MolloKhan SFCASTS Tasatko 3 years ago

Hey Tasatko,

I'm afraid I don't fully understand your question. Do you mean if you can use the code used in this tutorial in other places?

|

Tasatko MolloKhan 3 years ago

yes

|

MolloKhan SFCASTS Tasatko 3 years ago

Hey Tasatko,

Sorry for my super late reply, the holidays got in the middle. Feel free to use our code samples :)

Cheers!

1 |

Ruslan 3 years ago

HI ,
I get small issue:
when I run :
composer require netgen/layouts-standard
I got this error:
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 1310720 bytes) in /workspaces/netGen/vendor/twig/twig/src/NodeVisitor/SafeAnalysisNodeVisitor.php on line 71

php -i | grep memory_limit
memory_limit => 128M => 128M

Should I set more limit?

|

Victor SFCASTS Ruslan 3 years ago HIGHLIGHTED

Hey Ruslan,

Yep, you should :) 128M is too little for CLI when you try to run composer require/update commands. Actually, there is a better way, check the official docs to know more options how to fix it: https://getcomposer.org/doc/articles/troubleshooting.md#memory-limit-errors

Cheers!

2 |

Ruslan Victor 3 years ago

Hi Victor,
Thank for that advice, it's helpful.

BR.
Ruslan.

|

Victor SFCASTS Ruslan 3 years ago

Hey Ruslan,

Great, thanks for confirming it helped :)

Cheers!

|

Richard 3 years ago

Hi, I'd like so much to go on in this course but i'm stuck with this error :
Unable to find file "@LiveComponentBundle/Resources/config/routing/live_component.xml". [...]
I first downloaded the source code of the course : 'start'.

I did adjust the .env file to fit MySQL for Mac OS (credentials : root:root, base:'layouts')
Followed scrupulously the readMe text and I updated the vendor folder with composer and installed yarn.
Then yarn watch and start the php server.

Last, whether I include "docker-compose up -d" or not, I get this error.
Unable to find file "@LiveComponentBundle/Resources/config/routing/live_component.xml"
Same thing with the 'finish' folder :-(
What did I missed ?

Thanks for attention, Richard.

|

weaverryan SFCASTS Richard 3 years ago

Hey @Richard!

Ah, I know the issue! Since you did a composer update, also do a composer recipes:update symfony/ux-live-component. Your upgrade probably upgraded you to the latest LiveComponents package, and a config file moved around in that version (updating the recipe will update the path to that config file).

Cheers!

|

Richard weaverryan 3 years ago edited

I had to complete with a

composer recipes:install symfony/ux-live-component --force -v

but, anyway it's working now.
Bonne soirée.

1 |

weaverryan SFCASTS Richard 3 years ago

Yes, you're right about those flags. I'm glad it's working now! I'm the one who made that change on live components, so it's my own fault 😜

1 |

Symfony 5.4

What PHP libraries does this tutorial use?

// composer.json
{
    "require": {
        "php": ">=8.2",
        "ext-ctype": "*",
        "ext-iconv": "*",
        "babdev/pagerfanta-bundle": "^3.7", // v3.7.0
        "doctrine/doctrine-bundle": "^2.7", // 2.7.0
        "doctrine/doctrine-migrations-bundle": "^3.2", // 3.2.2
        "doctrine/orm": "^2.13", // 2.13.3
        "easycorp/easyadmin-bundle": "^4.4", // v4.4.1
        "netgen/layouts-contentful": "^1.3", // 1.3.2
        "netgen/layouts-standard": "^1.3", // 1.3.1
        "pagerfanta/doctrine-orm-adapter": "^3.6",
        "sensio/framework-extra-bundle": "^6.2", // v6.2.8
        "stof/doctrine-extensions-bundle": "^1.7", // v1.7.0
        "symfony/console": "5.4.*", // v5.4.14
        "symfony/dotenv": "5.4.*", // v5.4.5
        "symfony/flex": "^1.17|^2", // v2.2.3
        "symfony/framework-bundle": "5.4.*", // v5.4.14
        "symfony/monolog-bundle": "^3.0", // v3.8.0
        "symfony/proxy-manager-bridge": "5.4.*", // v5.4.6
        "symfony/runtime": "5.4.*", // v5.4.11
        "symfony/security-bundle": "5.4.*", // v5.4.11
        "symfony/twig-bundle": "5.4.*", // v5.4.8
        "symfony/ux-live-component": "^2.x-dev", // 2.x-dev
        "symfony/ux-twig-component": "^2.x-dev", // 2.x-dev
        "symfony/validator": "5.4.*", // v5.4.14
        "symfony/webpack-encore-bundle": "^1.15", // v1.16.0
        "symfony/yaml": "5.4.*", // v5.4.14
        "twig/extra-bundle": "^2.12|^3.0", // v3.4.0
        "twig/twig": "^2.12|^3.0" // v3.4.3
    },
    "require-dev": {
        "doctrine/doctrine-fixtures-bundle": "^3.4", // 3.4.2
        "symfony/debug-bundle": "5.4.*", // v5.4.11
        "symfony/maker-bundle": "^1.47", // v1.47.0
        "symfony/stopwatch": "5.4.*", // v5.4.13
        "symfony/web-profiler-bundle": "5.4.*", // v5.4.14
        "zenstruck/foundry": "^1.22" // v1.22.1
    }
}

Next Chapter