Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

SymfonyCasts

AssetMapper: Modern JS with Zero Build System

via SymfonyCasts

Overview

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.

Syllabus

  • A World without Build Systems?
  • Doing Modern JS Right in your Browser
  • Installing AssetMapper
  • Mapping Assets
  • CSS & Background Images
  • 3rd Party CSS
  • Adding Fonts
  • Tailwind CSS
  • JavaScript & importmap
  • importmap:require - 3rd Party JS Libs
  • Importing Specific Package Files
  • Adding Stimulus
  • Symfony UX Stimulus Packages
  • Lazy Stimulus Controllers
  • Debugging
  • Page-Specific CSS & JS
  • Excluding Files
  • Deploying to Platform.sh
  • Configuring the Platform.sh Deploy
  • Deploying the Assets
  • Long-Term Caching, Compression & File Combining
  • Optimizing & Profiling
  • Preloading

Taught by

Ryan Weaver

Reviews

Start your review of AssetMapper: Modern JS with Zero Build System

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.