#StandWithUkraine - End the Russian invasion

Join usa and donate. All 2022 book royalties will exist donated to:
Save Life in Ukraine and Ukraine Humanitarian Appeal.

Create a New Repo and Upload Files on GitHub

Now that yous've made a re-create of our GitHub template, the next step is to larn how to create a brand-new repo and upload files. These skills will be helpful for several scenarios. First, if you accept to fork a repo, which GitHub allows you to do simply one fourth dimension, this method will permit you to create additional copies. Second, yous'll need to upload some of your own files when creating data visualizations using Nautical chart.js and Highcharts templates in Chapter eleven and Leaflet map templates in Chapter 12. Once once more, nosotros'll demonstrate how to do all of these steps in GitHub's beginner-level browser interface, but meet the next section on GitHub Desktop for an intermediate-level interface that'due south more than efficient for working with code templates.

In the previous section, yous created a copy of our GitHub repo with the Utilize this template button, and nosotros intentionally set up our repos with this newer characteristic because it allows the user to make multiple copies and assign each one a different name. Many other GitHub repos do not include a Template button, so to re-create those you'll demand to click the Fork push button, which automatically generates a copy with the aforementioned repo proper noun as the original. Merely what if you wish to fork someone'south repo a second time? GitHub prevents you from creating a 2nd fork to avoid violating i of its of import rules: every repo in your account must have a unique name, to avert overwriting and erasing your work.

And so how do you make a second fork of a GitHub repo, if in that location's no Use this template button? Follow our recommended workaround that's summarized in these iii steps:

  • Download the existing GitHub repo to your local figurer
  • Create a brand-new GitHub repo with a new name
  • Upload the existing code repo files to your brand-new repo
  1. Click on the Code > Download Zip drib-down menu button on any repo, as shown in Figure x.12. Your browser will download a zipped compressed folder with the contents of the repo to your local computer, and it may ask you where you wish to save information technology. Decide on a location and click OK.

Click Code and select Download Zip to create a compressed folder of a repo on your computer.

Figure 10.12: Click Lawmaking and select Download Zip to create a compressed folder of a repo on your figurer.

  1. Navigate to the location on your computer where you saved the folder. Its file name should end with .zip, which ways you need to double-click to "unzip" or de-compress the binder. After yous unzip it, a new folder volition appear named in this format, REPOSITORY-Branch, which refers to the repository name (such every bit leaflet-map-simple) and the co-operative proper name (such every bit master), and information technology will contain the repo files. Ane of those files is named index.html, which y'all'll use in a few steps below.

  2. Go back to your GitHub account in your spider web browser, click on the plus (+) symbol in the upper-right corner of your account, and select New repository, as shown in Effigy ten.xiii.

Click the plus (+) symbol in upper-right corner to create a new repo.

Figure 10.13: Click the plus (+) symbol in upper-right corner to create a new repo.

  1. On the next screen, GitHub will ask you to enter a new repo name. Choose a curt one, preferably all lower-case, and split words with hyphens if needed. Let's name it practice considering nosotros'll delete it at the stop of this tutorial.

Check the box to Initialize this repository with a README to simplify the adjacent steps.

Also, select Add a license that matches the code yous program to upload, which in this case is MIT License. Other fields are optional. Click the green Create Repository button at the bottom when done, as shown in Figure 10.14.

Name your new repo practice, check the box to Initialize this repo with a README, and Add a license (select MIT) to match any code you plan to upload.

Figure ten.xiv: Name your new repo practice, check the box to Initialize this repo with a README, and Add together a license (select MIT) to match any code you lot programme to upload.

Your new repo volition take a web address similar to https://github.com/USERNAME/practice.

  1. On your new repo home folio, click the Add together File > Upload Files driblet-down menu button, most the middle of the screen, every bit shown in Figure 10.15.

Click the Upload Files button.

Figure 10.15: Click the Upload Files button.

  1. Inside the repo binder that y'all previously downloaded and unzipped on your local computer, drag-and-driblet the index.html file to the upload screen of your GitHub repo in your browser, as shown in Effigy 10.16. Do not upload LICENSE or README.doctor considering your new repo already contains those two files. Scroll down to click the green Commit Changes button.

Drag-and-drop the index.html file to the upload screen.

Figure 10.16: Drag-and-drib the index.html file to the upload screen.

When the upload is consummate, your repo should comprise three files, now including a copy of the index.html code that you previously downloaded from the leaflet-map-simple template. This achieved our goal of working around GitHub's one-fork rule, by creating a new repo and manually uploading a second copy of the code.

Optionally, you could utilize GitHub Pages to publish a live version of the code online, and paste the links to the live version at the acme of your repo and your README.md file, as described in the Copy, Edit, and Host a Simple Leaflet Map Template section of this chapter.

  1. Since this was just a practice repo, let's delete it from GitHub. In the repo screen of your browser, click the top-right Settings button, coil all the way down to the Danger Zone, and click Delete this repository, as shown in Figure 10.17. GitHub will enquire you to type in your username and repo name to ensure that you lot really want to delete the repo, to prove yous are not a drunken brownie chef.

After clicking the Delete Repository button, GitHub will ask you to type your username and repo name to confirm.

Figure x.17: Subsequently clicking the Delete Repository button, GitHub will ask you to type your username and repo proper noun to ostend.

Then far, you've learned how to re-create, edit, and host code using the GitHub web interface, which is a slap-up introduction for beginners. Now you're ready to movement upwards to tools that will allow you to piece of work more efficiently with GitHub, such as GitHub Desktop and Atom Editor, to quickly move entire repos to your local figurer, edit the code, and motion them dorsum online.