Using Git to Organize Your Project

Editor's Notes

• #4: Hello Everybody, welcome to WordCamp. Today I’m here to speak about Git, GitHub and WordPress.
• #5: I had a client come up to me and say that she want her website redesigned. I agreed to redesign and basically made changes to her existing theme files. After the website was redesigned she ran a feedback form for her audience’s input on the new redesigned website. She figured out that her readers preferred the old site compared to the new one because they were used to it. So after some months, she came back to me and asked me to bring back her old website. I had a problem here. I didn’t have backup of her old files because I made changes to her existing theme files. And I had no system to roll back past changes. Which made me code again. It was painful for me to code again. At the end, I couldn’t make it look like her old site. My client was angry and I lost her. She figured out that her readers preferred the old site because they were used to it and also because it’s functionality. She then thought of keeping the functionality same as that of her old site and then only making changes to the styles. She then, after two months, said to me that she wanted her old site back. I had a problem here. I didn’t have backup of her old theme files because I had made changes to her existing theme files. Also, even if I did had her old theme files, I didn’t have any system to go back and roll back those changes. After that I had to go through this painful period where I had to redesign her website again to look like her old site. But I couldn’t make it look like her old site because I didn’t have any idea of how it looked. Hence, she was angry at me and I lost the client.
• #6: This not only happens while working for clients, but also happens while working for yourself. When I first figured about WordPress, I started creating WordPress themes. I used to have a folder for creating theme files. Whenever I used to add new feature, I used to create a new folder just for the feature just incase it doesn’t work out. If the new feature wouldn’t work out, I’d could delete the folder and go back to the old files. But it wasn’t practical. My workflow was getting pretty messy. I couldn’t roll back changes either. So, these were the pain points: Backup Unorganized and Messy Workflow Difficult to Add New Features to your Projects Hard to Collaborate with Others Difficult to Track Changes I then started searching for a solution to solve all these problem. Did some research and figuerd about git.
• #7: It did solve all my previous mentioned problems.
• #8: Now, if you are not a developer or a programmer, you can still benefit from Git. Because it’s not just for programmers, but also for writers and bloggers. It’s just a system which anyone can use it to organize their project. For example, WordPress is writing a book on the history and development of WordPress using github. They are basically able to collaborate with anyone in the world. Without github, it would have been very difficult for them to collaborate. So, github is not only for programmers and developers, but also for writers and bloggers.
• #9: So, what is git?
• #10: In short….
• #11: These are the basic tools you’ll require to use github. Basic CLI. Basic Git Commands and setting up and using a repo.
• #12: You need to install git first to start using it. Whatever operating system you’re using, you can download git from git-scm.com/download. Git-scm.com/download You can download git from git-scm.com/download. It’s available for mac, windows and linux from there.
• #13: Anyone who’s not comfortable with command line or terminal can use GUI for GitHub. However, command line is recommended because it’s more powerful than the GUI, and offers lots of other features which GUI doesn’t offer. If you’re just starting out then GUI can be helpful to you because you’ll be able to see how things work.
• #14: Also, other 3rd party GUI clients are also available. Example includes Tower, Gitbox for mac. Git Extentions for Windows. Giggle, Gitg for Linux. And whole other range of GUI clients. You can google for it.
• #15: Okay, but what’s the difference of using GitHub and using backup solutions like dropbox and google drive? You might be wondering why you’ll need to use dropbox if you already have backup of it in dropbox. So, I’ll walk you through the features and advantages of using github.
• #16: Once you push your repo to GitHub, you can track all changes. See who changed it and when it happened. You cannot do this with backup solutions like dropbox.
• #17: You can also see exactly what you changed and roll back those changes if required. It’s interface is similar to WordPress’s post revision control. The red highlighted area shows you your previous content whereas the green highlighted area shows you your recent content.
• #18: As I’ve said before it was very difficult and almost impossible for me to collaborate with my friend who wanted to help me. I didn’t have any system for that. But github offers this. It’s very easy to collaborate with other developers on GitHub.
• #19: Once you start using git, you’ll not require many folders. One folder will be enough to manage your workflow, which makes it pretty organized. Once you start using git, you won’t have lots of folders. Like I said before, I used to create lots of folders for a theme while I’d create a new feature. But now while working with git, if you want to create a new feature, you can simply create a branch. If you like it, you can merge it. If not, delete it.
• #20: You can think of branch as a way to request a brand new working directory, staging area, and project history. It helps you create a new feature, and incase it doesn’t work, you can delete it and simply go back to what you were developing. However, if it does work out, you can merge it with the main repo.
• #21: If you get on an airplane or a train and want to do a little work, you can commit happily until you get to a network connection to upload. If you go home and can’t get your VPN client working properly, you can still work. In many other systems, doing so is either impossible or painful.
• #22: This was my biggest pain point and it solved it.
• #23: On this year’s WordCamp San Francisco State of the Word, Matt announced that GitHub and WordPress will now work together for pull requests.
• #24: These are the basic git commands which you can learn to start playing around with git. I’ll walk you through them.
• #25: We use git status to see what the state our project is in. If you’ve added new files or modified some existing files. Here, in the green, you can see two new files READE and hello.rb; and also in the red README which has been modified. So, it basically shows us what state our project is in.
• #26: You will use git add to start tracking new files and also to stage changes to already tracked files. You can see that README and hello.rb are not staged. After we do git add, they are staged for commit. Git add basically makes our files commit ready.
• #27: git diff will display what code or content you've changed in your project. The red highlighted text shows your previous data and the green highlighted area shows your recent data. You can also see the plus and minus sign, which explains the same thing.
• #28: You run git commit to record the snapshot of your staged content. You stage changes by doing git add as I’ve mentioned previously, and git commit to record the snapshot of your staged content. This snapshot can then be compared, shared and reverted to if you need to.
• #29: To share the cool commits you've done with others, you need to push your changes to the remote repository. Which shows up in GitHub. If you don’t git push, your repository won’t get uploaded to GitHub.
• #30: These are the basic commands in the initial stage that you’ll be using to work with git. However, once you go deep into git, you’ll require more and more git commands.
• #31: You can think of git as creating a website on your localhost. You can only work on it and view it. But for you to make it available to everyone, you’ll need to upload it to a web hosting service. And github is basically like a webhosting service.
• #33: WordCamp Nepal folder on our desktop.
• #34: I created this WordPressInfo.html file just for the demonstration purpose. Added some basic html.
• #37: Go to github.com and create a new repository.
• #38: Give repository the same name as in the desktop, which is ‘WordCamp Nepal’.
• #39: Simply grab the code and push the folder to github.com.
• #40: You can use the previously mentioned git commands to upload it to github.com
• #41: So, now we have wordcamp nepal folder on github.
• #42: And wordpressinfo.html on github.
• #43: WordCamp nepal folder on your local computer looks like this.
• #44: Wordcamp nepal folder on github.com looks like this. You can see the repo name here. The folder structure here.
• #45: This is the text editor where I wrote some basic html. This is how it looks on our local computer.
• #46: And this is how it looks on github.com
• #47: You can check it out live on github.com by going to.
• #49: Pro git is a book by scott chacon that has everything you need to know about git from beginning until the end. It’s available for free online and as ebook.
• #50: Git immersion is a guided tour that walks you through the fundamentals of git. You can learn it in your browser.
• #51: Learn git is my personal favorite. It’s an interactive tutorial which is similar to codeacademy, but for git.
• #52: For all the git commands, you can bookmark gitref.org for handy git reference.
• #53: You don’t want to make premium themes public on GitHub. Private repo costs money.
• #54: So, the alternatives to GitHub are:
• #55: These are some of the alternatives of GitHub. I personally use Bitbucket for private repositories for premium WordPress themes. But you can try any other services you find comfortable.