Webpack Encore: Frontend like a Pro!
Offered By: SymfonyCasts
Course Description
Overview
Writing great PHP code but your JavaScript looks a little bit hacky? It's not your fault! Before Webpack, coding "correctly" in JavaScript... sorta wasn't possible!
But setting up Webpack can be a pain. So... hello Webpack Encore! Encore allows you to modern JavaScript starting... immediately! Go, go go!
- Installing Encore & yarn
- webpack.config.js & your first Webpack build!
- Adding script & link tags thanks to WebpackEncoreBundle: encore_entry_script_tags() & encore_entry_link_tags()
- Modules! require, import and export
- Installing & using external libraries
- jQuery plugins & global variables
- Handling CSS! Including fonts & images
- Code splitting: free, smart optimization
- Sass & Overriding Bootstrap Sass Variables
- Copying static files
- Multiple "entries": page-specific CSS & JavaScript
- PostCSS, Bower, browserslist, polyfills & new features in old browsers
- enableSingleRuntimeChunk()?
- Async imports!
Syllabus
- Hello Webpack Encore
- Webpacking our First Assets
- Twig Helpers, entrypoints.json & yarn Scripts
- Modules: require() & import()
- Importing External Libraries & Global Variables
- Bootstrap & the Curious Case of jQuery Plugins
- The Magic of Split Chunks
- Importing 3rd Party CSS + Image Paths
- Sass & Overriding Bootstrap Variables
- Copying Files
- Page-Specific JS: Multiple Entries
- Entry Refactoring
- Refactoring Autocomplete JS & CSS
- Auto-Provide jQuery for Mischievous Packages
- addStyleEntry(): CSS-Only Entrypoint
- Support any Browser with PostCSS & Babel
- browserslist: What Browsers do you need to Support?
- Polyfills & Babel
- The Single Runtime Chunk
- Async Imports
- Production Build & Deployment
Taught by
Ryan Weaver
Related Courses
Software as a ServiceUniversity of California, Berkeley via Coursera Intro to Computer Science
University of Virginia via Udacity Web Development
Udacity Software Engineering for SaaS
University of California, Berkeley via Coursera CS50's Introduction to Computer Science
Harvard University via edX