-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbasics.html
199 lines (171 loc) · 7.85 KB
/
basics.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
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GitHub Basics | GitHub Tutorial</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<div class="container">
<h1>GitHub Basics</h1>
<p class="subtitle">Understanding the fundamentals</p>
</div>
</header>
<main class="container">
<nav class="navigation-card">
<ul class="nav-links">
<li><a href="index.html" class="btn">Home</a></li>
<li><a href="workflow.html" class="btn">Collaborative Workflow</a></li>
<li><a href="advanced.html" class="btn">Advanced Features</a></li>
<li><a href="notebook.html" class="btn highlight">Hands-on Notebook</a></li>
</ul>
</nav>
<section>
<h2>What is Git vs. GitHub?</h2>
<p><strong>Git</strong> is a distributed version control system that tracks changes in source code during software development. It was created by Linus Torvalds in 2005 for development of the Linux kernel.</p>
<p><strong>GitHub</strong> is a cloud-based hosting service that lets you manage Git repositories. GitHub adds many features on top of Git, including:</p>
<ul>
<li>A web-based interface</li>
<li>Access control</li>
<li>Bug tracking</li>
<li>Feature requests</li>
<li>Task management</li>
<li>Wikis for project documentation</li>
<li>Pull requests for code review</li>
</ul>
<div class="note">
<p><strong>Note:</strong> While Git is a command-line tool, GitHub provides a web-based graphical interface for Git operations and extends Git's functionality.</p>
</div>
</section>
<section>
<h2>Creating Repositories</h2>
<p>A repository (or "repo") is like a project folder that contains all of your project's files and stores each file's revision history.</p>
<h3>Creating a new repository on GitHub</h3>
<ol>
<li>Log in to your GitHub account</li>
<li>Click the "+" icon in the top-right corner and select "New repository"</li>
<li>Name your repository</li>
<li>Add an optional description</li>
<li>Choose public or private visibility</li>
<li>Select "Add a README file" if desired</li>
<li>Choose whether to add .gitignore and a license</li>
<li>Click "Create repository"</li>
</ol>
<h3>Cloning an existing repository</h3>
<p>Cloning creates a local copy of a repository on your computer.</p>
<pre><code>git clone https://github.com/username/repository.git</code></pre>
<div class="tip">
<p><strong>Tip:</strong> When creating a new repository, initializing it with a README file is recommended as it provides immediate documentation and allows you to clone the repository right away.</p>
</div>
</section>
<section>
<h2>Making Commits</h2>
<p>A commit is a snapshot of your repository at a specific point in time. It's like saving a new version of your project.</p>
<h3>Basic commit workflow</h3>
<ol>
<li>Make changes to your files</li>
<li>Stage the changes using <code>git add</code></li>
<li>Commit the staged changes with a message using <code>git commit</code></li>
<li>Push the commits to GitHub using <code>git push</code></li>
</ol>
<h3>Git commands for committing</h3>
<pre><code># Check status of your files
git status
# Stage specific file
git add filename.txt
# Stage all changes
git add .
# Commit with a message
git commit -m "Your detailed commit message here"
# Push to GitHub
git push origin main</code></pre>
<div class="note">
<p><strong>Note:</strong> Write clear and descriptive commit messages. A good practice is to use the imperative mood (e.g., "Add feature" instead of "Added feature").</p>
</div>
</section>
<section>
<h2>Working with Branches</h2>
<p>Branches allow you to develop features, fix bugs, or experiment with new ideas in a contained area of your repository.</p>
<h3>Basic branching concepts</h3>
<ul>
<li><strong>Main branch</strong>: The default branch (formerly called "master")</li>
<li><strong>Feature branches</strong>: Created to develop specific features isolated from the main branch</li>
<li><strong>Merging</strong>: Combining changes from one branch into another</li>
</ul>
<h3>Common branch commands</h3>
<pre><code># Create and checkout a new branch
git checkout -b feature-branch
# Switch to an existing branch
git checkout branch-name
# List all branches
git branch
# Push a branch to GitHub
git push origin feature-branch
# Merge a branch into your current branch
git merge branch-name</code></pre>
<div class="tip">
<p><strong>Tip:</strong> Name your branches descriptively, using slashes to categorize them (e.g., feature/user-authentication, bugfix/login-issue).</p>
</div>
</section>
<section>
<h2>GitHub Interface Overview</h2>
<h3>Key Areas of the GitHub Interface</h3>
<table>
<tr>
<th>Feature</th>
<th>Description</th>
</tr>
<tr>
<td>Code tab</td>
<td>View files and folders in your repository</td>
</tr>
<tr>
<td>Issues tab</td>
<td>Track bugs, enhancements, and other tasks</td>
</tr>
<tr>
<td>Pull Requests tab</td>
<td>Review and discuss code changes before merging</td>
</tr>
<tr>
<td>Actions tab</td>
<td>Set up CI/CD workflows and automation</td>
</tr>
<tr>
<td>Projects tab</td>
<td>Project management boards</td>
</tr>
<tr>
<td>Wiki tab</td>
<td>Documentation for your project</td>
</tr>
<tr>
<td>Insights tab</td>
<td>Analytics and statistics for your repository</td>
</tr>
<tr>
<td>Settings tab</td>
<td>Repository configuration options</td>
</tr>
</table>
<div class="note">
<p><strong>Note:</strong> Some tabs may not be visible if certain features aren't enabled for your repository.</p>
</div>
</section>
<nav class="navigation-card">
<h3>Continue Learning</h3>
<ul class="nav-links">
<li><a href="workflow.html" class="btn">Next: Collaborative Workflow →</a></li>
<li><a href="notebook.html" class="btn highlight">Try the Hands-on Notebook</a></li>
</ul>
</nav>
</main>
<footer>
<div class="container">
<p>GitHub Tutorial Series - Created for educational purposes</p>
</div>
</footer>
</body>
</html>