5
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

[GitHub入門] リポジトリとREADMEから始める

Posted at

前回(Git/GitHubの基本概念とGitHub導入による投資対効果(ROI))は、GitとGitHubを使うメリットや、ROI(投資対効果)について解説しました。

第2回となる今回は、いよいよ実際にGitHubを触っていきます!
まずはプロジェクトの「入れ物」であるリポジトリを作成し、プロジェクトの「説明書」となるREADMEを整備するところから始めましょう。

GitHub入門シリーズ 全10回

本記事は「GitHub入門」全10回のNo.2です。

  • No.1:Git/GitHubの基本概念とGitHub導入による投資対効果(ROI)
  • No.2:リポジトリとREADMEから始める
  • No.3:変更を確定!コミット実行とコミットメッセージの書き方
  • No.4:VS CodeでGitを使いこなす マージ・コンフリクト・便利機能
  • No.5:Issue(イシュー)でタスク管理
  • No.6:Pull Request(PR)とコードレビュー
  • No.7:ブランチ戦略の比較 Git Flow、GitHub Flow、GitLab Flow
  • No.8:GitHub Actions CI/CDで自動化
  • No.9:Code Scanning・Dependabot セキュリティの自動化
  • No.10:なぜGitHubが高パフォーマンスチームを作るのか

github-introduction.png

今回のゴール

  1. GitHub上で自分のリポジトリを作成できる
  2. README.mdの役割と書き方を理解する
  3. .gitignoreで不要なファイルを管理対象から外す
  4. VS Codeで開発環境を開く

リポジトリ(Repository)とは?

リポジトリとは、ファイルやその変更履歴を保存する「貯蔵庫」 のことです。
PC上の「フォルダ」と似ていますが、リポジトリは「いつ、誰が、何を変更したか」という履歴まで丸ごと保存できる点が異なります。

  • Publicリポジトリ: 全世界に公開されます(オープンソースなど)
  • Privateリポジトリ: 自分や招待したメンバーだけが見られます(仕事や個人的なメモなど)

今回は練習用なので、どちらでも構いませんが、まずは手軽なPublicで作ってみましょう。

実践:リポジトリを作成しよう

では、実際にGitHub上でリポジトリを作ってみましょう。

  1. GitHubのトップページ右上にある「+」アイコンをクリックし、「New repository」を選択します

new-repository.png

  1. 作成画面で以下の項目を入力・選択します
  • Repository name: 必須です。わかりやすい名前(例: my-first-repo)を付けましょう
  • Description: 任意ですが、「GitHub練習用のリポジトリです」などと書いておくと親切です
  • Public / Private: ここではPublicを選びます
  • Add a README file: 重要!ここにチェックを入れてください。 最初から説明ファイルを作ってくれます
  • Add .gitignore: ここではプルダウンからNodePythonなど、自分の使う言語を選ぶか、練習ならNoneのままでもOKです(後述します)

github.com_new.png

  1. 最後に「Create repository」ボタンをクリックします

これで、あなただけのリポジトリがインターネット上に誕生しました!

created-repository.png

プロジェクトの顔「README.md」の重要性

リポジトリを作成すると、自動的に README.md というファイルが表示されているはずです。これはプロジェクトの「説明書」にあたる最も重要なファイルです。

なぜREADMEが重要なのか?

良いREADMEがあるプロジェクトと、ないプロジェクトでは、「オンボーディング(新規メンバーの定着)」にかかる時間が劇的に変わります。

  • READMEがない場合: 「環境構築どうやるの?」「このツールは何?」「動かないんだけど…」と質問攻めになり、開発を始めるまでに数時間〜数日かかることもあります
  • 良いREADMEがある場合: 手順通りにコマンドを打つだけで環境が整い、数分で開発をスタートできます

何を書くべきか?

最低限、以下の要素を含めるのがベストプラクティスです。

  1. タイトル: プロジェクト名
  2. 概要: 何をするためのプロジェクトか
  3. 環境構築手順: 動作させるためのコマンド(Installation)
  4. 使い方: 基本的な利用方法(Usage)

GitHub上の鉛筆アイコンをクリックすると、ブラウザ上で直接編集できます。

edit-readme.png

編集画面が開いたら、Markdown(マークダウン)記法を使って書いてみましょう。
内容入力後、右上の「Commit changes...」ボタンをクリックします。

edit-readme2.png

変更を確定するためのダイアログが表示されるので、「Commit message」と「Extended description(任意)」に変更内容の説明を追記し、「Commit changes」ボタンをクリックします。

commit-changes.png

README.mdが変更されたことが、リポジトリのTopページで確認できます。

edited-readme.png

機密情報や不要なファイルを入れない「.gitignore」

リポジトリ作成時に「Add .gitignore」という項目がありましたが、これは何でしょうか?

開発をしていると、Gitで管理したくないファイルが出てきます。

  • OSが自動生成するファイル(WindowsのThumbs.dbやMacの.DS_Storeなど)
  • ビルドで生成される巨大なファイル
  • パスワードやAPIキーなどの機密情報

これらを誤ってGitHubにアップロードしてしまうと、リポジトリの容量が無駄に肥大化したり、セキュリティ事故(機密情報の流出)につながったりします。

.gitignoreというファイルに除外したいファイル名を書いておくと、Gitはそれらのファイルを「無視」してくれます。これがセキュリティとリポジトリの清潔さを保つ秘訣です。

.gitignoreのサンプル

# Environment variables and secrets
.env
.env.local
.env.development.local
.env.production.local
*.env

# API keys and credentials
*.pem
*.key
credentials.json
service-account.json
*-credentials.json
secrets/
certs/

# Build outputs
dist/
build/
out/

# Logs
logs/
*.log

# Temporary files
tmp/
temp/
*.tmp
*.temp
*.swp
*.swo
*~

# OS generated files
.DS_Store
Thumbs.db

# ↓言語に対応したファイルを追記

開発環境へ取り込む(Clone)

Web上でリポジトリはできましたが、実際の開発(コーディング)はエディタで行いたいですよね。
ここではVS Codeを使った方法を紹介します。

事前準備:ツールのインストール

以下の手順を進めるには、PCに「Git」と「VS Code」がインストールされている必要があります。まだの方は、公式サイトからダウンロードしてインストールしてください。

Git: Windows / Mac

Visual Studio Code: ダウンロードページ

VS CodeでローカルにCloneする

準備ができたら、「Clone(クローン)」を行いましょう。
これは、リモート(GitHub)にあるリポジトリを、手元のPC(ローカル)にコピーする作業のことです。

  1. GitHubのリポジトリページにある、緑色の「Code」ボタンをクリックします
  2. 「Local」タブが表示されるので、HTTPSのURLをコピーします(コピーアイコンをクリックすると便利です)

code.png

  1. インストールした VS Code を開きます
  2. 「コマンドパレット(Win: Ctrl + Shift + P / Mac: Cmd + Shift + P)」を開き、入力欄にGit: Cloneと入力して選択します
  3. 先ほどコピーしたURLを貼り付けてEnterキーを押すと、保存先のフォルダを聞かれるので、デスクトップやドキュメントなど好きな場所を選択します
  4. 「Would you like to open the cloned repository?(クローンしたリポジトリを開きますか?)」と聞かれたら「Open」を選択します

これで、自分のPC上にリポジトリがダウンロードされ、編集する準備が整いました!

まとめ

今回はGitHubの第一歩として、以下のことを行いました。

  1. リポジトリの作成: プロジェクトの入れ物を作りました
  2. READMEの理解: チーム開発の効率化(オンボーディング短縮)に不可欠です
  3. gitignoreの設定: 不要なデータを排除し、安全に管理するために必要です
  4. Clone: 開発を始める準備が整いました

次回は、ファイルを編集し、その変更を記録する「コミット(Commit)」について解説します。

5
1
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
5
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?