WEBVTT NOTE Created by CaptionSync from Automatic Sync Technologies www.automaticsync.com 00:00:00.056 --> 00:00:07.286 align:middle Hey guys! If you've watched even one video on KnpU - please tell me that you have - 00:00:07.616 --> 00:00:09.126 align:middle then you've seen me using PHPStorm. 00:00:10.236 --> 00:00:11.966 align:middle Now think about how much you use your editor. 00:00:12.106 --> 00:00:14.506 align:middle If you work 40 hours a week I bet you stare deeply 00:00:14.506 --> 00:00:17.076 align:middle into your editor at least 20 of those hours. 00:00:17.696 --> 00:00:18.926 align:middle So over a year, that's... 00:00:19.006 --> 00:00:23.206 align:middle let's see here - carry the one - over 1,000 hours! 00:00:23.276 --> 00:00:26.106 align:middle So if you could learn something that saves you a few seconds now, 00:00:26.106 --> 00:00:28.736 align:middle that's going to mean you're saving 10's of hours in the future. 00:00:29.546 --> 00:00:33.936 align:middle Particularly in Symfony development, mastering PHPStorm is going to completely speed 00:00:33.936 --> 00:00:37.216 align:middle up the way you develop and help you catch mistakes you may have missed otherwise. 00:00:37.416 --> 00:00:42.766 align:middle If you've never used PHPStorm before it does have a free trial period that you can use 00:00:42.766 --> 00:00:45.566 align:middle to see if it's going to work for you. 00:00:45.566 --> 00:00:49.676 align:middle I'm working with a fresh version of PHPStorm, 00:00:53.576 --> 00:00:57.036 align:middle this is not how I want my development environment to look - 00:00:57.036 --> 00:00:58.406 align:middle all this white is stressing me out. 00:00:59.286 --> 00:01:02.026 align:middle So download your own copy and let's customize this thing together. 00:01:02.026 --> 00:01:06.546 align:middle If I open any of my files right now you'll see that they look pretty ugly. 00:01:06.916 --> 00:01:12.196 align:middle Let's clean that up first: open up preferences and in Appearance 00:01:12.366 --> 00:01:17.846 align:middle under Appearance & Behavior you can select your theme, change that to Darcula. 00:01:18.146 --> 00:01:24.236 align:middle (insert Dracular slow laugh here) This is the theme of the UI which also goes 00:01:24.236 --> 00:01:25.816 align:middle and sets the scheme for the editor. 00:01:25.816 --> 00:01:28.326 align:middle And this is already so much better. 00:01:28.426 --> 00:01:32.296 align:middle Staring into a white screen for 1,000+ hours a year is very similar to just staring 00:01:32.296 --> 00:01:34.706 align:middle at a lightbulb -- not so great on the eyes. 00:01:36.026 --> 00:01:39.276 align:middle Speaking of eyes, I'd like to see my font size a bit bigger here. 00:01:40.206 --> 00:01:45.546 align:middle Back to preferences, on a mac its shortcut is , so I'll start using that. 00:01:46.046 --> 00:01:51.846 align:middle On Windows and Linux, it's the longer Ctrl+Alt+S - you can check out the key mappings 00:01:51.846 --> 00:01:54.696 align:middle under the keymap section, to see and simplify these. 00:01:55.876 --> 00:01:58.136 align:middle Use this search to look for font. 00:02:00.076 --> 00:02:05.786 align:middle This pulls up a few things, general appearance, colors & fonts. 00:02:06.826 --> 00:02:09.186 align:middle Let's pick font here and there's font size. 00:02:09.356 --> 00:02:11.596 align:middle I can't immediately change the font size I've got 00:02:11.596 --> 00:02:13.346 align:middle because that would change the Darcula scheme. 00:02:13.776 --> 00:02:18.896 align:middle So first let's click 'save as' so we can customize this, save it as 'darcula mine'. 00:02:19.026 --> 00:02:26.266 align:middle And now I can change the font size to 14 and give it a line spacing of say 1.2. 00:02:28.436 --> 00:02:30.246 align:middle Ahh so much better. 00:02:31.406 --> 00:02:34.276 align:middle Over here on the left, you can see the tuts and knpu directories. 00:02:34.956 --> 00:02:39.466 align:middle I use these to help me build this tutorial - but when I'm coding, I don't want to see them. 00:02:39.986 --> 00:02:43.276 align:middle Any time you have a directory that you don't want PHPStorm to look into, 00:02:43.356 --> 00:02:45.806 align:middle or that you just don't want to see, you can hide it. 00:02:46.996 --> 00:02:51.496 align:middle Right click tuts, find 'mark directory as' and select 'excluded'. 00:02:51.496 --> 00:02:54.296 align:middle In a second that will hide this for me. 00:02:54.586 --> 00:02:56.616 align:middle Let's also do this on the knpu directory. 00:02:59.106 --> 00:03:03.236 align:middle And now we can change the view in the upper left from 'project' to 'project files'. 00:03:03.606 --> 00:03:05.946 align:middle Let's also exclude this .idea directory. 00:03:07.736 --> 00:03:10.726 align:middle If you ever need to see those in the tree again you can just switch back 00:03:10.726 --> 00:03:12.586 align:middle to 'project' and they'll reappear. 00:03:13.406 --> 00:03:15.836 align:middle Then you can even unmark them if you want to. 00:03:16.886 --> 00:03:18.656 align:middle Okay back to the 'project files' view. 00:03:18.656 --> 00:03:22.466 align:middle So PHPStorm is the best editor I've ever seen. 00:03:23.126 --> 00:03:25.946 align:middle But the real power with Symfony comes from an amazing plugin. 00:03:27.176 --> 00:03:30.746 align:middle Back in preferences if you search for Symfony it brings you to a plugin spot. 00:03:32.416 --> 00:03:36.956 align:middle Click 'Browse Repositories', here you see the community plugins for Symfony 00:03:36.956 --> 00:03:39.286 align:middle and there's one called the 'Symfony2 Plugin'. 00:03:39.466 --> 00:03:44.736 align:middle To prove how great it is just look at its 1.2 million downloads. 00:03:44.976 --> 00:03:49.756 align:middle So press the 'Install Plugin' button to get this added to our IDE. 00:03:52.476 --> 00:03:54.716 align:middle The other plugin that you are definitely going to want 00:03:54.716 --> 00:03:57.646 align:middle to install is this called 'PHP Annotations'. 00:03:57.866 --> 00:04:00.576 align:middle Find that one in the search and install it. 00:04:05.176 --> 00:04:12.996 align:middle Perfect. Close out of this window, and then press ok and restart PHPStorm. 00:04:13.046 --> 00:04:15.096 align:middle You only need to install the Symfony plugin once, 00:04:15.096 --> 00:04:18.136 align:middle but each time you start a new project you will need to enable it. 00:04:18.876 --> 00:04:27.776 align:middle Back in preferences, search Symfony and check the 'Enable Plugin for this Project' checkbox. 00:04:28.146 --> 00:04:30.906 align:middle Do that just one time per project - not bad! 00:04:31.646 --> 00:04:35.416 align:middle The checkbox had a note that it requires a restart, that's mostly not true. 00:04:35.416 --> 00:04:38.456 align:middle But I am going to restart one more time because there are a few small features 00:04:38.456 --> 00:04:39.916 align:middle that will not work until you do this. 00:04:39.916 --> 00:04:43.496 align:middle Now we're really ready to go! 00:04:43.496 --> 00:04:50.146 align:middle I've already got my my site running on localhost:8000 00:04:50.316 --> 00:04:53.876 align:middle and we've got a nice looking 404 page since there isn't anything inside of here yet. 00:04:54.846 --> 00:04:58.186 align:middle Just to prove that the Symfony Plugin is installed and running, in the bottom right 00:04:58.186 --> 00:05:00.566 align:middle of PHPStorm you should see a little Symfony menu. 00:05:01.506 --> 00:05:05.426 align:middle Clicking it gives you a quick way to jump into the profiler for any recent requests. 00:05:05.426 --> 00:05:09.856 align:middle Now that our editor is all setup let's get down to work!