どうも。Git歴4か月のkeitaです。
今までの記事にGitHubに上げてあります~みたいなこと書きましたが、
「GitHubなにそれ?おいしいの?」みたくなってしまったので、今回は解説していきたいと思います。
今回は長くなるので、時間のある時に読んでいただければと思います。
GitHubとは?
ソフトウェア開発やWeb制作で使われる、開発プラットフォームで、
Gitというバージョン管理システムで管理しています。
2018年、マイクロソフトの傘下になりました。
Gitでできること
バージョン管理
FTPに間違えてアップしたとか、消してしまったとかというトラブルがあると思います。
Gitを導入すると、サーバーとの連携により、どれが原因か突き止めることができるので、
このトラブルを未然に防げることができます。
複数人での開発、制作
複数人で開発するときにGitHubは効果を発揮します。どこを直したかが分かる仕組みになっています。
ソースコードの公開
非公開機能もあります(こちらは主に実際の開発によく使われます)が、自分で物を作ったとき、ソースコードを公開することもできるので、アピールなどにも使われます。
Gitの概念、用語
まずは概念、用語から説明していきます。
リポジトリ
プロジェクトの器になります。
ブランチ
Gitにはブランチという概念があります。ブランチとは各バージョンの種類の事で
デフォルトはmasterです。基本、制作の場合、masterに直にアップすることはせず、
開発用ブランチやテスト用ブランチなどに枝分かれさせてそこにアップした上で、
最終的に統合していく感じになります。
クローン
Gitをローカルで編集するするときに最初にオリジナルをダウンロードするコマンドです。
Add
Gitに追加編集するファイルを決定するコマンドです。
コミット
Gitに上げる際の宣言をするコマンドです。これがないとアップできません。
プッシュ
Gitにアップするコマンドです、これ以降はプッシュとして説明します。
プル
すでにクローンを行ったフォルダに、最新のデータをローカルにダウンロードします。
一旦他の人のプッシュが起きると、プルしないと、プッシュの際エラーが起こります。
これをコンフリクトといい、間違ってデータを上書きしないような仕組みになっております。ローカルを最新にしないとプッシュできない仕組みになっております。
最終的な図解はこちらになります。
![](https://z-tree.jp/wp-content/uploads/2019/12/github.jpg)
まだいろいろありますが、基本的にはこの流れを覚えておけば大丈夫です。
環境構築
長くなりそうなので、リンク並べてスイマセン・・
TwitterのDMなどでご質問は受け付けますので、その時できる範囲でご回答いたします。
Gitのインストール
からダウンロードし、インストールします。
GitHubのアカウントを登録
GitHubのアカウントを登録します。
![](https://z-tree.jp/wp-content/uploads/cocoon-resources/blog-card-cache/513a2fe403a179cd13970f0e76bdc69e.png)
から登録できます。
SSH鍵の登録
こちらの記事に書いてくれている方がいるので参考にしてください。
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGNDA3OTYlMkZwcm9maWxlLWltYWdlcyUyRjE0NzM2ODg1NjA_aXhsaWI9cmItNC4wLjAmYXI9MSUzQTEmZml0PWNyb3AmbWFzaz1lbGxpcHNlJmZtPXBuZzMyJnM9YWFiNjg2YTlmMTdiYjg4ZjJhYzNmOWMwZTQ1MzEyNDQ%26blend-x%3D120%26blend-y%3D462%26blend-w%3D90%26blend-h%3D90%26blend-mode%3Dnormal%26mark64%3DaHR0cHM6Ly9xaWl0YS1vcmdhbml6YXRpb24taW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnMzLWFwLW5vcnRoZWFzdC0xLmFtYXpvbmF3cy5jb20lMkZxaWl0YS1vcmdhbml6YXRpb24taW1hZ2UlMkY1N2RiMTg5NzI4YzEyNmVkODc4NzY1ZmRmYjM5MzBkYTZmMzA0MDY3JTJGb3JpZ2luYWwuanBnJTNGMTU5NTIzOTQ5Mz9peGxpYj1yYi00LjAuMCZ3PTQ0Jmg9NDQmZml0PWNyb3AmbWFzaz1jb3JuZXJzJmNvcm5lci1yYWRpdXM9OCZib3JkZXI9MiUyQ0ZGRkZGRiZmbT1wbmczMiZzPTcyMTZlYTI4M2JiNjc4M2IyY2Y0MGZjNTkwZmFlYTY4%26mark-x%3D186%26mark-y%3D515%26mark-w%3D40%26mark-h%3D40%26s%3Dff1ecea915f2ba738b0ec136b4cd4e17?ixlib=rb-4.0.0&w=1200&fm=jpg&mark64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9R2l0SHViJUUzJTgxJUE3c3NoJUU2JThFJUE1JUU3JUI2JTlBJUUzJTgxJTk5JUUzJTgyJThCJUU2JTg5JThCJUU5JUEwJTg2fiVFNSU4NSVBQyVFOSU5NiU4QiVFOSU4RCVCNSVFMyU4MyVCQiVFNyVBNyU5OCVFNSVBRiU4NiVFOSU4RCVCNSVFMyU4MSVBRSVFNyU5NCU5RiVFNiU4OCU5MCVFMyU4MSU4QiVFMyU4MiU4OX4mdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtcGFkPTAmcz00YmU5YTQ0MjUzYmM4ZDQxNTFkY2RiNDdlYzczZWU1OA&mark-x=120&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBzaGl6dW1hJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LXBhZD0wJnM9Yjk2NmQxYmVkZDAxZTZiNWMxZGJlZDYyMzJmYjRkMjg&blend-x=242&blend-y=454&blend-w=838&blend-h=46&blend-fit=crop&blend-crop=left%2Cbottom&blend-mode=normal&txt64=QUNFUw&txt-x=242&txt-y=539&txt-width=838&txt-clip=end%2Cellipsis&txt-color=%231E2121&txt-font=Hiragino%20Sans%20W6&txt-size=28&s=6015e6cf41783bdc0bb8557db1e903fd)
公式にもヘルプがあります。
実際に使ってみる
黒い画面は怖くない
今回GUIではなく、コマンドで説明しますが慣れればこちらの方が早い(GUIは動きが重たいものもあるので)のでこちらで説明します。
Windowsの場合コマンドプロンプトでできますが、VSCodeのターミナル機能を使えば、
わざわざディレクトリに移動しなくてもコマンドを実行することができます。
VSCodeとは?
マイクロソフトが開発している、コードエディタです。
正式名称は「Visual Studio Code」です。
![](https://z-tree.jp/wp-content/uploads/cocoon-resources/blog-card-cache/2d12e02afa45389f9df5f8f7ed2e9d01.png)
こちらからダウンロードできます。無料です。
Gitとの相性がよく、もちろんマイクロソフトが開発しているわけですから、
ターミナル機能でコマンドプロンプトと同じ機能が使えます。
VSCodeでターミナルを起動するには?
前提条件としてフォルダをVSCodeで開きます。
ターミナル→新しいターミナルで下にターミナルの領域が表示されます。
後はコマンドを打っていくだけです。
![](https://z-tree.jp/wp-content/uploads/2019/12/tarminal.jpg)
Gitを触ってみる
まずは、自分のリポジトリを作りましょう。
自分のローカルに適当にフォルダを作ります。
GitHubにログインし、
左の「Repositories」から「NEW」ボタンをクリックします。
![](https://z-tree.jp/wp-content/uploads/2019/12/new.jpg)
画像の画面を開くので、「Repository name」にリポジトリ名(英語)
Descriptionに説明、今回は公開するものではないので、
「Private」にクリックします。
終わったら「Create repositiory」ボタンをクリックします。
![](https://z-tree.jp/wp-content/uploads/2019/12/githubcreate.jpg)
リポジトリが作成されました。
とりあえず、HTMLでもなんでもいいのでファイルを作ってみましょう。
作り終わったら、ターミナルで
git init
というコマンドを打ちます。これはgitがそのフォルダで使えるようにする宣言です。
次に、
git add (フォルダ名)/ファイル名
を打ちます。これがAddです。
次に
git commit -m "first commit"
というコマンドを打ちます。これがコミットです。 -m ~はわかりやすい説明を入れます。
任意ですがわかりずらくなるので必須という認識でいてください。
次に、打つコマンドは初回のみになります。
GitHubのリポジトリにあるCodeタブにある
Quick setup — if you’ve done this kind of thing before
のSSHボタンをクリックします。
![](https://z-tree.jp/wp-content/uploads/2019/12/githubcreate2.jpg)
git@~.gitをコピーしますその上で、以下のコマンドを打ちます。
git remote add origin (コピーしたもの)
次に
git push -u origin master
を打ち
SSHのパスワードを求められます。ここは入力しても変化しないので注意してください。
成功するとGitHubに反映されます。
まとめ
Gitは覚えれば難しいものではないですし、黒い画面も慣れれば怖くありません。もし質問があればTwitterのDMなりでできる範囲で回答受付しますので、よろしくお願い致します。
コメント