Skip to Content
Technical Articles

Utilizing GitHub for Collaborating

Introduction

GitHub as we know is a wonderful platform for hosting our code, sharing it with others and then collaborate with anybody across the Globe. Let us quickly see how we could utilize the capabilities of GitHub to share an application with a fellow developer, allow others to enhance the same and finally accept/reject the changes and move the code base forward.

Changes made like lines newly introduced or removed as part of the enhancements are pretty much identifiable as below:-

Fig 1. Reviewing changes in GitHub

 

Let us proceed in the following manner:-

Step 1: Create a project in SAP Web IDE and share it via GitHub.

Step 2: Clone the repository as a second developer, enhance the application, suggest the changes

Step 3: Review and accept/reject the enhancement as the repository owner

Ok, let us get started,

Step 1: Web IDE Project to GitHub

First of all we need a repository for us to start sharing the code/project. Login to GitHub and create a repository and initialize the Readme file with appropriate description of the same.

Fig 2. Repository creation in GitHub

 

Now, let us login as the first developer to SAP Web IDE and try to to share the UI5 project into GitHub.

Fig 3. UI5 Project at the first Developer workspace

 

Setting the remote repository as the current GitHub Repository after the initialization in the above step.

Fig 4. Setting the GitHub Repository as the remote repository

 

Now we are technically all set for collaborating with friends/colleagues.

Let us quickly verify the results before we proceed.

Fig 5. Filtering occurs based on the User name in the list

 

Step 2: Clone and Collaborate

Let us assume/login as the second developer and clone the earlier repository. Logged in as second developer and initially there are no repositories by the same name.

Fig 6. Current repositories available with the second developer initially

 

We have received or cloned the GitHub Repository from the first developer. While logged in as the second developer, quickly navigate to this repository and fork it.

Fig 7. Forking the repository for collaborating

 

Now this repository is all ours(second developer), let us quickly get it inside Web IDE and review it. Create a new project by Cloning the repository, this time by cloning the local(second developer’s url).

Fig 8. Creating project as the second developer

 

After having project, let us quickly make some changes(here changing the filtering on Name to Age in the list).

Let us quickly check the result.

Fig 9. Filtering now happens on the age of  items in the list

 

In order to suggest the changes, let us quickly,push the changes to second developer GitHub repository. Then proceed to create a Pull Request. This is where the real magic happens

Fig 10. Creating a pull request to suggest changes

 

This would create a pull request visible to the original repository owner(first developer) as below:-

Fig 11. Pull request created

 

Step 3: Review and Accept/Reject the changes

Now, let us quickly go in as the first developer and review the changes. We navigate to the Pull Requests tab and find out that there is an open item that needs our attention.

Fig 12. Pull request for review

 

We review the same and find this is good and accept the changes(Merge it with the current changes on the base branch).

Fig 13. Changes reviews and accepted

 

Let us quickly retrieve the changes into our SAPUI5 project at Web IDE(of first developer).

Fig 14. Merging the changes accepted

 

Now we quickly verify the results to check whether they are reflected or not.

Fig 15. Result now filtered based on Age and not on Name

 

Result

We have seen how to quickly share UI5 project with others to collaborate on GitHub. We could carry out to have a discussion as well during the review process while accepting or rejecting changes.

Full code available on GitRepo here.

Thanks,
Jakes

1 Comment
You must be Logged on to comment or reply to a post.