WEBVTT NOTE Created by CaptionSync from Automatic Sync Technologies www.automaticsync.com 00:00:01.066 --> 00:00:05.116 align:middle Make sure you've committed all of your changes - I already did. 00:00:05.446 --> 00:00:09.406 align:middle Because we're about to install something super fun! 00:00:09.626 --> 00:00:12.426 align:middle Like, floating around space fun! 00:00:13.296 --> 00:00:16.236 align:middle Run: composer require profiler -- 00:00:16.426 --> 00:00:20.686 align:middle dev The profiler - also called the 00:00:20.686 --> 00:00:26.176 align:middle "web debug toolbar" is probably the most awesome thing in Symfony. 00:00:26.986 --> 00:00:28.996 align:middle This installs a few packages and... 00:00:29.346 --> 00:00:30.596 align:middle one recipe! 00:00:31.146 --> 00:00:33.986 align:middle Run: git status Ok cool! 00:00:34.566 --> 00:00:38.406 align:middle It added a couple of configuration files and even some routes 00:00:38.406 --> 00:00:42.656 align:middle in the dev environment only that help the profiler work. 00:00:43.286 --> 00:00:46.416 align:middle So... what the heck is the profiler? 00:00:47.206 --> 00:00:51.986 align:middle Go back to your browser, make sure you're on the article show page and refresh! 00:00:52.646 --> 00:00:56.216 align:middle Voilà! See that slick black bar at the bottom of the page! 00:00:56.686 --> 00:00:59.356 align:middle That's the web debug toolbar! 00:01:00.176 --> 00:01:06.286 align:middle It's now automatically injected at the bottom of any valid HTML page during development. 00:01:07.176 --> 00:01:11.466 align:middle Yep, this JavaScript code makes an AJAX call that loads it. 00:01:12.516 --> 00:01:19.966 align:middle Oh, and it's packed with info, like which route was matched, what controller was executed, 00:01:20.776 --> 00:01:25.766 align:middle execution time, cache details and even information about templates. 00:01:26.356 --> 00:01:31.626 align:middle And as we install more libraries, we're going to get even more icons! 00:01:32.286 --> 00:01:37.286 align:middle But the really awesome thing is that you can click any of these icons to go into... 00:01:37.756 --> 00:01:39.156 align:middle the profiler. 00:01:39.676 --> 00:01:44.116 align:middle OoooOoo. This takes us to a totally different page. 00:01:44.516 --> 00:01:49.856 align:middle The profiler is like the web debug toolbar with a fusion reactor taped onto it. 00:01:50.506 --> 00:01:53.596 align:middle The Twig tab shows exactly which templates were rendered. 00:01:54.346 --> 00:01:59.606 align:middle We can also get detailed info about caching, routing and events, 00:01:59.826 --> 00:02:02.166 align:middle which we'll talk about in a future tutorial. 00:02:02.996 --> 00:02:06.376 align:middle Oh, and my personal favorite: Performance! 00:02:07.016 --> 00:02:11.816 align:middle This shows you how long each part of the request took, including the controller. 00:02:12.616 --> 00:02:19.146 align:middle In another tutorial, we'll use this to dig into exactly how Symfony works under the hood. 00:02:19.966 --> 00:02:23.836 align:middle When you're ready to go back to the original page, you can click the link at the top. 00:02:24.676 --> 00:02:26.316 align:middle But wait, there's more! 00:02:26.936 --> 00:02:30.866 align:middle The profiler also installed Symfony's var-dumper component. 00:02:32.016 --> 00:02:34.956 align:middle Find ArticleController and go to showAction. 00:02:36.536 --> 00:02:41.176 align:middle Normally, to debug, I'll use var_dump() to print some data. 00:02:41.746 --> 00:02:42.346 align:middle But, no more! 00:02:42.816 --> 00:02:49.196 align:middle Instead, use dump(): dump the $slug and also the controller object itself. 00:02:50.076 --> 00:02:51.326 align:middle Ok, refresh! 00:02:52.516 --> 00:02:54.456 align:middle Beautiful, colored output. 00:02:54.936 --> 00:02:59.386 align:middle And, you can expand objects to dig deeper into them. 00:03:04.846 --> 00:03:08.636 align:middle The dump() function is even more useful in Twig. 00:03:11.906 --> 00:03:16.196 align:middle Inside the body block, add {{ dump() }}. 00:03:16.196 --> 00:03:21.946 align:middle In Twig, you're allowed to use dump() with no arguments. 00:03:22.446 --> 00:03:24.666 align:middle And that's especially useful. 00:03:25.316 --> 00:03:31.526 align:middle Why? Because it dumps an associative array of all of the variables you have access to. 00:03:32.416 --> 00:03:35.826 align:middle We already knew we had title and comments variables. 00:03:36.046 --> 00:03:39.616 align:middle But apparently, we also have an app variable! 00:03:40.176 --> 00:03:44.156 align:middle Actually, every template gets this app variable automatically. 00:03:44.896 --> 00:03:45.466 align:middle Good to know! 00:03:45.946 --> 00:03:49.766 align:middle But! Symfony has even more debugging tools! 00:03:50.446 --> 00:03:53.826 align:middle Let's get them and learn about "packs" next!