From 72aa99d9cc41b34c15e3069dfd0c97b6cf50b92e Mon Sep 17 00:00:00 2001 From: Amigo <49749100+aamigo@users.noreply.github.com> Date: Thu, 4 Jul 2019 14:10:16 +0200 Subject: [PATCH] Updated 044 Hello World Component with Joomla Component Builder Creator Extended (markdown) --- ...omponent-with-Joomla-Component-Builder-Creator-Extended.md | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/044-Hello-World-Component-with-Joomla-Component-Builder-Creator-Extended.md b/044-Hello-World-Component-with-Joomla-Component-Builder-Creator-Extended.md index 8634e1d..16d757c 100644 --- a/044-Hello-World-Component-with-Joomla-Component-Builder-Creator-Extended.md +++ b/044-Hello-World-Component-with-Joomla-Component-Builder-Creator-Extended.md @@ -317,6 +317,4 @@ If we now go back to the that file I just opened previously, this Hello_worldHel ### Back To Site View To Add Link -Going back to our Site View of Greetings to add our link. Let's get the method name. We go back, scroll down, getGreetedRoute is the method name. We can [01:28:05](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h28m05s) copy it. It needs to be corresponding to the view we want to open. It's goning to be a ($item->slug). That's not the only function that we want to call here. There is another one I mentioned [01:28:40](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h28m40s) which works alongside this and it's called the JRoute class. We would add the JRoute around this first method class and that would add the other values to the URL [01:29:01](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h29m01s) that is required. We've got our own helper class of a Component. We give it a slug which then gives it to the JRouter and then echos out the link to open this item. [01:29:20](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h29m20s) Let's save this and compile again. To see it in action we go to the front and reload the page. When we click on one of these James, William, Sara, Koos it says not authorized to view Greeted. That means this specific group are not allowed to look at this. There are ways to prevent the link from showing up in the first place. [01:29:51](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h29m51s) But this is for some reason you didn't put that custom script in to place. You can see how the back end generates some of this. If I go into the code and we go to the admin area of the Hello World Component and we open [01:30:19](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h30m19s) view and then greetings and we open the body and we open the view data HTML. -???? -You'll see that it is grabbing some permissions to know whether it should show certain buttons. And then here is again setting up some permissions To see whether [01:30:48](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h30m48s) You are allowed To actually Edit Here it is To actually edited the The greeting And if you're not allowed to edit it It just Echoes the name You see it doesn't show you the link So this area here Is really a demonstration of what you wanna do in the front [01:31:11](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h31m11s) You don't wanna always show the link To the item unless The person Who is actually viewing the site Is in the correct group Of the site To be able to actually View The item Now I'm not gonna spend more time on this Part because we wanna also do an editing concept [01:31:31](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h31m31s) Which is really More interesting and what I would rather spend time on So here I'm just gonna go back into the admin View In the admin area And just change the permissions that the actual public could still open this view for now So in the backend I go to options of the Hello World component Permissions Scroll down Again I'll see there is a new one called greet [01:31:58](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h31m58s) Change this to allowed for the public group And save and close out of there Now I forgot back to the front And click on This link It actually opens it And it gives us the name James gives us the welcome welcome to JCB And the greetings were set by the Superuser OK so it actually loads it as we expected You can also see in the [01:32:27](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h32m27s) URL this demo site of mine isn't fully Search engine friendly setup But it already generates that this is a greet To James And so And the name James appears here because of the Slug The Slug is used to generate the search engine optimisation here If we didn't have an alias it would have given you one or two Depending on the item ID Ok so [01:32:58](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h32m58s) That just gives you a quick demonstration Of how to set up A front-end That actually can open specific items Now The Next Step Is to actually make these items editable Now like I explain to you In the admin area we're ready doing some of this So I'm gonna just basically copy and paste most of the code From the admin area [01:33:26](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h33m26s) And I would encourage you to do the same Unless you know enough that you can just do it without looking at how JCB did it So I'm gonna copy The string And then I'm going to also Copy this one These few lines And then I'm also gonna use some of these I realize by looking at this first area that the Checkout And [01:34:05](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h34m05s) This Checkout value Needs to be set on the page I also need to make sure about this value Because We need to check the users authority On the page so we need to check whether the user is set On the page So We can go and do that and look at some code I'm gonna move some of this code [01:34:27](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h34m27s) And then we'll go to the front end of the code area I want to add the option to edit the item In both the list as well as the Single View So I'm gonna do it in the list view first and that I'll demonstrate step-by-step And then when we go to the Single View I'm just gonna place the code in place I'm not gonna explain to much because it's basically the same So here in the site view Of the list area I'm going to PHP and I'm going to Custom view script It says add PHP script to the head of the file [01:35:05](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h35m05s) So I'm gonna paste This link in here and we see that it basically Has this view Greetings And the task is greeting Edit So that is the task And it's gonna be available in the edit Variable Ok so that's the first part of the code we want up on the page [01:35:29](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h35m29s) Now for the rest of it We go back to the Admin view again The backend And we see wither we need to grab These as well So Before grabbing them Let's open the corresponding site view so we can look at some of the code Ok so Here is the greetings [01:35:55](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h35m55s) I'm gonna open this view HTML And we'll see that the user is already being loaded onto the page so we've really got the user That's great This is the items Ok let's look at this It is always is good for you to actually go and look at the code The JCB is writing seeing the code Is what makes you familiar with how things work And also helps you to detect when something doesn't work Why [01:36:29](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h36m29s) And how to fix it Since we know that the user is on the page and we go to the site the admin area This area We see that it's accessing the user in the same way Using this As an object User And ask him whether it has authority On the core [01:36:48](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h36m48s) managed To check in And then also it Basically checks And gets the check out user Details And We'll see why in a moment But we don't have the check out user on the page So [01:37:06](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h37m06s) What we gonna do it's we gonna quickly Also get those values by going to the Dynamic Get And making sure that those values get brought to the page as well So we go to list greetings And again like before we just copy all those values And just tweak away and then back And the values we now want to make sure also comes along Is basically I see it's a value that it doesn't by itself add To the selection [01:37:44](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h37m44s) But you can add it in because you know it is in the database It's just that This table selection Only shows at this stage the actual values that That it knows belongs to the view I think I need to update this in JCB It is a little tweak which I haven't done So it's not showing the Checkout and Checkout by values But you can type it in by just going And then [01:38:16](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h38m16s) Those values will also be brought to the front Of this view So Basically the Checkout and The check out time Actually we don't need the check out time Only the check out Basically who checked it out We could add the time But I'm not gonna demonstrate that during this tutorial we'll really it was over an hour and so few minutes [01:38:43](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h38m43s) So I'm just gonna use the check out for now saving clothes So we've updated our Dynamic get And that means our values are on the page and we can move our code into place We'll need to add it inside of this for each loop Since this code Is actually working with the item Itself Ok so we've got the code in there Recalling the user We also checking the item check out to the user ID [01:39:21](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h39m21s) Making sure it's 0 We checking whether to check out user Now let's go get the rest of the code we need So again in the admin view we gonna go with This area here And just copy that We wanna make a few adaptations because in the end of the day The front end is a little different from the back end In that [01:39:54](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h39m54s) It is only The backend only displays an edit view the front-end also displays a read view So We wanna make it a little different You can pause the video to see some of the things I've done here But in simple terms I basically got the edit here I'm editing echoing the edit Link And I'm adding the item and I'm putting in a little icon which then you can click And here I'm checking whether you have permission To actually edit [01:40:34](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h40m34s) This item so if we were save this and refresh the homepage It should actually not change anything because the public doesn't have permission to edit it at this stage Ok that icon should be pencil not edit Ok so let's save this and compile it to see it in action install it And we reload the home page and as you can see it doesn't show those little Buttons Now if we go to the back end [01:41:17](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h41m17s) And we go to options And we change That The public is allowed to edit And Let's say Let me not change state Yeah Let's just do that they aloud to edit And Let's open the front again We know see that it shows the edit [01:41:48](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h41m48s) Pencil Let's click on that And we see it opens The edit area Where it can actually now Add the exclamation And click on save Save and close It tells us that the message was saved successfully If we now [01:42:12](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h42m12s) Open that greeting We see that has the exclamation so our Attempt to integrate Or to make our items editable On the front end Within the control of permission groups Has actually worked very effectively if we again Revoke the permissions And [01:42:35](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h42m35s) Refresh the page And then suddenly those links are gone And even if somebody Were to try and Circumvent the system By having In the URL paste in the link To edit that specific item and It will actually Say that it's not permitted [01:42:57](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h42m57s) So the The the permissional structure is actually armed and will protect the item from being edited by By that group So Again we gave the Public Permission to edit But now the question is Can we also give it permission to create So going back to greetings [01:43:19](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h43m19s) Let's add an option to create An item If I go and add this button here With a link To create an item But I'm not adding any checks around it But you basically need the same kind of Check as you've using here Except that there are some [01:43:42](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h43m42s) Shortcut let me Let me show you So basically around the button we added this PHP That checks the users authority to create For the core Of this component If yes Then it will show the button if no the button will not show So that is to control the visibility of the button So let's save this and then compile and install [01:44:11](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h44m11s) To see it in action So we see the button doesn't show And that is because currently Who got a component set That the public Cannot Actually create If we allow creating For the public [01:44:40](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h44m40s) And we Refresh the page You see that now it actually shows Sorry that's the different view It is this one Refresh this page There we go Now if we click on it It will open an area where we can create an item So here we can set a new name [01:45:06](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h45m06s) And then Save and close We get this save not permitted This must mean that we haven't granted enough permissions For the Public user To actually create an item See giving it the option to create an item Is not enough because there are fields That [01:45:28](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h45m28s) You know you need also access to Before you can create an item So let's let's try again But first giving it more permissions So we've granted it Basically all the permissions That it needs and go to the front Now we click create greeting Save and close [01:45:53](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h45m53s) And there we go With saved the item We can again edit the item We can close And we can View As you can see it's all working As expected So Our Hello World tutorial Is nearly at it's end [01:46:16](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h46m16s) We have within this tutorial demonstrated to you How to create A Hello World Component List its items Open individual items And edit those items As well as creating new items All based On the permissional of structures Of the component [01:46:40](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h46m40s) So if we Where to change these permissions back To not allowed And we now refresh the front We'll see that Now we can only view the items And even more If we go back And we wanna control the actual viewing of the greet items Not be visible to the public but maybe only to let's say managers we could do that [01:47:06](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h47m06s) So you can manage That kind of control over your items You know without actually A lot of custom code If you click on it now it will tell you don't have authority to view it Now you can add Basically custom Scripting To remove the link so that it doesn't even look clickable If the person doesn't have access to view it [01:47:32](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h47m32s) But that's already We gone so far over the time Trying to demonstrate to you Some of the basic principles of setting up a Hello component In JCB I trust you've enjoyed this tutorial By far it doesn't usually take this long to actually build a Hello World component In fact there is a older tutorial Where we managed to build a Hello World component and very Shorter time [01:48:02](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h48m02s) But I illustrated and demostrate it and explain it a little more here To help you guys along To actually build components with JCB And that you'd realize that JCB Is really actually a very powerful application I mean I haven't even gone to the code this time And shown you all that it's written But I mean just from the compiler We ready got 13000 lines of code Which would have taken you 5 8 hour days to write [01:48:37](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h48m37s) Which is about 39 hours And I think for a basic component that's quite a lot of code And it's because that it's already integrating a lot of permissional structures and you know version control I mean if I was to Open The greetings And Just open James [01:49:03](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h49m03s) remember we added that little Exclamation mark We could check the version We can see the changes and when it was made We can actually review Some of the previous versions And we can even go back to those versions That kind of integration With your history component is done automatically by just adding history And so is many of the other features [01:49:30](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h49m30s) The JCB is adding to your component like export of data import of data Bash sorry Batch Changes that you can make As well as You know a whole lot of other concepts Which It's just Beyond the scope of what we had time for today Well enjoy coding and yes If you have any issues Please go to GitHub [01:49:58](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h49m58s) First check out the wiki page Check the tutorials And if you just think you've discovered a bug You're most welcome to open an issue And we'll see what we can do in trying to resolve that for you We would like to invite other PHP Programmers To really get involved on the JCB GitHub [01:50:22](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h50m22s) Community And help us improve JCB So that It can become a home For us to manage The troubled waters of open-source Development Thank you +Going back to our Site View of Greetings to add our link. Let's get the method name. We go back, scroll down, getGreetedRoute is the method name. We can [01:28:05](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h28m05s) copy it. It needs to be corresponding to the view we want to open. It's goning to be a ($item->slug). That's not the only function that we want to call here. There is another one I mentioned [01:28:40](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h28m40s) which works alongside this and it's called the JRoute class. We would add the JRoute around this first method class and that would add the other values to the URL [01:29:01](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h29m01s) that is required. We've got our own helper class of a Component. We give it a slug which then gives it to the JRouter and then echos out the link to open this item. [01:29:20](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h29m20s) Let's save this and compile again. To see it in action we go to the front and reload the page. When we click on one of these James, William, Sara, Koos it says not authorized to view Greeted. That means this specific group are not allowed to look at this. There are ways to prevent the link from showing up in the first place. [01:29:51](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h29m51s) But this is for some reason you didn't put that custom script in to place. You can see how the back end generates some of this. If I go into the code and we go to the administrator area of the hello world component and we open [01:30:19](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h30m19s) views and then greetings and we open the default_body.php and we open the view.html.php. You'll see that it is grabbing some permissions to know whether it should show certain buttons. And then in default_body.php again is setting up some permissions to see whether [01:30:48](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h30m48s) you are allowed to edit the greeting. If you're not allowed to edit it It just Echoes the name. You see it doesn't show you the link So this area here Is really a demonstration of what you wanna do in the front [01:31:11](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h31m11s) You don't wanna always show the link To the item unless The person Who is actually viewing the site Is in the correct group Of the site To be able to actually View The item Now I'm not gonna spend more time on this Part because we wanna also do an editing concept [01:31:31](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h31m31s) Which is really More interesting and what I would rather spend time on So here I'm just gonna go back into the admin View In the admin area And just change the permissions that the actual public could still open this view for now So in the backend I go to options of the Hello World component Permissions Scroll down Again I'll see there is a new one called greet [01:31:58](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h31m58s) Change this to allowed for the public group And save and close out of there Now I forgot back to the front And click on This link It actually opens it And it gives us the name James gives us the welcome welcome to JCB And the greetings were set by the Superuser OK so it actually loads it as we expected You can also see in the [01:32:27](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h32m27s) URL this demo site of mine isn't fully Search engine friendly setup But it already generates that this is a greet To James And so And the name James appears here because of the Slug The Slug is used to generate the search engine optimisation here If we didn't have an alias it would have given you one or two Depending on the item ID Ok so [01:32:58](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h32m58s) That just gives you a quick demonstration Of how to set up A front-end That actually can open specific items Now The Next Step Is to actually make these items editable Now like I explain to you In the admin area we're ready doing some of this So I'm gonna just basically copy and paste most of the code From the admin area [01:33:26](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h33m26s) And I would encourage you to do the same Unless you know enough that you can just do it without looking at how JCB did it So I'm gonna copy The string And then I'm going to also Copy this one These few lines And then I'm also gonna use some of these I realize by looking at this first area that the Checkout And [01:34:05](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h34m05s) This Checkout value Needs to be set on the page I also need to make sure about this value Because We need to check the users authority On the page so we need to check whether the user is set On the page So We can go and do that and look at some code I'm gonna move some of this code [01:34:27](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h34m27s) And then we'll go to the front end of the code area I want to add the option to edit the item In both the list as well as the Single View So I'm gonna do it in the list view first and that I'll demonstrate step-by-step And then when we go to the Single View I'm just gonna place the code in place I'm not gonna explain to much because it's basically the same So here in the site view Of the list area I'm going to PHP and I'm going to Custom view script It says add PHP script to the head of the file [01:35:05](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h35m05s) So I'm gonna paste This link in here and we see that it basically Has this view Greetings And the task is greeting Edit So that is the task And it's gonna be available in the edit Variable Ok so that's the first part of the code we want up on the page [01:35:29](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h35m29s) Now for the rest of it We go back to the Admin view again The backend And we see wither we need to grab These as well So Before grabbing them Let's open the corresponding site view so we can look at some of the code Ok so Here is the greetings [01:35:55](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h35m55s) I'm gonna open this view HTML And we'll see that the user is already being loaded onto the page so we've really got the user That's great This is the items Ok let's look at this It is always is good for you to actually go and look at the code The JCB is writing seeing the code Is what makes you familiar with how things work And also helps you to detect when something doesn't work Why [01:36:29](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h36m29s) And how to fix it Since we know that the user is on the page and we go to the site the admin area This area We see that it's accessing the user in the same way Using this As an object User And ask him whether it has authority On the core [01:36:48](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h36m48s) managed To check in And then also it Basically checks And gets the check out user Details And We'll see why in a moment But we don't have the check out user on the page So [01:37:06](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h37m06s) What we gonna do it's we gonna quickly Also get those values by going to the Dynamic Get And making sure that those values get brought to the page as well So we go to list greetings And again like before we just copy all those values And just tweak away and then back And the values we now want to make sure also comes along Is basically I see it's a value that it doesn't by itself add To the selection [01:37:44](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h37m44s) But you can add it in because you know it is in the database It's just that This table selection Only shows at this stage the actual values that That it knows belongs to the view I think I need to update this in JCB It is a little tweak which I haven't done So it's not showing the Checkout and Checkout by values But you can type it in by just going And then [01:38:16](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h38m16s) Those values will also be brought to the front Of this view So Basically the Checkout and The check out time Actually we don't need the check out time Only the check out Basically who checked it out We could add the time But I'm not gonna demonstrate that during this tutorial we'll really it was over an hour and so few minutes [01:38:43](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h38m43s) So I'm just gonna use the check out for now saving clothes So we've updated our Dynamic get And that means our values are on the page and we can move our code into place We'll need to add it inside of this for each loop Since this code Is actually working with the item Itself Ok so we've got the code in there Recalling the user We also checking the item check out to the user ID [01:39:21](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h39m21s) Making sure it's 0 We checking whether to check out user Now let's go get the rest of the code we need So again in the admin view we gonna go with This area here And just copy that We wanna make a few adaptations because in the end of the day The front end is a little different from the back end In that [01:39:54](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h39m54s) It is only The backend only displays an edit view the front-end also displays a read view So We wanna make it a little different You can pause the video to see some of the things I've done here But in simple terms I basically got the edit here I'm editing echoing the edit Link And I'm adding the item and I'm putting in a little icon which then you can click And here I'm checking whether you have permission To actually edit [01:40:34](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h40m34s) This item so if we were save this and refresh the homepage It should actually not change anything because the public doesn't have permission to edit it at this stage Ok that icon should be pencil not edit Ok so let's save this and compile it to see it in action install it And we reload the home page and as you can see it doesn't show those little Buttons Now if we go to the back end [01:41:17](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h41m17s) And we go to options And we change That The public is allowed to edit And Let's say Let me not change state Yeah Let's just do that they aloud to edit And Let's open the front again We know see that it shows the edit [01:41:48](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h41m48s) Pencil Let's click on that And we see it opens The edit area Where it can actually now Add the exclamation And click on save Save and close It tells us that the message was saved successfully If we now [01:42:12](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h42m12s) Open that greeting We see that has the exclamation so our Attempt to integrate Or to make our items editable On the front end Within the control of permission groups Has actually worked very effectively if we again Revoke the permissions And [01:42:35](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h42m35s) Refresh the page And then suddenly those links are gone And even if somebody Were to try and Circumvent the system By having In the URL paste in the link To edit that specific item and It will actually Say that it's not permitted [01:42:57](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h42m57s) So the The the permissional structure is actually armed and will protect the item from being edited by By that group So Again we gave the Public Permission to edit But now the question is Can we also give it permission to create So going back to greetings [01:43:19](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h43m19s) Let's add an option to create An item If I go and add this button here With a link To create an item But I'm not adding any checks around it But you basically need the same kind of Check as you've using here Except that there are some [01:43:42](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h43m42s) Shortcut let me Let me show you So basically around the button we added this PHP That checks the users authority to create For the core Of this component If yes Then it will show the button if no the button will not show So that is to control the visibility of the button So let's save this and then compile and install [01:44:11](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h44m11s) To see it in action So we see the button doesn't show And that is because currently Who got a component set That the public Cannot Actually create If we allow creating For the public [01:44:40](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h44m40s) And we Refresh the page You see that now it actually shows Sorry that's the different view It is this one Refresh this page There we go Now if we click on it It will open an area where we can create an item So here we can set a new name [01:45:06](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h45m06s) And then Save and close We get this save not permitted This must mean that we haven't granted enough permissions For the Public user To actually create an item See giving it the option to create an item Is not enough because there are fields That [01:45:28](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h45m28s) You know you need also access to Before you can create an item So let's let's try again But first giving it more permissions So we've granted it Basically all the permissions That it needs and go to the front Now we click create greeting Save and close [01:45:53](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h45m53s) And there we go With saved the item We can again edit the item We can close And we can View As you can see it's all working As expected So Our Hello World tutorial Is nearly at it's end [01:46:16](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h46m16s) We have within this tutorial demonstrated to you How to create A Hello World Component List its items Open individual items And edit those items As well as creating new items All based On the permissional of structures Of the component [01:46:40](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h46m40s) So if we Where to change these permissions back To not allowed And we now refresh the front We'll see that Now we can only view the items And even more If we go back And we wanna control the actual viewing of the greet items Not be visible to the public but maybe only to let's say managers we could do that [01:47:06](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h47m06s) So you can manage That kind of control over your items You know without actually A lot of custom code If you click on it now it will tell you don't have authority to view it Now you can add Basically custom Scripting To remove the link so that it doesn't even look clickable If the person doesn't have access to view it [01:47:32](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h47m32s) But that's already We gone so far over the time Trying to demonstrate to you Some of the basic principles of setting up a Hello component In JCB I trust you've enjoyed this tutorial By far it doesn't usually take this long to actually build a Hello World component In fact there is a older tutorial Where we managed to build a Hello World component and very Shorter time [01:48:02](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h48m02s) But I illustrated and demostrate it and explain it a little more here To help you guys along To actually build components with JCB And that you'd realize that JCB Is really actually a very powerful application I mean I haven't even gone to the code this time And shown you all that it's written But I mean just from the compiler We ready got 13000 lines of code Which would have taken you 5 8 hour days to write [01:48:37](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h48m37s) Which is about 39 hours And I think for a basic component that's quite a lot of code And it's because that it's already integrating a lot of permissional structures and you know version control I mean if I was to Open The greetings And Just open James [01:49:03](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h49m03s) remember we added that little Exclamation mark We could check the version We can see the changes and when it was made We can actually review Some of the previous versions And we can even go back to those versions That kind of integration With your history component is done automatically by just adding history And so is many of the other features [01:49:30](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h49m30s) The JCB is adding to your component like export of data import of data Bash sorry Batch Changes that you can make As well as You know a whole lot of other concepts Which It's just Beyond the scope of what we had time for today Well enjoy coding and yes If you have any issues Please go to GitHub [01:49:58](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h49m58s) First check out the wiki page Check the tutorials And if you just think you've discovered a bug You're most welcome to open an issue And we'll see what we can do in trying to resolve that for you We would like to invite other PHP Programmers To really get involved on the JCB GitHub [01:50:22](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=01h50m22s) Community And help us improve JCB So that It can become a home For us to manage The troubled waters of open-source Development Thank you