git-learning/index.html at main · Shashank97code/git-learning · GitHub

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
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Git Commands List</title>
    <style>
      body {
        font-family: Arial, sans-serif;
        margin: 20px;
        background-color: #f5f5f5;
      }
      h1 {
        color: #333;
      }
      .card-container {
        display: flex;
        flex-wrap: wrap;
        gap: 5px 15px;
      }
      .command {
        background-color: #fff;
        border: 1px solid #ddd;
        padding: 15px;
        margin-bottom: 10px;
        border-radius: 5px;
        flex: 1 1 calc(33% - 20px); /* 3 columns */
        min-width: 250px;
        box-sizing: border-box;
      }
      .command h2 {
        margin-top: 0;
        color: #007acc;
      }
      .command pre {
        background-color: #eef;
        padding: 10px;
        border-radius: 3px;
        overflow-x: auto;
      }
      .description {
        margin-top: 10px;
      }
      @media (max-width: 900px) {
        .command {
          flex: 1 1 calc(50% - 20px); /* 2 columns on smaller screens */
        }
      }
      @media (max-width: 600px) {
        .command {
          flex: 1 1 100%; /* 1 column on mobile */
        }
      }
    </style>
  </head>
  <body>
    <div>
      <h1>Basic Git Commands</h1>
      <div class="card-container">
        <div class="command">
          <h2>git init</h2>
          <pre>git init</pre>
          <div class="description">
            Initializes a new Git repository in the current directory. This
            creates a hidden <code>.git</code> folder that tracks all version
            history and configuration for your project.
          </div>
        </div>
        <div class="command">
          <h2>git clone</h2>
          <pre>git clone &lt;repository-url&gt;</pre>
          <div class="description">
            Creates a local copy of an existing remote repository. Downloads all
            files, history, and branches from the specified URL.
          </div>
        </div>
        <div class="command">
          <h2>git add</h2>
          <pre>git add &lt;file&gt;</pre>
          <div class="description">
            Stages changes in the specified file, preparing them to be
            committed. The file will be included in the next commit.
          </div>
          <pre>git add .</pre>
          <div class="description">
            Stages all modified and new files in the current directory and its
            subdirectories for the next commit.
          </div>
        </div>
        <div class="command">
          <h2>git commit</h2>
          <pre>git commit -m "Your commit message"</pre>
          <div class="description">
            Records the staged changes to the repository with a descriptive
            message. Each commit creates a unique snapshot of your project.
          </div>
        </div>
        <div class="command">
          <h2>git status</h2>
          <pre>git status</pre>
          <div class="description">
            Displays the current state of the working directory and staging
            area. Shows which files are modified, staged, or untracked.
          </div>
        </div>
        <div class="command">
          <h2>git push</h2>
          <pre>git push &lt;remote&gt; &lt;branch&gt;</pre>
          <div class="description">
            Uploads local commits from the specified branch to a remote
            repository, making your changes available to others.
          </div>
        </div>
        <div class="command">
          <h2>git pull</h2>
          <pre>git pull &lt;remote&gt; &lt;branch&gt;</pre>
          <div class="description">
            Fetches new commits from the specified remote branch and merges them
            into your current branch, updating your local repository.
          </div>
        </div>
        <div class="command">
          <h2>git branch</h2>
          <pre>git branch</pre>
          <div class="description">
            Lists all local branches in the repository. The current branch is
            highlighted with an asterisk.
          </div>
        </div>
        <div class="command">
          <h2>git checkout</h2>
          <pre>git checkout &lt;branch&gt;</pre>
          <div class="description">
            Switches to the specified branch, updating the working directory to
            match its state.
          </div>
          <pre>git checkout -b &lt;branch&gt;</pre>
          <div class="description">
            Creates a new branch with the given name and immediately switches to
            it.
          </div>
        </div>
        <div class="command">
          <h2>git merge</h2>
          <pre>git merge &lt;branch&gt;</pre>
          <div class="description">
            Integrates changes from the specified branch into the current
            branch, combining their histories.
          </div>
        </div>
        <div class="command">
          <h2>git log</h2>
          <pre>git log</pre>
          <div class="description">
            Shows the commit history for the repository, including commit
            hashes, authors, dates, and messages.
          </div>
          <pre>git log --oneline</pre>
          <div class="description">
            Displays the commit history in a condensed, one-line-per-commit
            format for easier reading.
          </div>
        </div>
        <div class="command">
          <h2>git remote</h2>
          <pre>git remote -v</pre>
          <div class="description">
            Lists the short names and URLs of remote repositories connected to
            your local repository, showing where you can push or pull code.
          </div>
        </div>
      </div>
    </div>
  </body>
</html>