diff --git a/.gitignore b/.gitignore
index de562d7..b7b4741 100644
--- a/.gitignore
+++ b/.gitignore
@@ -18,3 +18,12 @@
.phpunit.result.cache
/phpunit.xml
###< symfony/phpunit-bridge ###
+
+###> symfony/webpack-encore-bundle ###
+/node_modules/
+/public/build/
+npm-debug.log
+yarn-error.log
+###< symfony/webpack-encore-bundle ###
+
+.idea/
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..0c8ca86
--- /dev/null
+++ b/README.md
@@ -0,0 +1,17 @@
+Symfony Playground
+
+Main installation:
+
+- Symfony 6.3
+- symfony/webpack-encore-bundle
+- Home controller /
+- Bootstrap 5
+- jQuery
+- SASS
+
+Run:
+
+- yarn dev-server
+- symfony serve
+
+http://localhost:8000
diff --git a/assets/app.js b/assets/app.js
new file mode 100644
index 0000000..6c61187
--- /dev/null
+++ b/assets/app.js
@@ -0,0 +1,22 @@
+/*
+ * Welcome to your app's main JavaScript file!
+ *
+ * We recommend including the built version of this JavaScript file
+ * (and its CSS file) in your base layout (base.html.twig).
+ */
+
+// any CSS you import will output into a single css file (app.css in this case)
+import './styles/app.scss';
+
+const $ = require('jquery');
+// this "modifies" the jquery module: adding behavior to it
+// the bootstrap module doesn't export/return anything
+require('bootstrap');
+
+// or you can include specific pieces
+// require('bootstrap/js/dist/tooltip');
+// require('bootstrap/js/dist/popover');
+
+$(document).ready(function() {
+ $('[data-toggle="popover"]').popover();
+});
diff --git a/assets/styles/app.scss b/assets/styles/app.scss
new file mode 100644
index 0000000..7d8db3e
--- /dev/null
+++ b/assets/styles/app.scss
@@ -0,0 +1,4 @@
+$primary: darken(#428bca, 20%);
+
+// the ~ allows you to reference things in node_modules
+@import "~bootstrap/scss/bootstrap";
diff --git a/composer.json b/composer.json
index 672b705..6fdb418 100644
--- a/composer.json
+++ b/composer.json
@@ -37,6 +37,7 @@
"symfony/twig-bundle": "6.3.*",
"symfony/validator": "6.3.*",
"symfony/web-link": "6.3.*",
+ "symfony/webpack-encore-bundle": "^2.1",
"symfony/yaml": "6.3.*",
"twig/extra-bundle": "^2.12|^3.0",
"twig/twig": "^2.12|^3.0"
diff --git a/composer.lock b/composer.lock
index e3c2493..d1c540a 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
"This file is @generated automatically"
],
- "content-hash": "e077926b0d83c217ece524f4a3d61fa8",
+ "content-hash": "b8ed8c2cae7cd5bb2c217f66a7221c83",
"packages": [
{
"name": "doctrine/cache",
@@ -6950,6 +6950,77 @@
],
"time": "2023-04-21T14:41:17+00:00"
},
+ {
+ "name": "symfony/webpack-encore-bundle",
+ "version": "v2.1.0",
+ "source": {
+ "type": "git",
+ "url": "https://github.com/symfony/webpack-encore-bundle.git",
+ "reference": "50d4af5cca35dab66a51dfeeb63616937ba96f4a"
+ },
+ "dist": {
+ "type": "zip",
+ "url": "https://api.github.com/repos/symfony/webpack-encore-bundle/zipball/50d4af5cca35dab66a51dfeeb63616937ba96f4a",
+ "reference": "50d4af5cca35dab66a51dfeeb63616937ba96f4a",
+ "shasum": ""
+ },
+ "require": {
+ "php": ">=8.1.0",
+ "symfony/asset": "^5.4 || ^6.2 || ^7.0",
+ "symfony/config": "^5.4 || ^6.2 || ^7.0",
+ "symfony/dependency-injection": "^5.4 || ^6.2 || ^7.0",
+ "symfony/http-kernel": "^5.4 || ^6.2 || ^7.0",
+ "symfony/service-contracts": "^1.1.9 || ^2.1.3 || ^3.0"
+ },
+ "require-dev": {
+ "symfony/framework-bundle": "^5.4 || ^6.2 || ^7.0",
+ "symfony/phpunit-bridge": "^5.4 || ^6.2 || ^7.0",
+ "symfony/twig-bundle": "^5.4 || ^6.2 || ^7.0",
+ "symfony/web-link": "^5.4 || ^6.2 || ^7.0"
+ },
+ "type": "symfony-bundle",
+ "extra": {
+ "thanks": {
+ "name": "symfony/webpack-encore",
+ "url": "https://github.com/symfony/webpack-encore"
+ }
+ },
+ "autoload": {
+ "psr-4": {
+ "Symfony\\WebpackEncoreBundle\\": "src"
+ }
+ },
+ "notification-url": "https://packagist.org/downloads/",
+ "license": [
+ "MIT"
+ ],
+ "authors": [
+ {
+ "name": "Symfony Community",
+ "homepage": "https://symfony.com/contributors"
+ }
+ ],
+ "description": "Integration with your Symfony app & Webpack Encore!",
+ "support": {
+ "issues": "https://github.com/symfony/webpack-encore-bundle/issues",
+ "source": "https://github.com/symfony/webpack-encore-bundle/tree/v2.1.0"
+ },
+ "funding": [
+ {
+ "url": "https://symfony.com/sponsor",
+ "type": "custom"
+ },
+ {
+ "url": "https://github.com/fabpot",
+ "type": "github"
+ },
+ {
+ "url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
+ "type": "tidelift"
+ }
+ ],
+ "time": "2023-09-26T14:41:29+00:00"
+ },
{
"name": "symfony/yaml",
"version": "v6.3.3",
diff --git a/config/bundles.php b/config/bundles.php
index 0457f99..3325715 100644
--- a/config/bundles.php
+++ b/config/bundles.php
@@ -11,4 +11,5 @@ return [
Symfony\Bundle\SecurityBundle\SecurityBundle::class => ['all' => true],
Symfony\Bundle\MonologBundle\MonologBundle::class => ['all' => true],
Symfony\Bundle\MakerBundle\MakerBundle::class => ['dev' => true],
+ Symfony\WebpackEncoreBundle\WebpackEncoreBundle::class => ['all' => true],
];
diff --git a/config/packages/webpack_encore.yaml b/config/packages/webpack_encore.yaml
new file mode 100644
index 0000000..4c009ee
--- /dev/null
+++ b/config/packages/webpack_encore.yaml
@@ -0,0 +1,45 @@
+webpack_encore:
+ # The path where Encore is building the assets - i.e. Encore.setOutputPath()
+ output_path: '%kernel.project_dir%/public/build'
+ # If multiple builds are defined (as shown below), you can disable the default build:
+ # output_path: false
+
+ # Set attributes that will be rendered on all script and link tags
+ script_attributes:
+ defer: true
+ # Uncomment (also under link_attributes) if using Turbo Drive
+ # https://turbo.hotwired.dev/handbook/drive#reloading-when-assets-change
+ # 'data-turbo-track': reload
+ # link_attributes:
+ # Uncomment if using Turbo Drive
+ # 'data-turbo-track': reload
+
+ # If using Encore.enableIntegrityHashes() and need the crossorigin attribute (default: false, or use 'anonymous' or 'use-credentials')
+ # crossorigin: 'anonymous'
+
+ # Preload all rendered script and link tags automatically via the HTTP/2 Link header
+ # preload: true
+
+ # Throw an exception if the entrypoints.json file is missing or an entry is missing from the data
+ # strict_mode: false
+
+ # If you have multiple builds:
+ # builds:
+ # frontend: '%kernel.project_dir%/public/frontend/build'
+
+ # pass the build name as the 3rd argument to the Twig functions
+ # {{ encore_entry_script_tags('entry1', null, 'frontend') }}
+
+framework:
+ assets:
+ json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'
+
+#when@prod:
+# webpack_encore:
+# # Cache the entrypoints.json (rebuild Symfony's cache when entrypoints.json changes)
+# # Available in version 1.2
+# cache: true
+
+#when@test:
+# webpack_encore:
+# strict_mode: false
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..746421a
--- /dev/null
+++ b/package.json
@@ -0,0 +1,25 @@
+{
+ "devDependencies": {
+ "@babel/core": "^7.17.0",
+ "@babel/preset-env": "^7.16.0",
+ "@popperjs/core": "^2.11.8",
+ "@symfony/webpack-encore": "^4.0.0",
+ "bootstrap": "^5.3.2",
+ "core-js": "^3.23.0",
+ "jquery": "^3.7.1",
+ "regenerator-runtime": "^0.13.9",
+ "sass": "^1.68.0",
+ "sass-loader": "^13.0.0",
+ "webpack": "^5.74.0",
+ "webpack-cli": "^4.10.0",
+ "webpack-notifier": "^1.15.0"
+ },
+ "license": "UNLICENSED",
+ "private": true,
+ "scripts": {
+ "dev-server": "encore dev-server",
+ "dev": "encore dev",
+ "watch": "encore dev --watch",
+ "build": "encore production --progress"
+ }
+}
diff --git a/src/Controller/HomeController.php b/src/Controller/HomeController.php
new file mode 100644
index 0000000..aabf987
--- /dev/null
+++ b/src/Controller/HomeController.php
@@ -0,0 +1,18 @@
+render('home/index.html.twig', [
+ 'controller_name' => 'HomeController',
+ ]);
+ }
+}
diff --git a/symfony.lock b/symfony.lock
index d3920d3..6fe6715 100644
--- a/symfony.lock
+++ b/symfony.lock
@@ -255,6 +255,22 @@
"config/packages/messenger.yaml"
]
},
+ "symfony/webpack-encore-bundle": {
+ "version": "2.1",
+ "recipe": {
+ "repo": "github.com/symfony/recipes",
+ "branch": "main",
+ "version": "2.0",
+ "ref": "082d754b3bd54b3fc669f278f1eea955cfd23cf5"
+ },
+ "files": [
+ "assets/app.js",
+ "assets/styles/app.css",
+ "config/packages/webpack_encore.yaml",
+ "package.json",
+ "webpack.config.js"
+ ]
+ },
"twig/extra-bundle": {
"version": "v3.7.1"
}
diff --git a/templates/base.html.twig b/templates/base.html.twig
index 67598ac..ae72b9e 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -5,9 +5,11 @@
{% block title %}Welcome!{% endblock %}
{% block stylesheets %}
+ {{ encore_entry_link_tags('app') }}
{% endblock %}
{% block javascripts %}
+ {{ encore_entry_script_tags('app') }}
{% endblock %}
diff --git a/templates/home/index.html.twig b/templates/home/index.html.twig
new file mode 100644
index 0000000..e022868
--- /dev/null
+++ b/templates/home/index.html.twig
@@ -0,0 +1,20 @@
+{% extends 'base.html.twig' %}
+
+{% block title %}Hello HomeController!{% endblock %}
+
+{% block body %}
+
+
+
+
Hello {{ controller_name }}! ✅
+
+ This friendly message is coming from:
+
+