0
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

GitHubのアカウントを作成して、リポジトリ作成、クローン、コミット、プッシュまでの手順

Posted at

GitHub は基本英語ページですので、英語が苦手な方でも使い始められるようガイドしたいと思い、まとめました。

サインアップでアカウントを作成

GitHub のページを開きます。

image.png

Username, Email, Password を入力します。
Usernameは GitHub 内で誰も使っていない名前にする必要があります。
Emailは登録確認のメールが来ますので受信できるメールアドレスにしてください。

使用できる内容であれば以下のように緑のチェックマークがつきます。
image.png

入力できれば Sign up for GitHub ボタンを押します。

アカウント情報の入力

image.png

パスワードが簡単なものだと警告が出て再入力となります。
Make sure it's at least 15 characters OR at least 8 characters including a number and a lowercase letter.
とあるので、16文字以上か9文字以上で数字と英小文字を含む

メール認証

うまく登録出来たら、以下のようなメールが送られてきます。
(見つからない場合は迷惑メールフォルダも確認してください)
image.png

Verify email address を押すと認証が完了し、以下の画面が表示されます。

image.png
左にある Create a repository ボタンを押します。

リポジトリの作成

Repository name に作成するリポジトリ名を入力します。(使える名前なら緑のチェックが入ります。)
image.png

Descriptionにはこのリポジトリの説明を入れます。省略可能です。

Public と Private が選択できます。Publicにするとインターネット上のだれでも見れるようになります。Private にすると自分と許可した人のみが見れるようになります。
今回はPublicにします。

Initialize this repository with a README にチェックを入れるとリポジトリ内に README.md ファイルが作成されます。
このファイルの内容はGitHubのリポジトリを開くと表示されるようになっているので、Descriptionでは書ききれない内容や画像などを入れます。
後から手動で追加もできますので、今回はチェックしないで進めます。

Add .gitignore: None のボタンは、gitで管理しないファイルを記述する設定ファイルです。Noneの場合は作成しません。
これも後から使いできるので今回はNoneのままにします。

Add a license: None のボタンは子のリポジトリの内容のライセンスを決めてそのファイルを作成するボタンです。
こちらも後からつかできますので、今回はNoneのままにします。

Create repository ボタンを押すと作成完了です。

ローカルにクローンする

作成完了すると以下の画面になります。
image.png

水色の背景部分にURLがありますが、これを使うとローカルに clone することができます。
その下の ...or create a new repository on the command line はローカルのフォルダ内をリポジトリと結び付けて管理するためのコマンドです。
さらに下の ...or push an existing repository form the command line は既にあるgitリポジトリのpush先に今回作ったリポジトリを設定するためのコマンドです。

これから何かを開発する場合は、git clone https://github.com/github-japanese-user/first_nuxt.gitとすれば first_nuxt というフォルダ内にクローンされます。

git コマンドが実行できない場合は git をインストールして下さい。

(Windows に git をインストールする手順)[https://qiita.com/nakazawaken1/items/bbcb4640cf9aceee5745]

今回は、Cドライブ直下に dev フォルダを作成してコマンドを実行しました。
image.png

VisualStudioCodeでクローンしたフォルダを開く

クローンしたフォルダを右クリックして VisualStudioCode で開きます。(Codeで開く)
image.png

インストールしていない場合は下記を参考にしてください。

VisualStudioCodeのインストール手順(Windows)

image.png
フォルダ内はまだからっぽです。
右下のポップアップは拡張機能の提案ですので×ボタンで消しても問題ありません。

ファイルを追加する

FIRST_NUXTというフォルダ名の右に出るファイル作成ボタンimage.pngを押します。
image.png

ファイル名入力欄が出るので、README.md と入力します。
image.png

確定すると右側でファイルの内容が入力できるので、下記のように入力します。
image.png

# 初めてのコミット

GitHubからリポジトリをクローンしてファイルを追加しました。

文字を入力すると3か所表示が変わります。

image.png
ファイル名のタブの右に●がつきます。これは編集中を表しています。保存すると消えます。

image.png
1つ目と3つ目のアイコンに数字がつきます。上は編集中ファイルの数、下はgit管理対象で変更されたファイルの数となります。

ファイルを保存すると以下の表示にかわります。
image.png
編集中ではなくなりましたが、git管理ファイルが変更されているので3つ目のアイコンの数字のみが残ります。


コミットコメントを入力する

ソース管理アイコンimage.pngをクリックします。
入力欄が表示されます。これはコミットコメントを入力する部分になります。
どんな変更したかなどを入力します。
今回はあまり意味はなく変更したので「初コミット」とします。
image.png
CHANGESには変更されたファイルが一覧で表示されます。


コミットする

コミットボタンimage.pngを押します。

以下の確認画面が表示されます。
image.png
内容は「ステージングされていないファイルをコミットしようとしています、全変更ファイルを直接コミットしてもいいか」という感じです。
ステージというのは変更したうちの一部のファイルをコミットするときに、コミットするファイルを置いておく場所です。
今回は一つのファイルしか変更していなくてそのままコミットしたいので、Yesを選択します。


コミット者の名前とメールアドレスの登録

初めてコミットするときは以下の画面が出ます。
image.png
コミットする人の名前とメールアドレスを設定してくださいという意味です。
Cancelボタンを押していったん閉じます。

メニューの Terminal → New Terminal を開きます。
image.png

画面下にターミナルが表示されます。
image.png

ここで名前とメールアドレスを設定します。
image.png

以下のようにコマンドを入力し実行します。

git config user.name 設定する名前
git config user.email 設定するメールアドレス

※GitHub にプッシュするので、メールアドレスは GitHubに登録したものを指定します。

設定出来たら、再度コミットしてみてください。

コミットが成功すればコメントや一覧が空になります。
image.png

pushする

コミットしただけではまだ GitHub には反映されません。

画面左下を見ると上矢印の左に1となっているところがあります。
image.png
これは、GitHub に反映されていないファイルが1つあることを表しています。

それでは push してみましょう。

その他コマンドボタンimage.pngから、
Push を選択します。

image.png

はじめて GitHub にpushするときはログイン画面が表示されますので、ログインしてください。

image.png

ログインが成功するとPushも完了し左下の表示から上向きの矢印が消えます。

image.png

GitHub を確認する

GitHub のリポジトリのページを開くと反映されているのが確認できます。ページを開きっぱなしだった場合はリロードしてみて下さい。
image.png

0
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?