Flag of Ukraine
SymfonyCasts stands united with the people of Ukraine

AssetMapper: Modern JS with Zero Build System

2:07:02

What you'll be learning

// composer.json
{
    "require": {
        "php": ">=8.1",
        "ext-ctype": "*",
        "ext-iconv": "*",
        "babdev/pagerfanta-bundle": "^4.0", // v4.2.0
        "doctrine/doctrine-bundle": "^2.7", // 2.10.0
        "doctrine/doctrine-migrations-bundle": "^3.2", // 3.2.4
        "doctrine/orm": "^2.12", // 2.15.2
        "knplabs/knp-time-bundle": "^1.18", // v1.20.0
        "pagerfanta/doctrine-orm-adapter": "^4.0", // v4.1.0
        "pagerfanta/twig": "^4.0", // v4.1.0
        "stof/doctrine-extensions-bundle": "^1.7", // v1.7.1
        "symfony/asset": "6.3.*", // v6.3.0
        "symfony/asset-mapper": "6.3.*", // v6.3.0
        "symfony/console": "6.3.*", // v6.3.0
        "symfony/dotenv": "6.3.*", // v6.3.0
        "symfony/flex": "^2", // v2.3.1
        "symfony/framework-bundle": "6.3.*", // v6.3.0
        "symfony/http-client": "6.3.*", // v6.3.0
        "symfony/monolog-bundle": "^3.0", // v3.8.0
        "symfony/proxy-manager-bridge": "6.3.*", // v6.3.0
        "symfony/runtime": "6.3.*", // v6.3.0
        "symfony/stimulus-bundle": "^2.9", // v2.9.1
        "symfony/twig-bundle": "6.3.*", // v6.3.0
        "symfony/ux-turbo": "^2.9", // v2.9.1
        "symfony/web-link": "6.3.*", // v6.3.0
        "symfony/yaml": "6.3.*", // v6.3.0
        "twig/extra-bundle": "^2.12|^3.0", // v3.6.1
        "twig/twig": "^2.12|^3.0" // v3.6.1
    },
    "require-dev": {
        "doctrine/doctrine-fixtures-bundle": "^3.4", // 3.4.4
        "symfony/debug-bundle": "6.3.*", // v6.3.0
        "symfony/maker-bundle": "^1.41", // v1.49.0
        "symfony/stopwatch": "6.3.*", // v6.3.0
        "symfony/web-profiler-bundle": "6.3.*", // v6.3.0
        "zenstruck/foundry": "^1.21" // v1.33.0
    }
}

Ever wanted to just... write modern JavaScript and have it work without needing to fuss with a build system?

Me too! And finally - thanks to advances in the web, web servers & new component from Symfony, it's possible! Hello AssetMapper! In this tutorial, we'll:

  • The basics of modern JavaScript in a browser, why & how things finally "just work" & shim
  • Installing the new AssetMapper component
  • Understanding asset "logical paths" & versioning
  • Working with the new importmap.php file & importmap:require
  • Using CSS, along with pre-processors like Sass or Tailwind
  • Adding StimulusBundle & 3rd party UX controllers
  • Lazy Stimulus controllers!
  • Finding package files and (optionally) downloading them
  • Page-specific CSS & JS
  • Deploying!
  • Measuring & tweaking performance + preloading

With AssetMapper, it's back to the beautiful basics of coding, refreshing and getting back to work.


Your Guides

Ryan Weaver

Buy Access

Join the Conversation?

4
Login or Register to join the conversation
Ruslan Avatar

Hi. When we will test for Stymulus controllers? :)

Reply

Hey @Ruslan!

By "test for Stimulus controllers", you do mean actually write tests (e.g. unit/functional tests) for Stimulus controllers? If so, not in this tutorial - but that IS something we should chat about. We're releasing some testing courses, that should be part of it somewhere I realize 🤔.

2 Reply
Fabrice Avatar
Fabrice Avatar Fabrice | posted 1 month ago

Hello! I didn't know where to propose the idea, so I put it here:

A course to learn how to master DataTable with Symfony would be great! There are so many things to do with this library. Use Ajax, add fields at the top of each column to filter, add checkboxes, events.

All why not using Stimulus?

By the way, I've always wondered if it was possible to override EasyAdmin to use DataTables instead, and have it use Ajax requests.

In short, if one day you decide to create this course, it will be insane!

Reply

Hey @Fabrice

Thank you for your feedback! I'll share it with the team

By the way, I've always wondered if it was possible to override EasyAdmin to use DataTables instead and have it use Ajax requests.

Honestly, I don't know how hard/easy it would be to do so. I know you can override a bunch of stuff of EasyAdmin though

Cheers!

1 Reply
Cat in space

"Houston: no signs of life"
Start the conversation!

userVoice