This repository has been archived by the owner on Jan 9, 2019. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathgithub-pages.html
108 lines (96 loc) · 4.88 KB
/
github-pages.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
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PinkWebDev git course</title>
<link rel="stylesheet" href="css/gallery.min.css">
<link rel="stylesheet" href="css/gallery.theme.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html"><img src="img/logo.png" alt="Pink WebDev logotype"></a>
<div class="navigation">
<ul>
<!-- <li>
<a href="person1.html" class="selected">Person 1</a>
</li>
<li>
<a href="person2.html">Person 2</a>
</li>-->
<li>
<a href="github-pages.html" class="selected">Github Pages</a>
</li>
<li>
<a href="links.html">Länkar</a>
</li>
</ul>
</div>
</header>
<div class="gallery items-5">
<div id="item-1" class="control-operator"></div>
<div id="item-2" class="control-operator"></div>
<div id="item-3" class="control-operator"></div>
<div id="item-4" class="control-operator"></div>
<div id="item-5" class="control-operator"></div>
<figure class="item">
<div class="instruction">
<h1>Steg 1</h1>
<p>
För att lägga upp ditt projekt på github pages behöver du först och främst skapa ett nytt repository.
Gå in på din profil och välj att skapa ett repo. Det enklaste är att döpa det enligt formeln user.github.io, där user är ditt användarnamn.
Se till att klicka i "Initialize this repository with a README", då det gör att du direkt kan klona repot till din maskin.
</p>
</div>
</figure>
<figure class="item">
<div class="instruction">
<h1>Steg 2</h1>
<p>
<p>Därefter behöver du klona repot till din dator. Öppna en ny terminal där du vill lägga repositoryt och kör kommandot
<span class="code">git clone https://github.com/user/user.github.io.git</span> (med rätt länk förstås)
</p>
</div>
</figure>
<figure class="item">
<div class="instruction">
<h1>Steg 3</h1>
<p>
Nu när du har ett repository på din dator är det bara till att lägga in alla filer från ditt projekt. Se till att det finns en fil som heter <span class="code">index.html</span> i roten.
</p>
</div>
</figure>
<figure class="item">
<div class="instruction">
<h1>Steg 4</h1>
<p>
Nu behöver du se till att spara dina grejer. Gå in i terminalen och kolla statusen på ditt repository genom att köra <span class="code">git status</span>
</p>
<p>Som du ser har det dykt upp en massa nya filer som du vill committa. Först behöver du lägga till alla filer till gits "staging area", genom att göra <span class="code">git add .</span></p>
<p>Därefter kan du göra en commit genom att köra <span class="code">git commit -m "Mitt commitmeddelande"</span> </p>
<p>Nu ligger alla filer sparade lokalt, men de ligger fortfarande inte i ditt remote repositor på git. Därför måste du också köra <span class="code">git push</span> </p>
</div>
</figure>
<figure class="item">
<div class="instruction">
<h1>Steg 5</h1>
<p>
Nu har ditt projekt pushats till github och github pages. Om du går in på http://user.github.io (med ditt användarnamn) så ska du kunna se ditt projekt.
Ibland tar det en liten stund att deploya, men oftast går det rätt fort.
</p>
<p>Nu är det bara att jobba vidare med ditt projekt. En bra idé är att skapa en ny branch (t.ex. develop) där all din utveckling sker. Varje gång du pushar till master-branchen
kommer nämligen din site att deployas på nytt, och det är inte alltid du vill att det ska hända. Ibland har du många nya features på plats och då är det bra att dessa ligger i en egen branch fram till att du har nått ett stabil tillstånd,
och då kan du merga in develop-branchen in i master.
</p>
</div>
</figure>
<div class="controls">
<a href="#item-1" class="control-button">•</a>
<a href="#item-2" class="control-button">•</a>
<a href="#item-3" class="control-button">•</a>
<a href="#item-4" class="control-button">•</a>
<a href="#item-5" class="control-button">•</a>
</div>
</div>
</body>
</html>