joomla/Component-Builder
joomla
/
Component-Builder
38
19
Fork 11
Code Issues 53 Pull Requests Projects 3 Releases Wiki Activity

Updated 047 Tutorial on forking JCB snippets so you can share your snippets with the rest of the Community (markdown)

Amigo 2019-08-28 15:57:53 +02:00
parent 34813a8413
commit f8145009d1
1 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
047-Tutorial-on-forking-JCB-snippets-so-you-can-share-your-snippets-with-the-rest-of-the-Community.md

@ -77,19 +77,28 @@ When a snippet is added, it should be added to the correct Library and Type and
[00:14:06](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m06s)
Next, I am going to add a new snippet. Since I have done this recording the second time, this 'Accordion' snippet is already in place. The Type is set so that it should be a JavaScript snippet. The Name is an 'Accordion'. The Library is Uikit v3. [00:14:51](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XtZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m51s) I think there is a place called 'Collapse'. 'Accordion' could also fit under 'Collapse'. The first 'Accordion' we have added for Uikit v2 that was founded on the JavaScript but then we did not have these many Types. [00:15:17](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m17s) I'll just add it under 'Collapse' for now. I realize that this might be a difficult thing. What could help is to go back to the actual library itself. This is the link for it: https://getuikit.com/docs/accordion and to try and see how they organized it. [00:15:40](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m40s)The problem is, Uikit did not give more breakdown besides calling it Components. So it is only called a Component, it does not specifically add it into a Type. Whereas Bootstrap is doing a little better at that. Since Bootstrap adds it under 'Collapse', [00:16:07](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m07s) I think we will not go wrong to do the same. Save and close. Now we got a very crazy risky change of a Type and a new snippet.
Next, I am going to add a new snippet. Since I have done this recording the second time, this 'Accordion' snippet is already in place. The Type is set so that it should be a JavaScript snippet. The Name is an 'Accordion'. The Library is Uikit v3. [00:14:51](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XtZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h14m51s) I think there is a place called 'Collapse'. 'Accordion' could also fit under 'Collapse'. The first 'Accordion' we have added for Uikit v2 that was founded on the JavaScript but then we did not have these many Types. [00:15:17](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m17s) I'll just add it under 'Collapse' for now. I realize that this might be a difficult thing. What could help is to go back to the actual library. This is the link for it: https://getuikit.com/docs/accordion and to try and see how they organized it. [00:15:40](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h15m40s)The problem is, Uikit did not give more breakdown besides calling it Components. So it is only called a Component, it does not specifically add it into a Type. Whereas Bootstrap is doing a little better at that. Since Bootstrap adds it under 'Collapse', [00:16:07](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m07s) I think we will not go wrong to do the same. Save and close. Now we got a very crazy risky change of a Type and a new snippet.
### Improving A Snippet
[00:16:20](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h16m20s)
Let me take another Snippet and just make a little improvement to it. I am going to use this Uikit v 2 form snippet and add some usage information to it and save it, save and close. A change has been made to FooTable, Form, and Accordion. Those are the only ones I am going to share. Now 'Accordion', when I created it, it added my details as the contributor. [00:17:00](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m00s) If you created a snippet, it will add your details. You will notice when you create a new snippet it takes a while before it is completely saved because it is phoning GitHub and trying to see if there is not a snippet already with that relationship as I explained in a previous tutorial. That takes a while and I am still wondering if that is the best idea if we should continue doing that. [00:17:28](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m28s) I am open for suggestions but at this stage, we are just trying to confirm if that snippet was not already created and to avoid conflicts. That means if it does not find it, it adds your details which is set here in the Global options. As I explained in that tutorial you can add your details and you would get some exposure out there in the community with your details there. With these that I have just changed the contributor will stay the same, but your name will come in on the Blame Layout and your GitHub name will display there as recognition for your support. <<<<<<<<
Let me take another Snippet and just make a little improvement to it. I am going to use this Uikit v 2 form snippet and add some usage information to it and save it, save and close. A change has been made to FooTable, Form, and Accordion. Those are the only ones I am going to share. Now 'Accordion', when I created it, it added my details as the contributor. [00:17:00](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m00s) If you created a snippet, it will add your details. You will notice when you create a new snippet it takes a while before it is completely saved because it is phoning GitHub and trying to see if there is not a snippet already with that relationship as I explained in a previous tutorial. That takes a while and I am still wondering if that is the best idea if we should continue doing that. [00:17:28](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m28s) I am open for suggestions but at this stage, we are just trying to confirm if that snippet was not already created and to avoid conflicts. That means if it does not find it, it adds your details which is set here in the Global options. As I explained in that tutorial you can add your details and you would get some exposure out there in the community with your details there. With these that I have just changed the contributor will stay the same, but your name will come in on the Blame Layout and your GitHub name will display there as recognition for your support.
### Share Snippets
[00:18:12](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m12s)
Next thing share snippets. The reason I made it that it Compiles a zip file is that it's easier to move around. We could argue that we might want to just have it zip or move. Rather move the files right into your local cloned folder. I am thinking at this stage maybe we should add a switch here in the global options that could make you choose it to do this or the other depending on what is most convenient for you. [00:18:52](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m52s) I'm going to go take the snippet /media/host/Dropbox/sandbox/joomla/tmp/snippets. and then I'm going to go and unzip it into that repository that we've cloned. Here we are in that folder(see video). I'm going to first unzip it. There are those three files(see video) that we want to make part of the repository. Like I said I clone the repository right into my user [00:19:23](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m23s) folder. Let us go to that folder. I'm going to cut this here. Cut and then paste it right into that folder. We are updating one file. It's asking if it already contains a file? When you improve a file, you'll have to replace it. [00:19:49](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m49s) So we click replace. Now that you've added those two new files and you have replaced one of them, the third one you'll see that we now have this FooTable, the Tables version, and we have it also [00:20:09](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m09s) at the Layout version. One of them needs to go. We don't want duplicates. So you have to remove this one but don't remove it via the interface. Use Git to remove the file so that you can also add a message so that when you make your pull request and we see our files removed that we'll know why you did it. Then it will become a discussion. This we'll demonstrate in the next tutorial.
Next thing share snippets. I made it compile a zip file so that it is easier to move around. We could argue that we might want to just have it zip or move. Rather move the files right into your local cloned folder. Maybe we should add a switch here in the Global Options that could give the option to select the one or the other depending on what is most convenient for you. [00:18:52](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m52s) I am going take the snippet '/media/host/Dropbox/sandbox/joomla/tmp/snippets' and unzip it into that repository that has been cloned. (see video). First, unzip it. There are those three files(see video) that we want to make part of the repository. The repository is cloned right into my user folder. [00:19:23](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m23s) Go to that folder and cut this (Please follow on video). Cut and then paste it into that folder. One file gets updated and asks if it already contains a file? When a file is improved, it should be replaced. [00:19:49](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m49s) Therefore click 'Replace'. Now that you have added those two new files and have replaced one of them, the third one will now have this FooTable, the Tables version, and it is also at the Layout version. [00:20:09](https://www.youtube.com/watch?v=0hgHeQVTLOk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m09s) One of them needs to go there should be no duplicates. Remove this one but do not remove it via the interface. Use Git to remove the file so that you can also add a message so that when you make a pull request and see our files removed that we will know why you did it. Then it will become a discussion. This will be demonstrated in the next tutorial.<<<<<<<<
### Back To Command Line - git status To See What Happened