# GitHubの紹介 こんにちは、未来の開発者さん!👋 世界中の何百万ものコーダーに仲間入りする準備はできていますか?GitHubを紹介できることに本当にワクワクしています。これはプログラマーのためのソーシャルメディアプラットフォームのようなもので、ランチの写真を共有する代わりにコードを共有して一緒に素晴らしいものを作り上げるんです! 驚くべきことに、あなたのスマホのアプリ、訪れるウェブサイト、そして学ぶツールのほとんどは、GitHubのようなプラットフォームで開発者たちが協力して作り上げたものです。あなたが好きな音楽アプリ?それに貢献した人がいます。やめられないゲーム?そう、それもGitHubでのコラボレーションで作られた可能性が高いです。そして今、あなたもその素晴らしいコミュニティの一員になる方法を学ぶんです! 最初は少し難しく感じるかもしれませんね。私も最初のGitHubページを見たとき、「これって一体何のこと?」と思ったのを覚えています。でも、覚えておいてください:すべての開発者が今のあなたと同じ場所から始めました。このレッスンが終わる頃には、あなた自身のGitHubリポジトリ(クラウド上の個人的なプロジェクトショーケースのようなもの)を持ち、作業を保存し、他の人と共有し、さらには何百万人もの人が使うプロジェクトに貢献する方法を知ることができるでしょう。 一歩ずつ一緒に進んでいきましょう。急がず、プレッシャーもなしで、あなたと私、そしてこれからあなたの新しい親友になる本当にクールなツールたちと一緒に! ![GitHubの紹介](../../../../translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.ja.png) > スケッチノート提供:[Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid journey title Your GitHub Adventure Today section Setup Install Git: 4: You Create Account: 5: You First Repository: 5: You section Master Git Local Changes: 4: You Commits & Pushes: 5: You Branching: 4: You section Collaborate Fork Projects: 4: You Pull Requests: 5: You Open Source: 5: You ``` ## レクチャー前のクイズ [レクチャー前のクイズ](https://ff-quizzes.netlify.app) ## はじめに 本当にワクワクする内容に入る前に、GitHubの魔法を使う準備をしましょう!これは、傑作を作る前にアート用品を整理するようなものです。適切なツールを準備することで、すべてがスムーズになり、ずっと楽しくなります。 セットアップの各ステップを個人的に案内しますが、最初は少し難しく見えるかもしれません。でも心配しないでください!すぐに慣れます。もしすぐに理解できなくても、それは完全に普通のことです!私も最初の開発環境をセットアップしたとき、古代の象形文字を読もうとしているような気分でした。すべての開発者が今のあなたと同じ場所に立っていました。学んでいる時点で、すでに正しい道を進んでいます!🌟 このレッスンでは以下を学びます: - 自分のマシンで行った作業の追跡方法 - 他の人とプロジェクトを進める方法 - オープンソースソフトウェアに貢献する方法 ### 前提条件 GitHubの魔法を使う準備をしましょう!心配しないでください。このセットアップは一度だけ行えばよく、その後はコーディングの旅全体で使えます。 まずは基礎から始めましょう!最初にGitがすでにコンピュータにインストールされているか確認する必要があります。Gitは、コードに加えたすべての変更を記憶してくれる超賢いアシスタントのようなものです。Ctrl+Sを何度も押すよりずっと便利です(みんな経験ありますよね!)。 Gitがすでにインストールされているか確認するには、ターミナルで以下の魔法のコマンドを入力してください: `git --version` もしGitがまだインストールされていなければ、心配しないでください![Gitをダウンロード](https://git-scm.com/downloads)してインストールしてください。インストールが完了したら、Gitにあなたを紹介する必要があります: > 💡 **初回セットアップ**:これらのコマンドはGitにあなたが誰であるかを伝えます。この情報はあなたが行うすべてのコミットに添付されるので、公開しても問題ない名前とメールアドレスを選びましょう。 ```bash git config --global user.name "your-name" git config --global user.email "your-email" ``` Gitがすでに設定されているか確認するには以下を入力してください: ```bash git config --list ``` また、GitHubアカウント、コードエディタ(Visual Studio Codeなど)、そしてターミナル(またはコマンドプロンプト)を開く必要があります。 [github.com](https://github.com/)にアクセスして、まだアカウントを作成していない場合は作成するか、ログインしてプロフィールを埋めてください。 💡 **モダンなヒント**:[SSHキー](https://docs.github.com/en/authentication/connecting-to-github-with-ssh)を設定するか、[GitHub CLI](https://cli.github.com/)を使用して、パスワードなしで簡単に認証できるようにすることを検討してください。 ✅ GitHubは世界で唯一のコードリポジトリではありません。他にもありますが、GitHubが最もよく知られています。 ### 準備 ローカルマシン(ノートパソコンやPC)にコードプロジェクトのフォルダと、他の人のプロジェクトに貢献する方法を学ぶための例として使用するGitHub上の公開リポジトリが必要です。 ### コードを安全に保つ セキュリティについて少し話しましょう。でも心配しないでください、怖い話で圧倒するつもりはありません!これらのセキュリティプラクティスは、車や家に鍵をかけるようなものです。簡単な習慣が自然になり、あなたの努力を守ります。 GitHubを使う際のモダンで安全な方法を最初からお見せします。これにより、コーディングキャリア全体で役立つ良い習慣を身につけることができます。 GitHubを使用する際には、以下のセキュリティベストプラクティスを守ることが重要です: | セキュリティ領域 | ベストプラクティス | 重要性 | |------------------|------------------|------------------| | **認証** | SSHキーまたは個人アクセストークンを使用 | パスワードは安全性が低く、廃止されつつあります | | **二要素認証** | GitHubアカウントで2FAを有効化 | アカウント保護の追加層を提供します | | **リポジトリのセキュリティ** | 機密情報をコミットしない | APIキーやパスワードは公開リポジトリに含めるべきではありません | | **依存関係管理** | Dependabotを有効化して更新 | 依存関係を安全かつ最新に保ちます | > ⚠️ **重要なセキュリティリマインダー**:APIキー、パスワード、その他の機密情報をリポジトリにコミットしないでください。環境変数や`.gitignore`ファイルを使用して機密データを保護してください。 **モダンな認証セットアップ:** ```bash # Generate SSH key (modern ed25519 algorithm) ssh-keygen -t ed25519 -C "your_email@example.com" # Set up Git to use SSH git remote set-url origin git@github.com:username/repository.git ``` > 💡 **プロのヒント**:SSHキーはパスワードを繰り返し入力する必要をなくし、従来の認証方法よりも安全です。 --- ## プロのようにコードを管理する さて、ここからが本当にエキサイティングな部分です!🎉 プロのようにコードを追跡・管理する方法を学びます。正直言って、これを教えるのが大好きです。なぜなら、これが本当に人生を変えるような体験だからです。 想像してみてください:素晴らしい物語を書いていて、すべての草稿、素晴らしい編集、そして「待って、それは天才的だ!」という瞬間を記録したいと思っています。それがGitがコードに対して行うことです!すべてのキー入力、すべての変更、すべての「おっと、それで全部壊れた」瞬間を即座に元に戻せる、最も素晴らしいタイムトラベルノートブックのようなものです。 正直に言うと、最初は圧倒されるかもしれません。私も最初は「普通にファイルを保存するだけじゃダメなの?」と思いました。でもこれだけは信じてください:Gitが理解できるようになると(そして必ず理解できます!)、あなたは「どうしてこれまでこれなしでコードを書いていたんだろう?」と思うようになります。それは、歩いていたところから飛べることを発見するようなものです! ローカルにコードプロジェクトのフォルダがあり、その進捗をバージョン管理システムであるGitを使って追跡したいとします。Gitを使うことは、未来の自分へのラブレターを書くようなものだと言う人もいます。数日、数週間、数ヶ月後にコミットメッセージを読むことで、なぜその決定をしたのかを思い出したり、変更を「巻き戻し」したりすることができます。それは、良い「コミットメッセージ」を書いたときです。 ```mermaid flowchart TD A[📁 Your Project Files] --> B{Is it a Git Repository?} B -->|No| C[git init] B -->|Yes| D[Make Changes] C --> D D --> E[git add .] E --> F["git commit -m 'message'"] F --> G[git push] G --> H[🌟 Code on GitHub!] H --> I{Want to collaborate?} I -->|Yes| J[Fork & Clone] I -->|No| D J --> K[Create Branch] K --> L[Make Changes] L --> M[Pull Request] M --> N[🎉 Contributing!] style A fill:#fff59d style H fill:#c8e6c9 style N fill:#ff4081,color:#fff ``` ### タスク:初めてのリポジトリを作成しよう! > 🎯 **あなたのミッション(本当にワクワクしています!)**:初めてのGitHubリポジトリを一緒に作成しましょう!ここが終わる頃には、あなたのコードが住むインターネット上の小さなコーナーを持ち、初めての「コミット」(これは開発者の言葉で、非常に賢い方法で作業を保存することを意味します)を行います。 > > これは本当に特別な瞬間です。あなたは世界中の開発者コミュニティに正式に参加しようとしています!私も初めてリポジトリを作成したときの興奮を覚えています。「わあ、本当にこれをやっているんだ!」と思いました。 この冒険を一緒に進めましょう。一歩一歩、各部分をじっくり進めてください。急ぐ必要はありません。すべてのステップが意味を持つことを約束します。憧れるすべてのコーディングスターが、あなたと同じ場所に座って初めてのリポジトリを作成しようとしていました。なんて素晴らしいことでしょう! > 動画をチェック > > [![GitとGitHubの基本動画](https://img.youtube.com/vi/9R31OUPpxU4/0.jpg)](https://www.youtube.com/watch?v=9R31OUPpxU4) **一緒にやってみましょう:** 1. **GitHubでリポジトリを作成する**。GitHub.comにアクセスして、明るい緑色の**New**ボタン(または右上の**+**記号)を探してください。それをクリックして**New repository**を選択します。 以下を行います: 1. リポジトリに名前を付けます – あなたにとって意味のある名前にしましょう! 1. 必要に応じて説明を追加します(これにより、他の人がプロジェクトの内容を理解しやすくなります) 1. 公開(誰でも見られる)か非公開(自分だけのもの)かを選択します 1. READMEファイルを追加するチェックボックスをオンにすることをお勧めします – これはプロジェクトの表紙のようなものです 1. **Create repository**をクリックしてお祝いしましょう – 初めてのリポジトリを作成しました!🎉 2. **プロジェクトフォルダに移動する**。次にターミナルを開きましょう(見た目ほど怖くありません!)。コンピュータにプロジェクトファイルの場所を教える必要があります。以下のコマンドを入力してください: ```bash cd [name of your folder] ``` **ここでやっていること:** - コンピュータに「プロジェクトフォルダに移動して」と伝えています - これはデスクトップ上の特定のフォルダを開くようなものですが、テキストコマンドで行っています - `[name of your folder]`を実際のプロジェクトフォルダ名に置き換えてください 3. **フォルダをGitリポジトリに変える**。ここで魔法が起こります!以下を入力してください: ```bash git init ``` **ここで起こったこと(かなりクールなこと!):** - Gitがプロジェクト内に隠し`.git`フォルダを作成しました – 見えませんが存在しています! - 通常のフォルダが「リポジトリ」に変わり、行ったすべての変更を追跡できるようになりました - フォルダにすべてを記憶するスーパーパワーを与えたようなものです 4. **現在の状況を確認する**。Gitがプロジェクトについてどう思っているか見てみましょう: ```bash git status ``` **Gitが教えてくれることを理解する:** 以下のようなものが表示されるかもしれません: ```output Changes not staged for commit: (use "git add ..." to update what will be committed) (use "git restore ..." to discard changes in working directory) modified: file.txt modified: file2.txt ``` **慌てないでください!これはこういう意味です:** - **赤色**のファイルは変更があるがまだ保存する準備ができていないファイルです - **緑色**のファイル(表示される場合)は保存する準備ができているファイルです - Gitは次に何をすればいいかを正確に教えてくれています > 💡 **プロのヒント**:`git status`コマンドはあなたの親友です!何が起こっているのか混乱したときに使ってください。Gitに「今の状況はどう?」と尋ねるようなものです。 5. **ファイルを保存する準備をする**(これを「ステージング」と呼びます): ```bash git add . ``` **ここでやったこと:** - Gitに「このフォルダ内のすべてのファイルを次の保存に含めたい」と伝えました - `.`は「このフォルダ内のすべて」を意味します - これでファイルが「ステージング」され、次のステップの準備が整いました **もっと選択的になりたい場合:** 特定のファイルだけを追加することもできます: ```bash git add [file or folder name] ``` **なぜこれをしたいのか:** - 関連する変更をまとめて保存したい場合があります - 作業を論理的な塊に整理するのに役立ちます - 何がいつ変更されたのかを理解しやすくなります **気が変わった場合:** 心配しないでください!以下のようにしてファイルをステージから外すことができます: ```bash # Unstage everything git reset # Unstage just one file git reset [file name] ``` 心配しないでください – これは作業を削除するわけではなく、「保存準備完了」の状態から外すだけです。 6. **作業を永久に保存する**(初めてのコミットを作成!): ```bash git commit -m "first commit" ``` **🎉 おめでとうございます!初めてのコミットを作成しました!** **ここで起こったこと:** - Gitがこの瞬間のすべてのステージングされたファイルの「スナップショット」を撮りました - コミットメッセージ「first commit」はこの保存ポイントが何であるかを説明しています - GitがこのスナップショットにユニークなIDを付けたので、いつでも後で見つけることができます - プロジェクトの履歴を追跡し始めました! > 💡 **次回のコミットメッセージ**:次回のコミットでは、もっと具体的にしましょう!「updated stuff」ではなく、「Add contact form to homepage」や「Fix navigation menu bug」のように。未来の自分が感謝します! 7. **ローカルプロジェクトをGitHubに接続する**。現在、プロジェクトはあなたのコンピュータにしか存在していません。これをGitHubリポジトリに接続して、世界と共有しましょう! まず - ローカルプロジェクトとGitHubリポジトリの接続を作成しました - "Origin"はGitHubリポジトリのニックネームのようなものです。電話帳に連絡先を追加する感覚です - これでローカルGitはコードを送る場所を知っており、共有する準備が整いました 💡 **簡単な方法**: GitHub CLIをインストールしている場合、これを1つのコマンドで実行できます: ```bash gh repo create my-repo --public --push --source=. ``` 8. **コードをGitHubに送る**(いよいよ大事な瞬間!): ```bash git push -u origin main ``` **🚀 これでコードをGitHubにアップロードします!** **何が起きているか:** - コミットがコンピュータからGitHubへ移動しています - `-u`フラグは永続的な接続を設定し、次回以降のプッシュが簡単になります - "main"は主要なブランチの名前です(メインフォルダのようなもの) - これ以降、次回のアップロードでは`git push`だけで済みます! 💡 **注意**: ブランチ名が"master"など別の名前の場合、その名前を使用してください。`git branch --show-current`で確認できます。 9. **新しい日常のコーディングリズム**(これがクセになります!): これからはプロジェクトに変更を加えるたびに、以下の簡単な3ステップを繰り返します: ```bash git add . git commit -m "describe what you changed" git push ``` **これがコーディングの心拍リズムになります:** - コードに素晴らしい変更を加える ✨ - `git add`でステージングする("Gitさん、この変更に注目して!") - `git commit`と説明的なメッセージで保存する(未来の自分が感謝します!) - `git push`で世界と共有する 🚀 - 繰り返し – 本当にこれが自然になります! このワークフローが好きなのは、ビデオゲームのセーブポイントを複数持つような感覚だからです。気に入った変更をしたらコミット!リスクを試したい?問題ありません – もしうまくいかなくても、最後のコミットに戻ることができます! > 💡 **ヒント**: `.gitignore`ファイルを採用して、GitHubに追跡したくないファイルが表示されないようにすることを検討してください。例えば、同じフォルダに保存しているけれど公開リポジトリには不要なメモファイルなどです。`.gitignore`ファイルのテンプレートは[.gitignore templates](https://github.com/github/gitignore)で見つけるか、[gitignore.io](https://www.toptal.com/developers/gitignore)を使って作成できます。 ### 🧠 **初めてのリポジトリチェックイン: どんな感じでしたか?** **少し時間を取って祝福し、振り返りましょう:** - 初めてGitHubにコードが表示されたとき、どんな気持ちでしたか? - どのステップが一番混乱し、どれが意外と簡単でしたか? - `git add`、`git commit`、`git push`の違いを自分の言葉で説明できますか? ```mermaid stateDiagram-v2 [*] --> LocalFiles: Create project LocalFiles --> Staged: git add . Staged --> Committed: git commit Committed --> GitHub: git push GitHub --> [*]: Success! 🎉 note right of Staged Files ready to save end note note right of Committed Snapshot created end note ``` > **覚えておいてください**: 経験豊富な開発者でもコマンドを正確に覚えていないことがあります。このワークフローを筋肉記憶にするには練習が必要です – あなたは素晴らしい進歩をしています! #### モダンなGitワークフロー 以下のモダンなプラクティスを採用することを検討してください: - **Conventional Commits**: `feat:`、`fix:`、`docs:`などの標準化されたコミットメッセージ形式を使用します。[conventionalcommits.org](https://www.conventionalcommits.org/)で詳細を学べます - **Atomic commits**: 各コミットを単一の論理的変更として表現します - **頻繁なコミット**: 大きくて頻度の少ないコミットよりも、説明的なメッセージを伴う頻繁なコミットを行います #### コミットメッセージ 優れたGitコミットの件名は次の文を完成させます: 適用されると、このコミットは<件名をここに記入> 件名では命令形の現在形を使用します。"change"ではなく"changed"や"changes"ではありません。 件名と同様に、本文(オプション)でも命令形の現在形を使用します。本文には変更の動機を含め、これを以前の動作と対比させます。`どうやって`ではなく、`なぜ`を説明します。 ✅ GitHubを少し見て回りましょう。素晴らしいコミットメッセージを見つけられますか?非常に簡素なものを見つけられますか?コミットメッセージで伝えるべき最も重要で有用な情報は何だと思いますか? ## 他の人と一緒に作業する(楽しい部分!) これからGitHubが本当に魔法のようになる部分に進みます!🪄 自分のコードを管理するスキルを習得しましたが、今度は私が最も好きな部分 – 世界中の素晴らしい人々とコラボレーションすることに飛び込みます。 想像してみてください: 明日目を覚ますと、東京の誰かがあなたのコードを改善している。そしてベルリンの誰かがあなたが悩んでいたバグを修正してくれる。午後にはサンパウロの開発者があなたが思いつかなかった機能を追加してくれる。それはSFではありません – それはGitHubの世界では普通の火曜日です! 私が本当に興奮するのは、これから学ぶコラボレーションスキルが、Google、Microsoft、そしてあなたが好きなスタートアップのチームが毎日使っているまさに同じワークフローだということです。単なる便利なツールを学ぶのではなく、ソフトウェアの世界全体が協力するための秘密の言語を学んでいるのです。 本当に、初めてプルリクエストがマージされる瞬間の興奮を経験すれば、なぜ開発者がオープンソースに情熱を注ぐのかが理解できるでしょう。それは世界最大で最もクリエイティブなチームプロジェクトの一員になるようなものです! > 動画をチェック > > [![GitとGitHubの基本動画](https://img.youtube.com/vi/bFCM-PC3cu8/0.jpg)](https://www.youtube.com/watch?v=bFCM-PC3cu8) GitHubにコードを置く主な理由は、他の開発者とコラボレーションを可能にすることでした。 ```mermaid flowchart LR A[🔍 Find Project] --> B[🍴 Fork Repository] B --> C[📥 Clone to Local] C --> D[🌿 Create Branch] D --> E[✏️ Make Changes] E --> F[💾 Commit Changes] F --> G[📤 Push Branch] G --> H[🔄 Create Pull Request] H --> I{Maintainer Review} I -->|✅ Approved| J[🎉 Merge!] I -->|❓ Changes Requested| K[📝 Make Updates] K --> F J --> L[🧹 Clean Up Branches] style A fill:#e3f2fd style J fill:#e8f5e8 style L fill:#fff3e0 ``` リポジトリで`Insights > Community`に移動して、プロジェクトが推奨されるコミュニティ標準とどのように比較されるかを確認してください。 リポジトリをプロフェッショナルで歓迎的に見せたいですか?リポジトリに移動して`Insights > Community`をクリックしてください。この便利な機能は、GitHubコミュニティが「良いリポジトリのプラクティス」と考えるものとプロジェクトを比較してくれます。 > 🎯 **プロジェクトを輝かせる**: 良く整理されたリポジトリと良いドキュメントは、清潔で歓迎的な店舗を持つようなものです。それはあなたが自分の仕事を大切にしていることを示し、他の人が貢献したいと思わせます! **素晴らしいリポジトリを作るための要素:** | 追加するもの | なぜ重要か | あなたにとってのメリット | |-------------|-------------------|---------------------| | **説明** | 第一印象が重要! | プロジェクトが何をするかをすぐに理解できる | | **README** | プロジェクトの表紙 | 新しい訪問者にとっての親切なガイド | | **貢献ガイドライン** | 助けを歓迎していることを示す | 人々がどのように助けられるかを正確に理解できる | | **行動規範** | 友好的な空間を作る | 誰もが参加しやすいと感じる | | **ライセンス** | 法的な明確さ | 他の人がコードをどのように使用できるかを理解できる | | **セキュリティポリシー** | 責任感を示す | プロフェッショナルなプラクティスを示す | > 💡 **プロのヒント**: GitHubはこれらのファイルのテンプレートを提供しています。新しいリポジトリを作成する際に、これらのファイルを自動生成するチェックボックスを確認してください。 **モダンなGitHub機能を探索する:** 🤖 **自動化 & CI/CD:** - **GitHub Actions**で自動テストとデプロイ - **Dependabot**で依存関係の自動更新 💬 **コミュニティ & プロジェクト管理:** - **GitHub Discussions**で問題以外のコミュニティ会話 - **GitHub Projects**でカンバンスタイルのプロジェクト管理 - **ブランチ保護ルール**でコード品質基準を強制 これらのリソースは新しいチームメンバーのオンボーディングに役立ちます。そして、これらは通常、新しい貢献者がコードを見る前にプロジェクトが自分の時間を費やす価値があるかどうかを判断するために見るものです。 ✅ READMEファイルは準備に時間がかかるものの、忙しいメンテナーによってしばしば無視されます。特に説明的なREADMEの例を見つけられますか?注: [良いREADMEを作成するためのツール](https://www.makeareadme.com/)もありますので試してみてください。 ### タスク: コードをマージする 貢献ドキュメントは人々がプロジェクトに貢献するのを助けます。それはどのような貢献を求めているか、そしてプロセスがどのように機能するかを説明します。貢献者はGitHubのリポジトリに貢献するために一連のステップを経る必要があります: 1. **リポジトリをフォークする**: 貢献者にプロジェクトをフォークするよう求めることが一般的です。フォークとは、リポジトリの複製を自分のGitHubプロフィールに作成することを意味します。 1. **クローン**: そこからプロジェクトをローカルマシンにクローンします。 1. **ブランチを作成する**: 貢献者に作業用のブランチを作成するよう求めます。 1. **変更を1つの領域に集中させる**: 貢献者に1度に1つのことに集中して貢献するよう求めます。そうすることで、作業をマージする可能性が高くなります。例えば、バグ修正、新機能の追加、いくつかのテストの更新を行った場合、3つのうち2つまたは1つしか実装できない場合を想像してください。 ✅ ブランチが特に重要になるコードの作成と出荷の状況を想像してみてください。どのようなユースケースが思い浮かびますか? > 注: 世界を変えたいなら、自分の作業にもブランチを作成してください。行ったコミットは現在「チェックアウト」しているブランチに行われます。`git status`を使用してそのブランチを確認してください。 貢献者のワークフローを見てみましょう。貢献者がすでにリポジトリをフォークし、クローンしていると仮定します。これでローカルマシンで作業可能なGitリポジトリが準備されています: 1. **ブランチを作成する**: `git branch`コマンドを使用して、貢献する変更を含むブランチを作成します: ```bash git branch [branch-name] ``` > 💡 **モダンなアプローチ**: 新しいブランチを作成して切り替えるのを1つのコマンドで行うこともできます: ```bash git switch -c [branch-name] ``` 1. **作業ブランチに切り替える**: 指定したブランチに切り替え、`git switch`で作業ディレクトリを更新します: ```bash git switch [branch-name] ``` > 💡 **モダンな注意**: `git switch`はブランチを変更する際の`git checkout`のモダンな代替手段です。初心者にとってより明確で安全です。 1. **作業を行う**: この時点で変更を加えます。以下のコマンドでGitに知らせるのを忘れないでください: ```bash git add . git commit -m "my changes" ``` > ⚠️ **コミットメッセージの品質**: コミットに良い名前を付けることを忘れないでください。自分自身とリポジトリのメンテナーのために具体的に何を変更したかを記載してください! 1. **作業を`main`ブランチと統合する**: 作業が完了したら、`main`ブランチと作業を統合したいと思うでしょう。その間に`main`ブランチが変更されている可能性があるので、以下のコマンドで最新の状態に更新してください: ```bash git switch main git pull ``` この時点で、Gitが変更を簡単に統合できない状況(コンフリクト)が作業ブランチで発生する可能性があります。そのため、以下のコマンドを実行してください: ```bash git switch [branch_name] git merge main ``` `git merge main`コマンドは`main`からのすべての変更をブランチに取り込みます。うまくいけばそのまま続行できます。もしそうでなければ、VS CodeがGitが混乱している箇所を教えてくれるので、影響を受けたファイルを変更して最も正確な内容を記載してください。 💡 **モダンな代替手段**: よりクリーンな履歴のために`git rebase`を検討してください: ```bash git rebase main ``` これにより、最新の`main`ブランチの上にコミットを再生し、線形の履歴を作成します。 1. **作業をGitHubに送る**: 作業をGitHubに送ることは2つのことを意味します。ブランチをリポジトリにプッシュし、その後PR(プルリクエスト)を開くことです。 ```bash git push --set-upstream origin [branch-name] ``` 上記のコマンドはフォークしたリポジトリにブランチを作成します。 ### 🤝 **コラボレーションスキルチェック: 他の人と作業する準備はできていますか?** **コラボレーションについての感触を確認しましょう:** - フォークとプルリクエストの概念は理解できましたか? - ブランチを使った作業で練習したいことは何ですか? - 他の人のプロジェクトに貢献することにどれくらい自信がありますか? ```mermaid mindmap root((Git Collaboration)) Branching Feature branches Bug fix branches Experimental work Pull Requests Code review Discussion Testing Best Practices Clear commit messages Small focused changes Good documentation ``` > **自信を持ってください**: あなたが尊敬するすべての開発者は、最初のプルリクエストに緊張していたことがあります。GitHubコミュニティは初心者に非常に歓迎的です! 1. **PRを開く**: 次にPRを開きます。フォークしたリポジトリにGitHubで移動します。GitHubで新しいPRを作成するかどうかを尋ねる表示があり、それをクリックすると、コミットメッセージのタイトルを変更したり、より適切な説明を追加したりできるインターフェースに移動します。これでフォークしたリポジトリのメンテナーがこのPRを確認し、_うまくいけば_感謝してPRをマージしてくれるでしょう。これであなたは貢献者です、やったね :) 💡 **モダンなヒント**: GitHub CLIを使用してPRを作成する 1. **クリーンアップ**。PRを正常にマージした後にクリーンアップすることは良い習慣とされています。ローカルブランチとGitHubにプッシュしたブランチの両方をクリーンアップしたいですね。まず、以下のコマンドでローカルブランチを削除しましょう: ```bash git branch -d [branch-name] ``` 次に、フォークしたリポジトリのGitHubページに移動し、プッシュしたリモートブランチを削除してください。 `Pull request`という言葉は少し変に感じるかもしれません。実際にはプロジェクトに変更をプッシュしたいわけですが、メンテナー(プロジェクトの所有者)やコアチームがその変更をプロジェクトの「main」ブランチにマージする前に検討する必要があります。つまり、メンテナーに変更の決定をリクエストしているわけです。 プルリクエストは、レビュー、コメント、統合テストなどを通じてブランチに導入された差分を比較し議論する場です。良いプルリクエストはコミットメッセージとほぼ同じルールに従います。例えば、作業が問題を解決する場合、問題トラッカーの問題への参照を追加できます。これは`#`の後に問題番号を付けることで行います。例:`#97` 🤞すべてのチェックが通り、プロジェクトの所有者が変更をプロジェクトにマージしてくれることを祈りましょう🤞 現在のローカル作業ブランチをGitHub上の対応するリモートブランチの新しいコミットで更新しましょう: `git pull` ## オープンソースへの貢献(あなたの影響を与えるチャンス!) 何か本当に驚くべきことを話す準備はできていますか?🤯 オープンソースプロジェクトへの貢献について話しましょう。これを共有することを考えるだけで鳥肌が立ちます! これは本当に特別な何かの一部になるチャンスです。毎日何百万人もの開発者が使うツールを改善したり、友達が愛用するアプリのバグを修正したりすることを想像してください。それはただの夢ではありません。それがオープンソースへの貢献のすべてです! これを考えるたびにゾクゾクする理由はこれです:あなたが学んでいるすべてのツール—コードエディタ、これから探求するフレームワーク、さらにはこれを読んでいるブラウザ—は、最初の貢献をした誰かから始まりました。あなたのお気に入りのVS Code拡張機能を作ったあの素晴らしい開発者も、かつては震える手で「プルリクエストを作成」をクリックしていた初心者でした。そして、あなたもまさにその一歩を踏み出そうとしているのです。 そして最も美しい部分はこれです:オープンソースコミュニティはインターネット最大のグループハグのようなものです。ほとんどのプロジェクトは新人を積極的に探しており、「good first issue」とタグ付けされた問題を持っています。これはまさにあなたのような人のためのものです!メンテナーは新しい貢献者を見ると本当に興奮します。なぜなら彼ら自身の最初の一歩を思い出すからです。 ```mermaid flowchart TD A[🔍 Explore GitHub] --> B[🏷️ Find "good first issue"] B --> C[📖 Read Contributing Guidelines] C --> D[🍴 Fork Repository] D --> E[💻 Set Up Local Environment] E --> F[🌿 Create Feature Branch] F --> G[✨ Make Your Contribution] G --> H[🧪 Test Your Changes] H --> I[📝 Write Clear Commit] I --> J[📤 Push & Create PR] J --> K[💬 Engage with Feedback] K --> L[🎉 Merged! You're a Contributor!] L --> M[🌟 Find Next Issue] style A fill:#e1f5fe style L fill:#c8e6c9 style M fill:#fff59d ``` ここで学んでいるのはただコードを書くことではありません。デジタル世界を少しでも良くする方法を毎日考えるグローバルなビルダーの家族に参加する準備をしているのです。クラブへようこそ!🌟 まず、GitHubで興味のあるリポジトリ(**repo**)を見つけて、変更を加えたいと思うものを選びましょう。その内容を自分のマシンにコピーしたいですね。 ✅ '初心者向け'リポジトリを見つける良い方法は、[タグ 'good-first-issue' で検索すること](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/)です。 ![リポジトリをローカルにコピー](../../../../translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.ja.png) コードをコピーする方法はいくつかあります。一つの方法は、HTTPS、SSH、またはGitHub CLI(コマンドラインインターフェース)を使用してリポジトリの内容を「クローン」することです。 ターミナルを開いて以下のようにリポジトリをクローンします: ```bash # Using HTTPS git clone https://github.com/ProjectURL # Using SSH (requires SSH key setup) git clone git@github.com:username/repository.git # Using GitHub CLI gh repo clone username/repository ``` プロジェクトに取り組むには、正しいフォルダに移動します: `cd ProjectURL` また、以下を使用してプロジェクト全体を開くこともできます: - **[GitHub Codespaces](https://github.com/features/codespaces)** - ブラウザ内でVS Codeを使用できるGitHubのクラウド開発環境 - **[GitHub Desktop](https://desktop.github.com/)** - Git操作用のGUIアプリケーション - **[GitHub.dev](https://github.dev)** - 任意のGitHubリポジトリで`.`キーを押すとブラウザ内でVS Codeが開きます - **VS Code** - GitHub Pull Requests拡張機能付き 最後に、コードを圧縮フォルダとしてダウンロードすることもできます。 ### GitHubについてのいくつかの興味深いこと GitHub上の任意の公開リポジトリをスター、ウォッチ、または「フォーク」することができます。スターを付けたリポジトリは右上のドロップダウンメニューで見つけることができます。これはコードのブックマークのようなものです。 プロジェクトには問題トラッカーがあり、ほとんどの場合GitHubの「Issues」タブにあります(特に他に示されていない場合)。ここでプロジェクトに関連する問題について議論します。また、Pull Requestsタブでは進行中の変更について議論しレビューします。 プロジェクトにはフォーラム、メーリングリスト、Slack、Discord、IRCなどのチャットチャンネルで議論が行われることもあります。 🔧 **モダンなGitHub機能**: - **GitHub Discussions** - コミュニティ会話のための組み込みフォーラム - **GitHub Sponsors** - メンテナーを金銭的に支援する - **Securityタブ** - 脆弱性レポートとセキュリティ勧告 - **Actionsタブ** - 自動化ワークフローとCI/CDパイプラインを見る - **Insightsタブ** - コントリビューター、コミット、プロジェクトの健康状態に関する分析 - **Projectsタブ** - GitHubの組み込みプロジェクト管理ツール ✅ 新しいGitHubリポジトリを見て、設定を編集したり、情報を追加したり、プロジェクト(例えばカンバンボード)を作成したり、GitHub Actionsを設定して自動化を試してみてください。できることはたくさんあります! --- ## 🚀 チャレンジ さて、あなたの新しいGitHubスーパーパワーを試す時が来ました!🚀 これを実行すると、すべてが最も満足のいく方法でクリックするようになります: 友達(または「このコンピュータのこと何してるの?」といつも聞いてくる家族)を捕まえて、一緒にコラボレーションコーディングの冒険に出かけましょう!ここが本当の魔法が起こる場所です。プロジェクトを作成し、彼らにフォークさせ、ブランチを作成し、プロのように変更をマージしましょう。 正直に言うと、笑う瞬間があるかもしれません(特に同じ行を変更しようとしたとき)、混乱して頭をかくかもしれませんが、すべての学びが価値あるものになる素晴らしい「なるほど!」の瞬間を確実に得られるでしょう。さらに、誰かと最初の成功したマージを共有することには特別な何かがあります。それは、どれだけ進歩したかを祝う小さな瞬間のようなものです! まだコーディング仲間がいない?全く問題ありません!GitHubコミュニティには新しい人を歓迎する素晴らしい人々がたくさんいます。「good first issue」ラベルの付いたリポジトリを探してみてください。それは基本的に「初心者の皆さん、一緒に学びましょう!」と言っているようなものです。素晴らしいですね! ## 講義後のクイズ [講義後のクイズ](https://ff-quizzes.netlify.app/web/en/) ## 復習と学び続ける ふぅ!🎉 見てください – GitHubの基本を絶対的なチャンピオンのように征服しました!もし今頭が少しいっぱいになっていると感じたら、それは完全に正常で、正直に言うと良い兆候です。これは私が始めたときに慣れるのに数週間かかったツールを学んだばかりということです。 GitとGitHubは非常に強力です(本当に強力です)、そして私が知っているすべての開発者—今では魔法使いのように見える人たちも含めて—は、それがすべてクリックするまで練習し、つまずきながら学びました。このレッスンを終えたという事実は、開発者のツールキットで最も重要なツールを習得する道をすでに歩んでいることを意味します。 練習してさらに素晴らしくなるための絶対に素晴らしいリソースをいくつか紹介します: - [オープンソースソフトウェアへの貢献ガイド](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) – 影響を与えるためのロードマップ - [Gitチートシート](https://training.github.com/downloads/github-git-cheat-sheet/) – クイックリファレンス用にこれを手元に置いておきましょう! そして覚えておいてください:練習は進歩を生みます、完璧ではありません!GitとGitHubを使えば使うほど、自然に使えるようになります。GitHubは安全な環境で練習できる素晴らしいインタラクティブコースを作成しています: - [GitHubの紹介](https://github.com/skills/introduction-to-github) - [Markdownを使ったコミュニケーション](https://github.com/skills/communicate-using-markdown) - [GitHub Pages](https://github.com/skills/github-pages) - [マージコンフリクトの管理](https://github.com/skills/resolve-merge-conflicts) **冒険心があるなら、これらのモダンツールをチェックしてください:** - [GitHub CLIドキュメント](https://cli.github.com/manual/) – コマンドラインウィザードのように感じたいときに - [GitHub Codespacesドキュメント](https://docs.github.com/en/codespaces) – クラウドでコードを書く! - [GitHub Actionsドキュメント](https://docs.github.com/en/actions) – すべてを自動化 - [Gitのベストプラクティス](https://www.atlassian.com/git/tutorials/comparing-workflows) – ワークフローをレベルアップ ## GitHub Copilotエージェントチャレンジ 🚀 エージェントモードを使用して以下のチャレンジを完了してください: **説明:** このレッスンで学んだGitHubワークフローを完全に示すコラボレーションウェブ開発プロジェクトを作成してください。このチャレンジは、リポジトリ作成、コラボレーション機能、モダンなGitワークフローを実際のシナリオで練習するのに役立ちます。 **プロンプト:** シンプルな「Web開発リソース」プロジェクトのための新しい公開GitHubリポジトリを作成してください。リポジトリには、カテゴリ(HTML、CSS、JavaScriptなど)ごとに整理された便利なウェブ開発ツールとリソースをリストした構造化されたREADME.mdファイルを含めてください。ライセンス、貢献ガイドライン、行動規範を含む適切なコミュニティ標準でリポジトリを設定してください。CSSリソースを追加するためのブランチとJavaScriptリソースを追加するためのブランチを少なくとも2つ作成してください。それぞれのブランチに説明的なコミットメッセージを付けてコミットを行い、変更をmainにマージするためのプルリクエストを作成してください。Issues、DiscussionsなどのGitHub機能を有効にし、基本的なGitHub Actionsワークフローを設定して自動チェックを行いましょう。 ## 課題 あなたのミッション、もし受け入れるなら:GitHub Skillsの[GitHubの紹介](https://github.com/skills/introduction-to-github)コースを完了してください。このインタラクティブコースでは、学んだことを安全でガイド付きの環境で練習できます。さらに、完了すると素敵なバッジがもらえます!🏅 **さらに挑戦する準備ができていますか?** - GitHubアカウントのSSH認証を設定する(もうパスワードは不要!) - 日常のGit操作にGitHub CLIを試してみる - GitHub Actionsワークフローを持つリポジトリを作成する - このリポジトリをクラウドベースのエディタで開いてGitHub Codespacesを探索する --- ## 🚀 GitHubマスタリータイムライン ### ⚡ **次の5分でできること** - [ ] このリポジトリと興味のある他の3つのプロジェクトにスターを付ける - [ ] GitHubアカウントで二要素認証を設定する - [ ] 最初のリポジトリにシンプルなREADMEを作成する - [ ] あなたがインスパイアされる開発者5人をフォローする ### 🎯 **この1時間で達成できること** - [ ] 講義後のクイズを完了し、GitHubの旅を振り返る - [ ] SSHキーを設定してパスワードなしでGitHub認証を行う - [ ] 素晴らしいコミットメッセージで最初の意味のあるコミットを作成する - [ ] GitHubの「Explore」タブを探索してトレンドプロジェクトを発見する - [ ] リポジトリをフォークして小さな変更を加える練習をする ### 📅 **1週間のGitHub冒険** - [ ] GitHub Skillsコースを完了する(GitHubの紹介、Markdown) - [ ] オープンソースプロジェクトへの最初のプルリクエストを作成する - [ ] GitHub Pagesサイトを設定して自分の作品を紹介する - [ ] 興味のあるプロジェクトのGitHub Discussionsに参加する - [ ] 適切なコミュニティ標準(README、ライセンスなど)を備えたリポジトリを作成する - [ ] クラウドベースの開発のためにGitHub Codespacesを試す ### 🌟 **1ヶ月間の変革** - [ ] 3つの異なるオープンソースプロジェクトに貢献する - [ ] GitHubの新しいユーザーをメンターする(恩返し!) - [ ] GitHub Actionsで自動化ワークフローを設定する - [ ] GitHubの貢献を紹介するポートフォリオを作成する - [ ] Hacktoberfestや同様のコミュニティイベントに参加する - [ ] 他の人が貢献する自分のプロジェクトのメンテナーになる ### 🎓 **最終GitHubマスタリーチェックイン** **これまでの進歩を祝う:** - GitHubを使うことについてお気に入りのことは何ですか? - 最も興奮するコラボレーション機能は何ですか? - オープンソースに貢献することについてどれくらい自信がありますか? - 最初に貢献したいプロジェクトは何ですか? ```mermaid journey title Your GitHub Confidence Journey section Today Nervous: 3: You Curious: 4: You Excited: 5: You section This Week Practicing: 4: You Contributing: 5: You Connecting: 5: You section Next Month Collaborating: 5: You Leading: 5: You Inspiring Others: 5: You ``` > 🌍 **グローバルな開発者コミュニティへようこそ!** あなたは今、世界中の何百万もの開発者とコラボレーションするためのツールを手に入れました。最初の --- **免責事項**: この文書はAI翻訳サービス[Co-op Translator](https://github.com/Azure/co-op-translator)を使用して翻訳されています。正確性を追求しておりますが、自動翻訳には誤りや不正確な部分が含まれる可能性があります。元の言語で記載された文書が正式な情報源とみなされるべきです。重要な情報については、専門の人間による翻訳を推奨します。この翻訳の使用に起因する誤解や誤認について、当社は責任を負いません。