Getting connected on Github - Revision history

Cclewley at 15:02, 27 September 2021

2021-09-27T15:02:52Z

← Older revision		Revision as of 15:02, 27 September 2021
Line 101:		Line 101:

	'''GitKraken:''' Use the pull button and ''‘fast-forward if possible’'' option.		'''GitKraken:''' Use the pull button and ''‘fast-forward if possible’'' option.
			[[Category:Setting Up]]

Cclewley: /* Step 2: Opening the service and signing in */

2021-09-27T14:58:42Z

Step 2: Opening the service and signing in

← Older revision		Revision as of 14:58, 27 September 2021
Line 20:		Line 20:
	=== Step 2: Opening the service and signing in ===		=== Step 2: Opening the service and signing in ===
	'''Command:''' You may search in your machine for Command Prompt or Terminal.		'''Command:''' You may search in your machine for Command Prompt or Terminal.
	[[File:~~Core team~~.~~2cf84d29.png~~\|left\|thumb\|Welcome to Gitkraken]]		[[File:WelcomeGitKraken.jpg\|left\|thumb\|Fig 1: Welcome to Gitkraken]]
	[[File:~~Core team.2cf84d29~~.~~png~~\|thumb\|Authorization on GitKraken]]		[[File:AuthoriseGitKraken.jpg\|thumb\|Fig 2: Authorization on GitKraken]]
	'''GitKraken:''' Open a GitKraken window from wherever you saved it. Opening GitKraken can sometimes take a few minutes. Once you see the image to the ~~right~~, click “Sign in with GitHub.” That should take you to a screen which looks like ~~picture 2.~~		'''GitKraken:''' Open a GitKraken window from wherever you saved it. Opening GitKraken can sometimes take a few minutes. Once you see the image to the left (figure 1), click “Sign in with GitHub.” That should take you to a screen which looks like the figure on the right (figure 2).




	~~[[File:Core team.2cf84d29.png\|thumb\|(Picture 3)]]~~
	~~Click “Continue authorization.” That should take you to a GitHub login page (picture 3).~~

	~~[[File:Core team.2cf84d29.png\|left\|thumb\|(Picture 4)]]~~
	~~Use your already made GitHub username and password. If you authorized your email for your GitHub account earlier, then signing in correctly there will take you to~~ the ~~page as seen in picture 4. Click “Authorize Axosoft.” Once you have done this, you will see~~
	~~[[File:Core team.2cf84d29.png\|center\|thumb\|~~(~~Success~~)]]This means you can safely close that tab and go back to your Gitkraken window. Opening this will take you now to “Set up your profile,” where you choose your avatar and account name. Go ahead and agree with the terms and conditions. No need to start a free trial of GitKraken pro, their free version does everything we need.

			Click “Continue authorization.” That should take you to a GitHub login page (figure 3).
			[[File:LoginGitHub.jpg\|thumb\|Fig 3: GitHub login page]]
			[[File:Screenshot4.jpg\|left\|thumb\|Figure 4]]
			Use your already made GitHub username and password. If you authorized your email for your GitHub account earlier, then signing in correctly there will take you to the page as seen in figure 4. Click “Authorize Axosoft.” Once you have done this, you will see the 'Success!' image as in figure 5.
			[[File:Success.jpg\|center\|thumb\|Figure 5: success]]
			This means you can safely close that tab and go back to your Gitkraken window. Opening this will take you now to “Set up your profile,” where you choose your avatar and account name. Go ahead and agree with the terms and conditions. No need to start a free trial of GitKraken pro, their free version does everything we need.
	=== Step 3: Cloning a repository (in command) ===		=== Step 3: Cloning a repository (in command) ===
	In order to access the desired repository, we must clone it onto your local computer. To clone a REPOSITORY owned by USERNAME, use		In order to access the desired repository, we must clone it onto your local computer. To clone a REPOSITORY owned by USERNAME, use

Cclewley: /* Step 1: Downloading the service */

2021-09-27T14:45:48Z

Step 1: Downloading the service

Cclewley: /* Step 2: Opening the service and signing in */

2021-09-27T14:45:07Z

Step 2: Opening the service and signing in

Show changes

Cclewley: /* The GitHub */

2021-09-27T14:33:06Z

The GitHub

← Older revision		Revision as of 14:33, 27 September 2021
Line 1:		Line 1:

			[https://github.com/ GitHub] is used to store all of the code used to create the visualisations. This is so we can easily share code that is in development, or use code from existing visualisations.

			Once the developer (you) has set up a repository on GitHub, either the command prompt or GitKraken are used to make a copy of the repository on GitHub and store it locally (on your computer). From here, you can edit it. Documented below is how to use all of these tools and services.
			== Creating a Github account ==
	~~This page details how to get started coding.~~		If you don’t have a GitHub account, follow the instructions [https://github.com/join?ref_cta=Sign+up&ref_loc=header+logged+out&ref_page=%2F&source=header-home here] to create one. You will need a new username and an email address; your college email should be fine! Once you have completed your setup (don’t worry too much about customization along the way), you will receive a verification email on your registered email account. Open the email and click “verify email address.” Doing this will open GitHub logged into your new account and ask what you want to do first. If you wish to learn more about GitHub, you can follow one of their suggested options. However, you can skip this if you only want to use GitHub for ImpVis for now.

	~~== The GitHub ==~~
	Before you get started and connected, you may want to see some of our current visualisations on https://impvis.co.uk/teach our website! GitHub is used to store all of the code used to create the visualisations. Once the developer (you) has set up a repository on GitHub, either command or GitKraken are used to make a copy of the repository on GitHub and store it locally (on your computer). From here, you can edit it. Communication between collaborators of a particular visualisation is Slack is used to communicate with all the collaborators of a particular visualisation. We use Trello to keep track of all the tasks that need completing to move forward with a visualisation. Documented below is how to use all of these tools and services~~: Summer team:~~


	== Github: ==
	~~We store and share our visualisations code on Github.~~

	If you don’t have a GitHub account, follow the instructions [https://github.com/join?ref_cta=Sign+up&ref_loc=header+logged+out&ref_page=%2F&source=header-home here]. You will need a new username and an email address; your college email should be fine! Once you have completed your setup (don’t worry too much about customization along the way), you will receive a verification email on your registered email account. Open the email and click “verify email address.” Doing this will open GitHub logged into your new account and ask what you want to do first. If you wish to learn more about GitHub, you can follow one of their suggested options. However, you can skip if you only want to use GitHub for ~~imperial visualisations~~ for now.


	== Command and Gitkraken ==		== Command and Gitkraken ==

	Once you have a GitHub account, you can clone the repository (copy it to your local computer), make changes, and upload them to GitHub so that your changes get updated.There are two classic ways that we do this at Imperial Visualisations. One way is using ~~command~~, and the other is using GitKraken.Command and GitKraken are equivalent methods to allow communications between your machine and our GitHub. Command (or Terminal) uses line commands, while GitKraken is an app that has all the equivalent actions.		Once you have a GitHub account, you can clone the repository (copy it to your local computer), make changes, and upload them to GitHub so that your changes get updated.There are two classic ways that we do this at Imperial Visualisations. One way is using Command, and the other is using GitKraken.Command and GitKraken are equivalent methods to allow communications between your machine and our GitHub. Command (or Terminal) uses line commands, while GitKraken is an app that has all the equivalent actions.

	Both have their pros and cons; for example, GitKraken is more visual, has a shallower learning curve, and less to remember to use it. On the other hand, ~~command~~ works much faster and is more straightforward to fix the level of issues dealt with in ~~code~~ & ~~crisps~~. If you continue programming in the future, you will most likely need to know how to use ~~command~~ eventually. You also look more like a hacker when using ~~command~~. For further information about the benefits of using Gitkraken and Command, check out this comparison (by GitKraken...) https://support.gitkraken.com/pdf/infographic/gitkraken-vs-cli.pdf. We do not have a preference for which one of these you use, half of us recommend using Command, the other half Gitkraken. The choice is yours!		Both have their pros and cons; for example, GitKraken is more visual, has a shallower learning curve, and less to remember in order to be able to use it. On the other hand, Command works much faster and is more straightforward to fix the level of issues dealt with in [[Opportunities to work together#Term-time Code .26 Crisps\|Code & Crisps]]. If you continue programming in the future, you will most likely need to know how to use Command eventually. You also look more like a hacker when using Command. For further information about the benefits of using Gitkraken and Command, check out this comparison (by GitKraken...): https://support.gitkraken.com/pdf/infographic/gitkraken-vs-cli.pdf. We do not have a preference for which one of these you use, half of us recommend using Command, the other half Gitkraken. The choice is yours!

	Once you have chosen, there are a few steps that you need to go through in order to make changes to files on GitHub. Here are some instructions on how to each step necessary to create and make changes to files you want on GitHub.		Once you have chosen, there are a few steps that you need to go through in order to make changes to files on GitHub. Here are some instructions on how to each step necessary to create and make changes to files you want on GitHub.

			=== '''Step 1: Downloading the service''' ===
			'''Command''': Congratulations, you already did - this is built in as Command Prompt on Windows or Terminal on MacOS.

			'''GitKraken''': To download GitKraken, please visit https://www.gitkraken.com/download and download it to a location you will remember.

	~~'''Step 1: Downloading the service'''~~		=== '''Step 2: Opening the service and signing in''' ===

	~~Command: Congratulations, you already did - this is built in as Command Prompt on Windows or Terminal on MacOS.~~
	~~GitKraken: To download GitKraken, please visit https://www.gitkraken.com/download and download it to a location you will remember.~~





	'''Step 2: Opening the service and signing in'''

	'''Command:''' You may search in your machine for Command Prompt or Terminal.		'''Command:''' You may search in your machine for Command Prompt or Terminal.
	[[File:Core team.2cf84d29.png\|left\|thumb\|Welcome to Gitkraken]]		[[File:Core team.2cf84d29.png\|left\|thumb\|Welcome to Gitkraken]]

Admin: Protected "Getting connected on Github" ([Edit=Allow only administrators] (indefinite) [Move=Allow only administrators] (indefinite))

2021-09-07T09:39:59Z

Protected "Getting connected on Github" ([Edit=Allow only administrators] (indefinite) [Move=Allow only administrators] (indefinite))

← Older revision	Revision as of 09:39, 7 September 2021
(No difference)

Mark Thomas: /* Merging branches */

2021-07-15T14:48:45Z

Merging branches

← Older revision		Revision as of 14:48, 15 July 2021
Line 120:		Line 120:

	==Merging branches ==		==Merging branches ==
			Let’s say that you have done a few commits and have a version of your vis that you are ready for a milestone saving of all the commits; you can merge the dev branch into master.

			'''Command:''' If I wanted to merge in my experimental code, which I have now thoroughly tested from the ''dev'' branch into the ''master'' branch, I would do the following. Navigate to the local repository folder (using <code>cd</code>), then <code>git checkout master</code>. This moves us into the master branch, then <code>git merge dev</code>, merges ''dev'' with ''master''. You would then have to resolve any merging conflicts that arise.

			'''GitKraken:''' You should check into ''master'' then right-click on ''dev'' followed by ''‘merge dev into master.’''

			= Having more than one developer =
			There are inevitable commits done by other developers in between your commits when there is more than one developer. After you have made your commit, but before you push it, you should pull the new commits. Remember, pull before you push!

			'''Command:'''

			In the case that you have multiple people working on one repository, you will need to account for their changes too. This requires the use of the '''pull merge commit push''' system, whereby just before you push your changes, you first pull from the directory using <code>git pull</code>, then git will merge in any changes performed by the other person. Note, it sometimes can’t do this, and you will have to manually select what code to keep, either yours, the other persons, or both. With the issues in the merge resolved, you then <code>git add</code>, <code>git commit</code> and <code>git push</code> as described previously.

			'''GitKraken:''' Use the pull button and ''‘fast-forward if possible’'' option.

Mark Thomas: /* Making and pushing a commit */

2021-07-15T14:48:27Z

Making and pushing a commit

← Older revision		Revision as of 14:48, 15 July 2021
Line 116:		Line 116:

	'''Gitkraken:'''GitKraken will tell you the file changes in the working directory. You should click on ''‘view the changes.’'' In the ''‘Unstaged Files’'' section, you should be able to click on the files that have changes to them and view the changes comparing line by line before and after the change. At this point, you still can decide whether to keep certain changes by using the ''‘Discard Hunk’'' (remove this change) and ''‘Stage Hunk’'' (put this change into the drafted commit) buttons. If you are sure of all, you can use the ''‘Stage all Changes’'' button without checking every single changed file. Similarly, you can try to revert all the changes using the ''‘Discard All Changes’'' bin button. Once you have checked all the changes, you should write the commit message and press the commit button. If no new changes are coming from the Git, you should be able to push the commit to Git. If the push is successful, you have now made the changes on Git!		'''Gitkraken:'''GitKraken will tell you the file changes in the working directory. You should click on ''‘view the changes.’'' In the ''‘Unstaged Files’'' section, you should be able to click on the files that have changes to them and view the changes comparing line by line before and after the change. At this point, you still can decide whether to keep certain changes by using the ''‘Discard Hunk’'' (remove this change) and ''‘Stage Hunk’'' (put this change into the drafted commit) buttons. If you are sure of all, you can use the ''‘Stage all Changes’'' button without checking every single changed file. Similarly, you can try to revert all the changes using the ''‘Discard All Changes’'' bin button. Once you have checked all the changes, you should write the commit message and press the commit button. If no new changes are coming from the Git, you should be able to push the commit to Git. If the push is successful, you have now made the changes on Git!



			==Merging branches ==

Mark Thomas: /* Making and pushing a commit */

2021-07-15T14:47:42Z

Making and pushing a commit

← Older revision		Revision as of 14:47, 15 July 2021
Line 111:		Line 111:

	== Making and pushing a commit ==		== Making and pushing a commit ==
			Once you have done some changes to your code and are happy with your progress, you may want to save (push) it to the repository on Git. The first step is to make a commit of the changes you like.Having a commit in the GitHub history when stuff is working is great because if you accidentally make some mistakes in your code and can't change them, then reverting to these commits (savepoints) is precisely what you need. Always keep this in mind! Make sure to commit your code with a descriptive message as frequently as possible even if it's not working; that way, you can always go back to something that was slightly less broken if the situation worsens. Avoid pushing straight to master; instead, push your changes to a separate branch and then merge into master.

			'''Command:''' Git commands are performed inside of the cloned git repository. First, you must navigate to the folder inside of the command line. Once there, run <code>git status</code> to see how many commits, and you are ahead of or behind origin. To commit something, we first have to identify the files we want to add to the commit; this can be done by adding individual files using <code>git add ''myFileName''</code> or to just add all the files in the repository just use <code>git add</code>. This is the lazy option but very effective. Once all the desired files are added, you then commit them; this is done via <code>git commit -m ''``message describing the commit, what have I changed or done”''</code> the message associated with the commit is vital, as it lets you know what you were doing at this point, should you need to revert future code to this point. Now that you have committed, you want to push those changes to the remote directory so that other people can access them. This is done using <code>git push</code>.

			'''Gitkraken:'''GitKraken will tell you the file changes in the working directory. You should click on ''‘view the changes.’'' In the ''‘Unstaged Files’'' section, you should be able to click on the files that have changes to them and view the changes comparing line by line before and after the change. At this point, you still can decide whether to keep certain changes by using the ''‘Discard Hunk’'' (remove this change) and ''‘Stage Hunk’'' (put this change into the drafted commit) buttons. If you are sure of all, you can use the ''‘Stage all Changes’'' button without checking every single changed file. Similarly, you can try to revert all the changes using the ''‘Discard All Changes’'' bin button. Once you have checked all the changes, you should write the commit message and press the commit button. If no new changes are coming from the Git, you should be able to push the commit to Git. If the push is successful, you have now made the changes on Git!

Mark Thomas: /* Making a repository */

2021-07-15T14:46:34Z

Making a repository

← Older revision		Revision as of 14:46, 15 July 2021
Line 110:		Line 110:


			== Making and pushing a commit ==

	== Making and pushing a commit ==

← Older revision		Revision as of 14:45, 27 September 2021
Line 13:		Line 13:
	Once you have chosen, there are a few steps that you need to go through in order to make changes to files on GitHub. Here are some instructions on how to each step necessary to create and make changes to files you want on GitHub.		Once you have chosen, there are a few steps that you need to go through in order to make changes to files on GitHub. Here are some instructions on how to each step necessary to create and make changes to files you want on GitHub.

	=== ~~'''~~Step 1: Downloading the service~~'''~~ ===		=== Step 1: Downloading the service ===
	'''Command''': Congratulations, you already did - this is built in as Command Prompt on Windows or Terminal on MacOS.		'''Command''': Congratulations, you already did - this is built in as Command Prompt on Windows or Terminal on MacOS.

	'''GitKraken''': To download GitKraken, please visit https://www.gitkraken.com/download and download it to a location you will remember.		'''GitKraken''': To download GitKraken, please visit https://www.gitkraken.com/download and download it to a location you will remember.

	=== ~~'''~~Step 2: Opening the service and signing in~~'''~~ ===		=== Step 2: Opening the service and signing in ===
	'''Command:''' You may search in your machine for Command Prompt or Terminal.		'''Command:''' You may search in your machine for Command Prompt or Terminal.
	[[File:Core team.2cf84d29.png\|left\|thumb\|Welcome to Gitkraken]]		[[File:Core team.2cf84d29.png\|left\|thumb\|Welcome to Gitkraken]]
Line 34:		Line 34:
	[[File:Core team.2cf84d29.png\|center\|thumb\|(Success)]]This means you can safely close that tab and go back to your Gitkraken window. Opening this will take you now to “Set up your profile,” where you choose your avatar and account name. Go ahead and agree with the terms and conditions. No need to start a free trial of GitKraken pro, their free version does everything we need.		[[File:Core team.2cf84d29.png\|center\|thumb\|(Success)]]This means you can safely close that tab and go back to your Gitkraken window. Opening this will take you now to “Set up your profile,” where you choose your avatar and account name. Go ahead and agree with the terms and conditions. No need to start a free trial of GitKraken pro, their free version does everything we need.

	=== ~~'''~~Step 3: Cloning a repository (in command)~~'''~~ ===		=== Step 3: Cloning a repository (in command) ===
	In order to access the desired repository, we must clone it onto your local computer. To clone a REPOSITORY owned by USERNAME, use		In order to access the desired repository, we must clone it onto your local computer. To clone a REPOSITORY owned by USERNAME, use

Line 56:		Line 56:
	Now you have a local repository! You can now look at the code of the visualization in an IDE of your choice (most of us use VSCode - see [[Tutorial for setting up the coding environment]]).		Now you have a local repository! You can now look at the code of the visualization in an IDE of your choice (most of us use VSCode - see [[Tutorial for setting up the coding environment]]).

	=== ~~'''~~Step 3: Cloning a repository (in Gitkraken)~~'''~~ ===		=== Step 3: Cloning a repository (in Gitkraken) ===
	[[File:Cloning.279e6a91.png\|thumb\|Cloning the Tutorial visualisation]]		[[File:Cloning.279e6a91.png\|thumb\|Cloning the Tutorial visualisation]]
	To clone a repository to a location, you need two things: a repository to clone, and a location to clone it to. First, choose a repository to clone by going to https://github.com/Imperial-visualizations and selecting a repository (by clicking on one of the prominent blue hyperlinks), for example, Lattice-Vibrations. Once you have opened the repository location on GitHub, you can copy the location. Do this either by copying the URL at the top of the screen or by clicking the green “code” button, followed by the copy icon (grey button).		To clone a repository to a location, you need two things: a repository to clone, and a location to clone it to. First, choose a repository to clone by going to https://github.com/Imperial-visualizations and selecting a repository (by clicking on one of the prominent blue hyperlinks), for example, Lattice-Vibrations. Once you have opened the repository location on GitHub, you can copy the location. Do this either by copying the URL at the top of the screen or by clicking the green “code” button, followed by the copy icon (grey button).