forked from IsaKiko/D3-visualising-data
-
Notifications
You must be signed in to change notification settings - Fork 0
/
04-publishing-with-github.html
74 lines (74 loc) · 4.6 KB
/
04-publishing-with-github.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="pandoc">
<title>Software Carpentry: Publishing using Github</title>
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap-theme.css" />
<link rel="stylesheet" type="text/css" href="css/swc.css" />
<link rel="alternate" type="application/rss+xml" title="Software Carpentry Blog" href="http://software-carpentry.org/feed.xml"/>
<meta charset="UTF-8" />
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body class="lesson">
<div class="container card">
<div class="banner">
<a href="http://software-carpentry.org" title="Software Carpentry">
<img alt="Software Carpentry banner" src="img/software-carpentry-banner.png" />
</a>
</div>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<h1 class="title">Publishing using Github</h1>
<h2 class="subtitle">Show us your art!</h2>
<div id="learning-objectives" class="objectives panel panel-warning">
<div class="panel-heading">
<h2 id="learning-objectives" class="objectives panel panel-warning"><span class="glyphicon glyphicon-certificate"></span>Learning Objectives</h2>
</div>
<div class="panel-body">
<ul>
<li>Hosting your page on Github</li>
</ul>
</div>
</div>
<p>The next thing we want to do is show the world what we’ve made! There are different ways to go about this. One of the easiest ones is provided by <a href="https://github.com">Github</a>.</p>
<p>You should all have signed up for a Github account. If you haven’t, now is the time!</p>
<p>As you might remember, Github uses git, which is a version control software that is used to track changes in text documents. This alone makes it perfect for hosting our code and enables us to travel back in time and undo errors that we might introduce.</p>
<p>Using git you can create so-called repositories in your folders. The folder and its subfolders are then tracked and git tells you immediately if and what has changed in the files that are contained within the repository. You can ‘commit’ to a change you made and synchronize your local repository with the one that is hosted on Github.</p>
<p>But what’s even better is that Github gives us the possibility to turn every repository into a website.</p>
<p>First, let’s create our new repository on Github:</p>
<ul>
<li>Sign in to Github (https://github.com)</li>
<li>Create a new repository and call it <code>myartwork</code></li>
</ul>
<p>Don’t worry about the other options for now. Using git in the command line, the Github app (available on Windows and Mac OS X), or Sourcetree (https://www.sourcetreeapp.com/), clone this repository to get a local copy. Copy the file that contains your artwork into your local repository and call it <code>index.html</code>. The reason for this is that ‘index.html’ is the default file that is loaded on the server.</p>
<p>Save the file, commit the change, and push the changes to the repository on Github.</p>
<p>Right now, our code is on the web, but we haven’t told the Github to publish it yet. To do this, go to the Github repository settings (under Watch/Star counters), and change the default GitHub Pages branch to <code>master</code>.</p>
<div id="show-us-your-art-work" class="challenge panel panel-success">
<div class="panel-heading">
<h2 id="show-us-your-art-work" class="challenge panel panel-success"><span class="glyphicon glyphicon-pencil"></span>Show us your art work!</h2>
</div>
<div class="panel-body">
<p>Publish your art work and post it on the Etherpad. It should be http://<username>.github.io/<myartwork></p>
</div>
</div>
</div>
</div>
<div class="footer">
<a class="label swc-blue-bg" href="http://software-carpentry.org">Software Carpentry</a>
<a class="label swc-blue-bg" href="https://github.com/swcarpentry/lesson-template">Source</a>
<a class="label swc-blue-bg" href="mailto:[email protected]">Contact</a>
<a class="label swc-blue-bg" href="LICENSE.html">License</a>
</div>
</div>
<!-- Javascript placed at the end of the document so the pages load faster -->
<script src="js/jquery.min.js"></script>
<script src="css/bootstrap/bootstrap-js/bootstrap.js"></script>
</body>
</html>