 Hello, this is Christian. This is part six of the project tutorial. In this video, we're going to look at some of the blade directives. I'm not going to be able to cover all of them, but I think these are the ones that you might run into quite a lot as you start coding. So the first row, you might be seeing most of them. Maybe the one that you haven't seen is the PHP directive. We'll take a look at that. The if statements switch to four loops, a couple of them, and a loop variable, which is part of the for each loop and for else loop as well. And finally, we'll take a look at the blade comments. Okay, so let's go back to our IDE and start coding. Now, first and foremost, I want you to install two very nice extensions if you don't have them already. So if you click on extension and just search for Laravel blade formatter and a Laravel blade snippets, the snippets here does really nice syntax highlighting and then the formatter here allows you to format your code, okay, which I find is sometimes really useful. So again, thanks big props to these people who provide these free open source extensions. Pretty awesome. All right, so with that said, let's go ahead and go into our Laravel project. I'm going to go through the command terminal, control J takes you there. Make sure you navigate to your project in here and let's run the app. Party time served. Again, port number default is 8,000. If you want to change it to a different port, just type the afterward serve type to flag dash dash port equals and then give it a port number and you run a different port number. So that's that one there. And I'm going to go and run my app. I pull out the corner here so we can see as we go. And there it is. All right, so we're good to go. And I'm going to go back here and close my terminal here for now. Now, before I do anything else, I want to go into the routes and make a copy of my web PHP here just in case. So control C, control V. I'm not going to use this copy. I use it as a backup. But in here, I'm going to clean this up a little bit because I have a lot of, well, maybe in a minute. Okay, so first, let's go into the view called the layouts here. Okay, we've seen it before. You see where you can use the yield to allow another template to inject data into this state template. Okay, that's what it's used for. The yield is for injecting data into, including is also injecting data by you inject data instantly. Okay, automatically, as for as a yield, that means that you only load the content when you visit that view. Okay, so you've seen this before. And then, so let's not go to the... I'm going to create a demo template for now so we can play with this. So I'm going to go to the abuse folder here or click anywhere in here and just type in here and type in a new blade called demo.php. Okay, I'll leave it blank for now. At the same time, I'm going to go to the web page and create a new route. I will use this one and I will just turn this off. So control question to get that off. And I'm going to go to the demo and load the demo route. And title will be just demo, it's okay. Okay, so that's ready to go and we're good. And then go to the browser and navigate to that demo page. Okay, so you should see a blank site here. As you can see, it's empty. All right, I'm going to close over here now and just focus on this blade demo page here. So remember the first one is the extends directive. Notice that if it's a blade file, you don't have to put the PHP code up here. Usually you would do that to run a PHP code. So if it's a blade file, do not put PHP syntax up there and do it this way. If you do that, you get an error, right? It doesn't mean that you can't put PHP code. Of course you can't. If you do that, just make sure that you close that tag and whatever goes inside here is PHP syntax. Okay, so this is a blade syntax. At the very top, we want to extend the layout.master blade. Okay, so now that includes that, if you just run that right now and go back to the browser, not that one, we already seen that. So if you refresh it, you're going to see that one here. Okay, let me close this one here. I'm going to go back in here and let me also do every size of my screen. I want to make sure we have, where is it at? Like that. Okay, here we go. All right, so now here is the output of that. This is overlapping because we have this screen size shrink, but don't pay attention to this one. It's just in the white box here. So this is the master page. We include that already. And then the content goes in here, right? So that is where we include the section. And then the section name is called content. Now the section here, if you include content, it's basically a lot of content to be injected into the master template, then you want to put your code inside here and between the end section, section, like that, okay? So whatever you go, you put in here will be injected into that, the content, right? So you put it high. If you go over there and refresh it, you can see high right there on the screen, right here, right timing, all right? So that's that. And of course, the title, as you can see is the sound page. If you remember, we did find the previous videos. You can put a section here and then the title is like that. Remember, we pass a title variable to this template as well. It's called title. Now notice I did not include the end section for this one here because the second parameter is the actual value for this. So it's like a key value pair, right? So if you refresh it, it's going to change that to the demo link. If you don't do it this way, you can absolutely do it like this too, if you want, but it's going to be redundant. So you can do something like that. Close that one there and then down here, end your section, right? Oops, I think I have to end it. If you don't end it, it's going to, your section is going to bleed over to the next section. And then here you will echo this out by interpolating that title to the page. So as you can see, if I do that, it should still work just fine, okay? Just to make sure it does work, I can put here title plus something. So the concatenator, that is still like PHP, title plus a string, put some kind of like hello again, just so you can see on the tab, okay? That's how you do it. So put it again, you know, if it's just a title, then you will basically just do like I did earlier. And the same goes for the body of your content. If you put like your content right in here like this, the only thing is that if I do something like that, then I'm going to see only just text. It's not going to be interpolated as, you know, HTML or things like that. You see right here is really tiny. If I try to put like an H1, okay? It's not going to behave that way because this is just plain text. And you may be thinking, well, because I'm putting this single quote as a poster double quotes, it doesn't matter. It's still going to be string. I'm sure there are ways around it, but I mean, why would you want to do this? You know, if you want to put your template, just don't do it here. Okay, so therefore you put it inside the section of the body down here and in this section, you can do that. You can also put like stop. If that's, I think that you can do that too. Probably the older version. Okay, so that is where our content is going to be. We're going to put a main tag just so that it looks nice. If you notice that, when I take the main, it doesn't really close it for me. And I find this to be very annoying. So usually to make it faster, you just type main and then hit enter. Okay. And then the HTML will kick in and it will auto close that for you. And then inside here, I'm going to put like a hello here just to make sure that it loads nicely over here and we refresh it. And okay, a little bit better, right? Okay. So now let's get to this stuff in here. So inside here, I'm going to do all the code inside here. I'm going to create a, I want to use the, oh, one more thing, right? So extends here. This is the layout. If you happen to do this twice like that or even like down here at the bottom, it doesn't matter. You're what you're going to get is really three copies of the layout. You can see here is one here, one here, one here, right? So it's not going to crash or break your page. You're just going to load that message page three times and then it will appear, whatever you put here will show up in those three places, okay? So I'm not sure if I'm going to use that, but you can. It's kind of weird. So don't overdo it. It's just something you can. And I mean, it shouldn't be, you should do it, okay? All right. So now let's go and put a PHP variable. Now inside the Blaze syntax, you can't create variables without going to PHP mode. If there's another way, I'm not aware of it. So I mean, I'm going to create some variables in here and you can use the regular PHP directive like this to create a variable, okay? That's fine. Or you can also use the add PHP directive and close that for you as well. So make sure it's a single app and not as 2% has different meaning. So either way. So for example, I'd go here and type in a variable called cat is equal to now, right? And then here I can put here dog is equal to, okay? And they are fine. I can X, show them out here, cat. And then concatenate with that space and then concatenate that with the dog. Fresh that, and you will see now in the wolf over here, right? So either one is fine, whichever is convenient for you. But for my demo, I'm going to try to use just the Blaze syntax, okay? So I'm going to delete this. And also while we're here, when you're trying to interpolate data here, whatever goes inside here is an expression. So as you can see, an expression is anything that you type that is usually a return some value or some data to the view, right? So like a function call. If you happen to have a function, you can call it in here. That's fine too. For example, function, not that fucking function, very simple function cat, right? And then the cat will actually mail. So let's go here like that and I'll put here return, return cat, return now, right? So I call the cat function here, cat function and I put exclamation mark here and you will see that that's how it works too, okay? So either way, when you do this way, if you try to include like cat and dog like that, it should error out because you can't put two variables in here for doing that kind of thing. If you put a comma, then I think you're gonna get only the first operation, the second whatever it is after that will be ignored by the blade engine. If you put a plus then of course, you were expecting to do some type of math operation and in this case, it failed because you can't do strings but you can certainly do these operations in here and sort of cat, you can do like two plus three and now I get an expression. So that's kind of cool for that. All right, so now let's go and create a variable. I'm gonna create one here that says numbers is equal to a array of 12, 34 and the device, okay? Now inside here, I'm going to use the if directive. Before I do that though, let's talk about comment first because I use that quite extensively here. So commenting in blade, the easiest way to do that is if you're using Visual Studio Code, I think most IDE, this almost kind of universal as well, not all of them of course. If you press the control and the forward slash would control the question mark, it's gonna enter you this symbol, it says syntax. This is blade comment, okay? So if you put here comment of blade, this is different than if you were to do a HTML comment. Okay, they're both comments. The only thing is that if you render this to the view over here, okay? If you go and click and show the source of view, you're not going to see the blade comment as you see here, right? I see the HTML comment, but the blade is not being rendered to the view. So this is very similar to a razor syntax and razor comments and the .NET framework. Cool, huh? Right, I just wanna show you that one there, but either one of those will be fine. There is a difference between the two. If you put like blade content inside your HTML comment, I believe you'll be ignored. So usually if you do this, right? And if I go out, you know, numbers of one, okay? You notice that if it's an HTML, it will be ignored if we just span it, okay? And be fresh on the browser. You will see that they're wrong. Oh, let's see. I thought it would not be. As you can see, yeah, it will render the content anyways, but of course it will comment it out, but it will render a result here. You will see the result if it's commented out. As opposed to if I put this inside the blade comment like this, then that is completely not visible. You can see here, okay? So that's again, something you wanna watch out for. It doesn't mean it doesn't show up. Your code is not hidden. I mean, the result is. Okay, so that's the comment. Right, so now let's do some, you know, flow control flows. The first one is the if statement. So it looks very similar to the regular PHP if statements, almost exactly the same, except you're placing the curly braces with the word in different else and things like that. Okay, so start with if, if something is true and the condition here, I'm gonna say if the numbers of let's say zero is, you know, less than the numbers one, if that is true, then I'm going to print something else, say true. Okay, and then end if you have to end this here. Okay, and in this case, I'm expected to be true. So you see the word true printed on the view over here. Okay, so nothing fancy here. If you don't do this, if you happen to put like do that, then you're gonna get a one is set up to work true because it's now interpolated, we evaluate it, right? If you put false, then you're not gonna get anything because false in PHP is like a null value, so you can't see it. Okay, so if you just print the actual content, put true here or false, whatever it is. So that's the basic, very simple, if and else, I'm if block, let's do what the if and else. So let's put an HR here. It didn't work for me this time. What's going on? Okay, so notice I did not, it's not nicely formatted. If you do something like that, sort of ugly. And if you don't have the extension I mentioned earlier, the formatted install, then you're not gonna see this format document here. Okay, if you right click on it, you click form a document, then it will format that for you beautifully. So that's what I want to show you earlier. Okay, so the next one here is the if and else. So let's copy this and I'll put it right down here. Save us time. I will say something like, if the first number is, you know, let's change this. If it's greater than the second number, then we will, I guess we'll print the second number, right? Maybe numbers of the first number, we'll print the first number, if it's larger else, then you put here again, the add symbol followed by else, and then whatever goes in here. Come on, I don't want you, I already got if. Too many. Okay, so else goes in here, and then whatever it is, you put right in here. Maybe I just put here, I don't know, none or something. Okay, so run and you should get a none because indeed it is not true. If you change it the way around, yeah, I'm going to get a true because the second number isn't the larger, right? So that's the if and else block. The next one is the if and else and else if. So let's put something here. Okay, now my everything is gone. One thing is sacrifice for another thing, okay? All right, so now let's say I want to find the largest number in here, right? Remember, you can do that using just if else. So how do you do that? And you can say if the first number, usually this way, the first number is greater than the second number, right? That is true, and I'll put it out of here, okay? So else and then kind of in here, you put the end if. Just so I don't lose track. So that is true, then I can check this next number. This is a nested if, else here, if the numbers of the first number is also larger than numbers of the second or last, right? If that is true, then indeed, the largest number I'm going to print it out is the numbers of the zero. If that is not true, then it must be the last one, right? So we'll put here, I'm going to copy this, just make it faster for me to type else, and then we close it down here and if. Okay, this is our nested if and else. So if this is true, then this is the larger number, otherwise this larger number will be the second position, which is a third index. Okay, if that's not true, then else would be else if, like that. Okay, do another condition, and I'm going to copy this again, just to save some typing. So notice I have to include the word else if together. If you separate them out like this, it will not work. Okay, it has to be glued together like this, but in regular standard PHP, you don't have to put this together, it works both ways. Okay, so if the first number is that, and if it's the second number, it's in the larger than the third number, then we can say that the largest number is indeed the second number, right? And the one else, this is the final else, and the mark number must be that third number, which is index three. Okay, there's a lot of if and else here. If and else and else, if. Okay, so if that's correct, I think it is, we'll figure it out. And it should put in the largest number in this case would be 55, okay? So if I change it around, let's say let's collapse these up here. If I change it to be 112, I should get 112 to be the largest right here. If I change that to be 344, I'm going to get 344 here, all right? And if you look at this, it looks exactly like the if and else, if and PHP. Okay, only thing is that instead of the end if, you put the curly brace instead, right? Or if it's just one statement, you can ignore the end if completely, just if this is true, if else, and then I'll save, okay? So that's something that you want to think about. Should I go with this play directive or should I use the PHP code either way? Okay, so now, I think that's enough for this one here. I'll do the switch in a little bit later, but we'll do that inside the loop makes more sense. So now let's talk about loops in here. So put a comment here, say loops, okay? So the loops, I put an HR here as well. Now I lost that HTML thing. Okay, so for the loops, we'll look at the first one first, which is the for loop. This one here is just like your regular for loop, followed by something like this. So you is equal to zero. Let's say I want to print all the numbers. You know, let's do some last, add some data up here, something a little bit more interesting. So let's put here, put a constant data, one array of some numbers. So we put here a, very simple, it's an array of data. Now, down here, then I'm going to loop until the I exceeds the size count of the data, right, and then I plus plus. So notice here, I'm using the regular count function in PHP. You can use that, we can use the size of, it's fine too, either way, I'll use the count for now. But it only works if you put inside a conditional. If you try to use that outside here, if you print it out, it's not going to work as far as I know, okay. So what I'm saying is that if you go here, if you try to do like that, right, it's not going to, it's not going to work. And there's an error, okay. So it has to be inside only the conditions as far as I know. Okay, so now we have that one there, and then we're going to go ahead and run something here. Make sure you do the end for, okay. So I'm going to do that and maybe just print out some numbers, data of I, right, very simple. And it should print that out for you on the screen right here, ABC, that's what we have. Okay, so that's that. Now, what if we modify the data a little bit and include something like, I don't know, let's do something a little bit better and let's see, let's call it, I'll make a new one. Cost data two is equal to, you know, a, use the same thing, but a map to, you know, Apple, maybe maps to, I don't know, let me take some C maps to, okay. So we'll have the key value pair, which is an associated array, same thing as these, these are index of zero, right? You remember, same idea, but data two has that. And then now when I access my for loop down here, I'm gonna use a different for loop. This is gonna be the for, the for each loop is quite useful in this case. So here you can use this for each loop too, but I'm gonna use something a little bit more meaningful here. So for each here takes the same format as in PHP, for each data, so-called data two as, and you can take the key value pair, I'm gonna do both. So it takes as the key, if you remember the syntax, key and value, and again, make sure you end for each. So if you wanna print the key, you print the K, the value is the V, right? And then we can do something like, you can print the key here, and then follow by maybe the value, right? So just to show that it works, I'm going to refresh it here. So you can see, oops, I did a mistake somewhere here. I gotta close something up here. Unexpected equal, okay, so right here, forgot my arrow, right, so here you go again. You can see the key value pair, right? So the key is A and B and C and so forth here, right? I could do this totally, right? Using separate like that, or I remember I showed you, you could also do this, concatenate that with the concatenator like that. It's the same thing, I get the same result as you can see over here, right? All right, so that is how you get a key value pair. Now, with this for each loop here, you can also have another variable called loop. If you want to find the index, or the index will be like the key in this case. You can use that in loop variable. So here, if I go and put here, just so we can see, I put a VR here, so for now, and if you type in loop, it's a variable. And the loop here is an object that takes some of properties. And one of its properties is like the count, for example, if you do a count, then it will tell you how many items in your list. As you can see, I print it every time. So you lose that three times, but total count is three, right? Three here, because I have three in the elements here. Right, this count is very similar to the count function up here. I can also print some conditional as well. Like if this is the first one or not, okay? It's a Boolean value if it's true or false. So you're not gonna see anything here because it's just say one. If it is indeed the first, the first one, it put a one here, a little bit hard to see, but let me do this. If it's the first one, then you put something here. You put one, four, true, zero, four, false, okay? So if you do that, you can see a one after the apple because that is the first item, okay? And if you do the same thing, even though I put a separate line, you can still see, it's just a print on the same line because only one or the other would be true. If this is the last one, then put something there as well. You can see that now the one goes in the apple and the one goes in the cake, okay? And this is not really so useful, but you can do something like, well, if, right? If the loop, loop is first, if that is true, then put a star, one, and then we'll close the if, right? So the same idea. If the loop is last, then you put, you know, last year. I don't know, first, last, and then, so this way, it makes a bit more sense because you see some things in here. You can also check for even odd or things like that. And, okay, so those are useful variables you can use to check in here. It only applies to the for each and for else loop. Okay, so let's look at the for else. The for else is kind of similar to handlebars. If you never use handlebars before or I think, is it express a ginger template? I don't remember. Let's take a look at what the for else is. So for else, the syntax is the same as you can see here. Okay, collection here would be the data two and item is just again, key value. If you don't care about the key and sort of print the item itself, which is the value, then I will print the value out, item out. Okay, if it's empty, then you put here no content. Something like that, right? So this only runs if the data is empty. So in this case, it's not, I'm gonna see the same content being printed down here. Oops, data two as, oh, too many assembles. Right, get that every time. So, what else? Oh, data is a constant, sorry. Right, so you can see the apple, baking cake, right? You print those out because it's not empty. If I go up here and let's say I'm gonna change that to another constant called data three, it's a blank array, right? So it's empty. Now in my code down here, I'm gonna change that to say data three and because it's empty, you're gonna see the message no content. So that's what this is for. It's like the else clause. If there's no content and the loop. So kind of handy sometimes. But again, in here, you can also get the four as well. So again, if I can go here, I put just this code in here and right in here. If it's the last one, then put the last over here next to the word and maybe we'll put here a little VR just so we can see. Okay, so you will only put the thing next to the last and put here back to the data two and here we go. So as you can see, here it is. So applies to both the four else and for each loop. All right, so what the last thing we'll talk about here is the while loop. This one here is a little bit tricky. Remember the while loop in order for this to work, right? To look at the item, you will have to find the index. That means you have to declare the index outside of the while loop. So you have to do that by using either the PHP syntax like the PHP raw like that, which is okay. And I'll use a variable called J starting at zero, okay? And it will close the end PHP. You have to define that first before you can use it. And then in the while loop, you put here while the J is less than the count of the data and using constant. So I'll make sure I wanna make sure I don't do that externally. Let's go with the data for the regular data. Okay, and then you put here again in the while. And in here, then, so the data is just an array, right? A, B, and C, okay? So we can print the data of J just like that. And then don't forget to recommend your J. Excuse me. I think you can also do writing here if you want to. We'll see if this works. And I can increment J every time and then we'll run. And here we go, A, B, and C. If you don't increment this J like that, if you've got to do that, you're gonna get an error. And as you'll see, it will keep spinning until you run out of resources and you crash your page. Okay, so don't always remember to do that. Either do writing here. If you don't do it in here, or let me close this, stop this, then you have to do outside or afterwards. Now you don't wanna do this, right? J plus plus, you can if you want to, but that has its side effects. That means it's gonna print out your variable every time in there as well, which you don't wanna do. So just for incrementing your data, again, you will have to go back to the PHP mode and do that just for that, you know, right? Just for that. And you can see how tedious this actually gets instead of doing this, I would just put right in here. And it will still work. So save you a line of code and make sure code a little bit sweet. Okay, so this variable here, J, you have to declare in here. Of course, you don't have to do this if you pass it through your view function. So out here on the view function, when I create the demo here, I can pass in here, you know, the other variable. So review, let me go back and use the right method here. Okay, so I can pass the second parameter called J and that J points to zero, start at zero. So because the variable exists here, I can then go ahead and just access the J right away. I don't need this. So again, comment it out. So that should not be included in there. And my coaches still work because the J has been passed to the variable here. So the title, did I do something wrong? Okay, let's try again, I probably missed something. Error, yep, just make sure you do all this correctly. And then, as you can see, it prints out just fine. If you want to start from a different number, then you put here, you know, try a one. Now I'm gonna skip the first one and only get B and C. Okay, so either way, that's how you do it. Just make sure you do that in there. I think that pretty much covers everything here. The only thing I haven't done is the switch case. Now the switch, you can do right in here. I'll show you so that, just like the if block, switch case, same thing. So I want to say something like switch the data of, of J, right? Switch the data of J. Make sure you put it and switch down here. If it's the case of something, you put a function in here. You pass it a case function as opposed to just a variable. If it's an A, then again, assemble, that's the case. Then you don't have to put any of that. That means if that is K is true, then go ahead and maybe I'll print out, I don't know, print out just the data of J, okay? J and then make sure you break it, okay? After that, you want to break it. So again, break out of that. If you don't do that, it's gonna bleed to the next case. So I'm gonna copy this here again, put it right here. Okay, it's a different case. And then the last one here is the default. So again, it will be default. And then the default will print some message here. We don't need to break, just say, I don't know, done, okay? And as you can see, highlight it, format it. Makes it nice for you. Case one, and then this is case B, okay? I'm gonna go back and remove back. Go back to zero, start from zero. Okay, so now if you run it, it's gonna print, you know, key three, where is it at? Did I do something incorrectly in here? Oh, because I commented out, I mean, I incremented it first. So let's remove that. What should I do this? Okay, let's do it on the bottom. The reason why it runs right here, because I incremented the J first. So on the last round, it's gonna go to J three, which I don't have, that's where it crashes here, okay? So you can see they print the A and A, because it's A. And the ABC here is printed twice down here. So if I turn this off, it should only print once, okay? Oh, loop. This is why I don't like about this one here. So let's do this again. Let's do the plus, plus after we print out. Here or here? Nope, it's not gonna work, right? So I have to go back in here, no, no choice in this case. J plus plus, yeah, this is so unusual in this case. All right, so here we go. And not the smiley, but okay, so here AB and done, because we found only two matches, A and B. We ignore that C, so C is now default done, okay? So if you want to print both together, then this is the case then, this is what's called an OR, right? So I can ignore this part and then just do that. And that is the OR case, A or B. And then we'll print that anyway, just get the same result down here, okay? So that's the switch case, nothing very fancy here. Again, it's the same standard as the regular switch statements and I think that should be done. Now, lastly, I wanna do another one just to show you the include here. If we remember, we add the include inside the statements. So as your code goes really, really, really big and really bloated, you can move things out to a different template, okay? So let me maximize this code here or something really quick. Let's say in my views, I'm gonna create another one here called includes, instead of includes, I have another layout called task.play.php, right? So I go back to my demo template, I'd say that, you know what, a lot of these code here are a lot. So I'm gonna move everything, for example, move everything here to the end of that, cut it out and put into the task here is a play template, right? So we can save this play template here and then I'm gonna include it right in here. So include the play template coming from the includes folder called task, okay? And now my code is cleaner because I break it up into different sections. So if you can do that, you can move it out to different multiple sections as well and that should still work. So as you can see, if I refresh the page, everything should still stick as before and just to show that does work, let me go ahead and add another variable here to the D, right? And it should still work just fine, not this one. And here we go, okay? So done, done because two, C and D do not match. All right, so these are the directives I wanted to cover for this video and there are a lot more. If you go to the data documentation on the site, you can learn a little bit more into others. There's a, on the last statement, there's a empty, there's an authentication and many others as well. Okay, well, thanks for watching. Any questions, please put in the comment and I will see you in the next video.