Flag of Ukraine
SymfonyCasts stands united with the people of Ukraine

AssetMapper: JS Moderno sin Sistema de Compilación

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
    }
}

¿Alguna vez has querido simplemente... escribir JavaScript moderno y que funcione sin necesidad de complicarte con un sistema de compilación?

¡Yo también! Y por fin, gracias a los avances en la web, los servidores web y el nuevo componente de Symfony, ¡es posible! ¡Hola AssetMapper! En este tutorial, vamos a aprender:

  • Los fundamentos del JavaScript moderno en un navegador, por qué y cómo las cosas finalmente "simplemente funcionan"
  • Instalar el nuevo componente AssetMapper
  • Entender las "rutas lógicas" de los activos y el versionado
  • Trabajar con el nuevo archivo importmap.php y importmap:require
  • Uso de CSS, junto con preprocesadores como Sass o Tailwind
  • Añadir StimulusBundle y controladores UX de terceros
  • ¡Controladores de Stimulus diferidos!
  • Encontrar archivos de paquetes y (opcionalmente) descargarlos
  • CSS y JS específicos de la página
  • Despliegue
  • Medición y ajuste del rendimiento + precarga

Con AssetMapper, se vuelve a lo bonito y básico de programar, refrescar y volver al trabajo.


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 hace 1 mes

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