Symfony gives you the flexibility to choose any front-end tools you want. There are generally two approaches:
- building your HTML with PHP & Twig;
Both work great - and are discussed below.
Symfony comes with two powerful options to help you build a modern and fast frontend:
- AssetMapper (recommended for new projects) runs entirely in PHP, doesn't require any build step and leverages modern web standards.
- Webpack Encore is built with Node.js on top of Webpack.
|Requires a build step?
|Works in all browsers?
|Supports React, Vue, Svelte?
|Removes comments from CSS
 There are some PostCSS plugins available to remove comments from CSS files.
AssetMapper is the recommended system for handling your assets. It runs entirely
in PHP with no complex build step or dependencies. It does this by leveraging
importmap feature of your browser, which is available in all browsers thanks
to a polyfill.
Do you prefer video tutorials? Check out the Webpack Encore screencast series.
To learn about Stimulus & the UX Components, see the StimulusBundle Documentation
If you want to use a front-end framework (Next.js, React, Vue, Svelte, etc), we recommend using their native tools and using Symfony as a pure API. A wonderful tool to do that is API Platform. Their standard distribution comes with a Symfony-powered API backend, frontend scaffolding in Next.js (other frameworks are also supported) and a React admin interface. It comes fully Dockerized and even contains a web server.