-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathfirstweb.html
More file actions
126 lines (105 loc) · 5.92 KB
/
firstweb.html
File metadata and controls
126 lines (105 loc) · 5.92 KB
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
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>Lägg upp din första hemsida - Jonathans Programmeringstips</title>
<!-- Google Font and font-awesome-->
<link href='https://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="fonts/font-awesome/css/font-awesome.min.css">
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/main.css">
<style>
.jumbotron {
background: url('../images/bg_tips.jpg');
}
ul {
text-align: left;
font: 2em "Open Sans", sans-serif;
}
.container p {
text-align: left;
}
</style>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target=".navbar-collapse" data-offset="50">
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#jumbotron"><img src="images/top-logo.png" title="Jonathan" alt="Jonathan" /></a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#tips">Din första hemsida</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span></button>
<iframe width="560" height="315" src="//www.youtube.com/embed/nKIu9yen5nc?showinfo=0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
<div id="tips">
<div class="container homepage">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-compass fa-stack-1x fa-inverse"></i>
</span>
<h2>Lägg upp din första hemsida på rätt sätt</h2>
<hr>
<p>När du programmerar är det viktigt att din kod hela tiden är säker och att du kan gå tillbaka om du gör fel eller vill ändra något.</p><p> Därför finns det ett perfekt verktyg som gör så att du kan gå tillbaka om du gör fel - Git.</p>
<p>Börja med att registrera dig på <a href="https://github.com/" target="_blank">Github</a>. Skapa sedan ett nytt repository genom att trycka på New Repository uppe i högra hörnet.</p>
<img src="images/new-rep.png" alt="New repository" id="middleimg" /><p></p>
<p> Döp det till ditt GITHUBNAMN.github.io (i mitt fall jonathanort.github.io).</p>
<p>Ladda sedan ner <a href="http://www.sourcetreeapp.com/" target="_blank">SourceTree</a> och starta programmet.</p>
<p>Dra in mappen med din hemsida i sourcetree och tryck create.</p>
<img src="images/drag.png" alt="New repository" id="middleimg" /><p></p>
<p>Kryssa i rutan med Unstaged files och tryck commit längst uppe till vänster.</p>
<p>Du kommer då behöva skriva in ett meddelande för din commit. Detta är vilka ändringar som har gjorts med då detta är vår första så är "First commit" ett bra meddelande.</p>
<img src="images/commit.png" alt="New repository" id="middleimg" /><p></p>
<p>Nu ska vi ladda upp sidan till github så den kan nås av hela värden.</p>
<p>Gå tillbaka till github och projektet du skapade och kopiera ditt url, det borde se ut något liknande mitt men med ditt namn istället :).</p>
<p>Högerklicka sedan på remotes i vänstra spalten och välj new remote. Välj ett namn och klistra in ditt url från github där under. Skriv även in ditt användarnamn.</p>
<img src="images/remotes.png" alt="New repository" id="middleimg" />
<img src="images/commit2.png" alt="New repository" id="middleimg" /><p></p>
<p>Tryck sedan push längst upp i SourceTree och skriv in ditt lösenord till github.</p>
<p>Nu kommer din sida inom kort ligga på DITTNAMN.github.io.</p>
<p>Varje gång du ändrar något på sidan kan du nu trycka commit igen, skriva vilka ändringar du har gjort och sen pusha projektet igen. Detta gör det möjligt att samarbeta i ett team utan att skriva över någon annans ändringar och används i nästan alla stora företag. Om du kommer på att du vill gå tillbaka till en tidigare version så kan du lätt välja den och gå tillbaka.</p>
<p>Om du stöter på några problem så kan du självfallet fråga mig om hjälp :)</p>
</div>
</div>
<footer>
<div class="container">
<p><img src="images/bottom_logo.png"></p>
</div>
</footer>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/smoothscroll.js"></script>
</body>
</html>