diff --git a/beginners/github-beginner-guide.md b/beginners/github-beginner-guide.md new file mode 100644 index 0000000..f893a70 --- /dev/null +++ b/beginners/github-beginner-guide.md @@ -0,0 +1,272 @@ +--- +layout: default +title: "はじめてのGitHub - 超初心者向けガイド" +description: "GitHubを今から始める人のための、やさしい入門ガイド" +--- + +# 🌱 はじめてのGitHub - 超初心者向けガイド + +プログラミングの知識ゼロでも大丈夫!GitHubの使い方を、一番簡単なところから説明します。 + +--- + +## 📝 このガイドで学べること + +- GitHubって何? +- アカウントの作り方 +- 最初のプロジェクト作成 +- ファイルの保存と管理 +- 他の人と協力する方法 + +--- + +## 🤔 そもそもGitHubって何? + +### 簡単に言うと... +**GitHubは「ファイルを保存して、みんなで共有できるサービス」です。** + +### 例えば、こんな使い方ができます +- 📝 **文書管理** - マニュアルや資料を管理 +- 💻 **コード管理** - プログラムを保存 +- 🎨 **デザイン管理** - 画像やデザインファイル +- 📊 **データ管理** - CSVやExcelファイル +- 📚 **学習記録** - 勉強したことをまとめる + +### GitHubの3つの特徴 +1. **履歴が残る** - いつ、誰が、何を変更したか全部記録 +2. **元に戻せる** - 失敗しても前の状態に戻せる +3. **みんなで使える** - チームで同じファイルを編集できる + +--- + +## 🚀 STEP 1: アカウントを作ろう + +### 1. GitHubにアクセス +[https://github.com](https://github.com) を開く + +### 2. Sign up(サインアップ)をクリック +右上の「Sign up」ボタンをクリック + +### 3. 必要な情報を入力 +- **Username(ユーザー名)**: 好きな名前(英数字) +- **Email(メールアドレス)**: 普段使うメール +- **Password(パスワード)**: 8文字以上 + +### 4. 検証を完了 +- パズルを解く(ロボットじゃないことを証明) +- メールに届いた数字を入力 + +**🎉 完成!これでGitHubが使えます!** + +--- + +## 📁 STEP 2: 最初のリポジトリを作ろう + +### リポジトリって何? +**リポジトリ = プロジェクトの保存場所** +(フォルダみたいなもの) + +### 作り方 +1. **右上の「+」ボタン** → **「New repository」** + +2. **必要事項を入力** + - **Repository name**: プロジェクトの名前 + - 例:`my-first-project`、`hello-world` + - **Description**: プロジェクトの説明(省略OK) + - 例:「GitHubの練習用プロジェクト」 + - **Public/Private**: 公開設定 + - **Public**: みんなに公開(無料) + - **Private**: 自分だけ(無料) + +3. **初期設定**(チェックを入れる) + - ✅ **Add a README file**: 説明ファイルを作る + - ✅ **Add .gitignore**: 無視するファイルの設定 + - ✅ **Choose a license**: ライセンス(後で考えてOK) + +4. **「Create repository」をクリック** + +**🎊 リポジトリ完成!** + +--- + +## 📝 STEP 3: ファイルを追加してみよう + +### 方法1: ブラウザで直接作成 +1. **「Add file」** → **「Create new file」** +2. **ファイル名を入力** + - 例:`memo.txt`、`diary.md` +3. **内容を入力** + ``` + 今日のメモ + + GitHubを始めました! + 思ったより簡単でした。 + ``` +4. **下の方にある「Commit new file」をクリック** + +### 方法2: ファイルをアップロード +1. **「Add file」** → **「Upload files」** +2. **ファイルをドラッグ&ドロップ** +3. **「Commit changes」をクリック** + +### 💡 Commit(コミット)って何? +**Commit = 変更を保存すること** +- セーブみたいなもの +- 変更内容にメッセージを付けられる +- 後で見返しやすい + +--- + +## ✏️ STEP 4: ファイルを編集しよう + +### 編集の手順 +1. **編集したいファイルをクリック** +2. **鉛筆アイコン(✏️)をクリック** +3. **内容を変更** +4. **下にスクロールして「Commit changes」** + - **メッセージを入力**(例:「日付を追加」) + - **「Commit changes」をクリック** + +### 変更履歴を見る +1. **ファイル名の横の「History」をクリック** +2. **いつ、何を変更したか一覧で見れる** +3. **各変更をクリックすると詳細が見れる** + +--- + +## 👥 STEP 5: 他の人と協力しよう(基本編) + +### Issues(イシュー)を使った連絡 +**Issues = 連絡帳・TODO リスト** + +#### 作り方 +1. **「Issues」タブをクリック** +2. **「New issue」をクリック** +3. **タイトルと内容を入力** + - タイトル例:「README に使い方を追加してください」 + - 内容例:「初めての人向けの説明を追加したいです」 +4. **「Submit new issue」をクリック** + +#### 返信の仕方 +1. **Issueを開く** +2. **下のコメント欄に返信を書く** +3. **「Comment」をクリック** + +### 他の人のプロジェクトを見る +1. **検索バーにキーワードを入力** + - 例:「recipe」「todo」「diary」 +2. **気になるプロジェクトをクリック** +3. **⭐Star を付けてお気に入り登録** + +--- + +## 💡 知っておくと便利な機能 + +### 📝 README.md(リードミー) +- **プロジェクトの説明書** +- **最初に表示される** +- **Markdown(マークダウン)で書ける** + +#### 簡単なMarkdown記法 +```markdown +# 大見出し +## 中見出し +### 小見出し + +- 箇条書き1 +- 箇条書き2 + +**太字** +*斜体* + +[リンク](https://github.com) +``` + +### 🔒 公開/非公開の切り替え +1. **Settings(設定)** +2. **一番下の「Danger Zone」** +3. **「Change visibility」** + +### 📊 プロジェクトの統計 +- **Insights タブ**で色々な統計が見れる +- **誰が**、**いつ**、**どれくらい**活動したか + +--- + +## 🎯 練習課題 + +### レベル1:基本操作 +1. ✅ アカウントを作る +2. ✅ リポジトリを作る +3. ✅ README.md を編集する +4. ✅ 新しいファイルを追加する + +### レベル2:ファイル管理 +1. ✅ フォルダを作る(ファイル名に`/`を使う) +2. ✅ 画像をアップロードする +3. ✅ ファイルを削除する +4. ✅ 変更履歴を確認する + +### レベル3:コミュニケーション +1. ✅ Issue を作る +2. ✅ Issue にコメントする +3. ✅ 他の人のリポジトリに Star を付ける +4. ✅ 面白いプロジェクトを3つ見つける + +--- + +## ❓ よくある質問と回答 + +### Q: 英語が苦手でも大丈夫? +**A: 大丈夫です!** +- 基本的な単語だけ覚えればOK +- Google翻訳を使いながらでもOK +- 日本語でファイルを作ってもOK + +### Q: 間違えて消しちゃったらどうしよう? +**A: 大丈夫!履歴から復元できます** +1. History を見る +2. 消す前の状態を選ぶ +3. 復元する + +### Q: みんなに見られるのが恥ずかしい +**A: Private(非公開)にすればOK!** +- 後から公開に変更もできる +- 最初は非公開で練習がおすすめ + +### Q: 何を作ればいいかわからない +**A: こんなものから始めてみては?** +- 日記 +- 勉強メモ +- レシピ集 +- 読書記録 +- TODO リスト + +--- + +## 🚀 次のステップ + +### もう少し慣れたら... +1. **ブランチ**を使ってみる(安全に実験できる) +2. **Pull Request**を体験する(変更の提案) +3. **GitHub Pages**でWebサイトを作る + +### 学習リソース +- [GitHub公式の日本語ガイド](https://docs.github.com/ja) +- [実践的な操作手順ガイド](github-hands-on.md) + +--- + +## 🎉 おめでとうございます! + +ここまで読んだあなたは、もうGitHubの基本が使えるようになっています! + +**覚えておいてほしいこと:** +- 💪 **最初は誰でも初心者** +- 🔄 **失敗しても戻せる** +- 📈 **使えば使うほど上達する** +- 🤝 **分からないことは聞いてOK** + +**まずは1つ、何かファイルを保存してみることから始めましょう!** + +Happy GitHub Life! 🌟 \ No newline at end of file diff --git a/beginners/github-features-simple.md b/beginners/github-features-simple.md new file mode 100644 index 0000000..daa615b --- /dev/null +++ b/beginners/github-features-simple.md @@ -0,0 +1,262 @@ +--- +layout: default +title: "GitHub機能一覧 - シンプルガイド" +description: "GitHubで何ができるの?機能一覧と簡単な使い方" +--- + +# 🌟 GitHubの機能一覧 - 何ができるの? + +GitHubって何ができるの?という疑問に、シンプルにお答えします! + +--- + +## 📌 GitHubの主な機能一覧 + +### 1. 📁 **リポジトリ(Repository)** +**何これ?** → プロジェクトを保存する場所 +**何ができる?** +- コードやファイルを保存 +- 変更履歴を記録 +- 複数人で共有 + +**使い方:** +1. 右上の「+」ボタン → 「New repository」 +2. 名前を入力(例:my-first-project) +3. 「Create repository」をクリック + +--- + +### 2. 🌿 **ブランチ(Branch)** +**何これ?** → 作業を分ける仕組み +**何ができる?** +- 本番に影響せずに開発 +- 複数の機能を並行開発 +- 安全に実験 + +**使い方:** +1. リポジトリページの「main」ボタンをクリック +2. 新しいブランチ名を入力(例:new-feature) +3. 「Create branch」をクリック + +--- + +### 3. 💾 **コミット(Commit)** +**何これ?** → 変更を保存すること +**何ができる?** +- ファイルの変更を記録 +- いつ誰が何を変更したか分かる +- 過去の状態に戻せる + +**使い方:** +1. ファイルを編集 +2. 「Commit changes」ボタンをクリック +3. 変更内容を説明(例:「ログイン機能を追加」) +4. 「Commit changes」で保存 + +--- + +### 4. 🔄 **プルリクエスト(Pull Request)** +**何これ?** → 変更を提案する仕組み +**何ができる?** +- コードレビューを依頼 +- 変更内容を説明 +- 議論しながら改善 + +**使い方:** +1. 「Pull requests」タブ → 「New pull request」 +2. 比較するブランチを選択 +3. タイトルと説明を入力 +4. 「Create pull request」をクリック + +--- + +### 5. 🎫 **イシュー(Issues)** +**何これ?** → タスク管理・バグ報告 +**何ができる?** +- やることリストを作成 +- バグを報告 +- アイデアを共有 + +**使い方:** +1. 「Issues」タブ → 「New issue」 +2. タイトル(例:「ログインボタンが動かない」) +3. 詳細を説明 +4. 「Submit new issue」をクリック + +--- + +### 6. 📋 **プロジェクト(Projects)** +**何これ?** → タスクボード +**何ができる?** +- タスクを視覚的に管理 +- 進捗状況を確認 +- チームで協力 + +**使い方:** +1. 「Projects」タブ → 「New project」 +2. ボード形式を選択 +3. タスクカードを追加 +4. ドラッグ&ドロップで移動 + +--- + +### 7. ⚡ **アクション(Actions)** +**何これ?** → 自動化ツール +**何ができる?** +- テストを自動実行 +- デプロイを自動化 +- 定期的なタスクを実行 + +**使い方:** +1. 「Actions」タブ +2. 「set up a workflow yourself」 +3. テンプレートを選択 +4. 「Start commit」で保存 + +--- + +### 8. 🌐 **ページ(Pages)** +**何これ?** → 無料のWebサイト公開 +**何ができる?** +- Webサイトを公開 +- ドキュメントを公開 +- ポートフォリオ作成 + +**使い方:** +1. Settings → Pages +2. Source で「Deploy from a branch」選択 +3. Branch を「main」に設定 +4. 「Save」をクリック + +--- + +### 9. 📚 **ウィキ(Wiki)** +**何これ?** → プロジェクトの説明書 +**何ができる?** +- ドキュメント作成 +- 使い方マニュアル +- FAQ作成 + +**使い方:** +1. 「Wiki」タブ +2. 「Create the first page」 +3. 内容を入力 +4. 「Save page」 + +--- + +### 10. 👁️ **ウォッチ(Watch)** +**何これ?** → 更新通知を受け取る +**何ができる?** +- プロジェクトの更新を追跡 +- 重要な変更を見逃さない +- 興味のあるプロジェクトをフォロー + +**使い方:** +1. リポジトリページの「Watch」ボタン +2. 通知レベルを選択 +3. 「Apply」をクリック + +--- + +### 11. ⭐ **スター(Star)** +**何これ?** → お気に入り登録 +**何ができる?** +- 気に入ったプロジェクトを保存 +- 後で見返せる +- 作者を応援 + +**使い方:** +1. リポジトリページの「Star」ボタンをクリック +2. それだけ! + +--- + +### 12. 🍴 **フォーク(Fork)** +**何これ?** → プロジェクトをコピー +**何ができる?** +- 他人のプロジェクトをコピー +- 自分用にカスタマイズ +- 改善案を提案 + +**使い方:** +1. リポジトリページの「Fork」ボタン +2. 自分のアカウントにコピーされる +3. 自由に編集可能 + +--- + +## 🎯 どの機能から始めるべき? + +### 🔰 完全初心者の方 +1. **リポジトリ作成** - まず保存場所を作る +2. **ファイルアップロード** - 簡単なファイルを追加 +3. **コミット** - 変更を保存してみる + +### 📝 ドキュメント管理したい方 +1. **リポジトリ作成** +2. **Wiki** or **Pages** - ドキュメント公開 +3. **Issues** - フィードバック受付 + +### 👥 チーム開発したい方 +1. **リポジトリ作成** +2. **ブランチ** - 作業を分ける +3. **Pull Request** - レビューする +4. **Projects** - タスク管理 + +--- + +## 💡 覚えておくと便利なこと + +### 📌 よく使うボタンの場所 +- **新規作成**: 右上の「+」ボタン +- **設定**: リポジトリの「Settings」タブ +- **ファイル追加**: 「Add file」ボタン +- **編集**: ファイルの鉛筆アイコン + +### 🔍 便利なショートカット +- `t` - ファイル検索 +- `b` - ブランチ切り替え +- `w` - ブランチ選択 +- `s` - 検索にフォーカス + +### 💬 基本的な用語 +- **Clone(クローン)**: リポジトリをダウンロード +- **Push(プッシュ)**: 変更をアップロード +- **Pull(プル)**: 最新版をダウンロード +- **Merge(マージ)**: 変更を統合 + +--- + +## 🚀 次のステップ + +1. **アカウント作成** - まだの方は[GitHub.com](https://github.com)で無料登録 +2. **最初のリポジトリ** - 「Hello World」を作ってみる +3. **README作成** - プロジェクトの説明を書く +4. **Issues体験** - 自分でタスクを作ってみる + +--- + +## ❓ よくある質問 + +**Q: 無料で使える?** +A: はい!個人利用は基本無料です。 + +**Q: プログラミングできなくても使える?** +A: はい!ドキュメント管理やタスク管理にも使えます。 + +**Q: 公開しないといけない?** +A: いいえ!プライベートリポジトリで非公開にできます。 + +**Q: 日本語は使える?** +A: はい!ファイル名以外は日本語OK。 + +--- + +## 📚 もっと詳しく知りたい方へ + +各機能の詳しい使い方は、個別のガイドをご覧ください: +- [初心者向け入門ガイド](github-beginner-guide.md) +- [実践的な操作手順](github-hands-on.md) + +でも、まずは**リポジトリを作って、何か保存してみる**ことから始めましょう!🎉 \ No newline at end of file diff --git a/beginners/github-hands-on.md b/beginners/github-hands-on.md new file mode 100644 index 0000000..d535a25 --- /dev/null +++ b/beginners/github-hands-on.md @@ -0,0 +1,360 @@ +--- +layout: default +title: "GitHub実践ガイド - 画面を見ながら操作しよう" +description: "実際の画面を見ながら、GitHubの基本操作をマスターしよう" +--- + +# 🖥️ GitHub実践ガイド - 画面を見ながら操作しよう + +実際の画面を想定しながら、一つずつ操作を覚えていきましょう! + +--- + +## 📍 画面の見方を覚えよう + +### GitHub トップページ +``` +┌─────────────────────────────────────────────────┐ +│ 🐙 GitHub 検索バー [___________] 🔔 ➕ 👤 │ +├─────────────────────────────────────────────────┤ +│ │ +│ 左側: 右側: │ +│ 📁 Recent Repositories 📰 最近の活動 │ +│ - my-first-project - @user がスター │ +│ - hello-world - 新しいissue │ +│ │ +└─────────────────────────────────────────────────┘ +``` + +**重要なボタンの位置:** +- 🔔 **通知** - 更新があったら赤い丸が付く +- ➕ **新規作成** - ここから新しいものを作る +- 👤 **プロフィール** - 設定やログアウト + +--- + +## 🎯 実践1:リポジトリを作る + +### 手順1:新規作成ボタンをクリック +``` +画面右上 + ↓ + [ 🔔 ] [ ➕ ] [ 👤 ] + ↑ + ここをクリック! +``` + +### 手順2:メニューから選択 +``` +┌─────────────────┐ +│ New repository │ ← これを選ぶ +│ Import repo... │ +│ New gist │ +│ New org... │ +└─────────────────┘ +``` + +### 手順3:リポジトリ情報を入力 +``` +Create a new repository +━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ + +Repository name * +[my-awesome-project_______________] + ↑ + 半角英数字とハイフン(-)が使える + +Description (optional) +[私の素晴らしいプロジェクト_________] + ↑ + 日本語OK! + +◉ Public ○ Private + ↑ ↑ +みんなに公開 自分だけ + +□ Add a README file ← チェックを入れる! +□ Add .gitignore +□ Choose a license + +[Create repository] ← 最後にこれをクリック +``` + +--- + +## 🎯 実践2:ファイルを作成・編集 + +### 新しいファイルを作る + +#### 手順1:Add fileボタンを探す +``` +リポジトリページ +┌─────────────────────────────────────────────┐ +│ 📁 my-awesome-project │ +│ ─────────────────────────────────────────── │ +│ 📄 README.md │ +│ │ +│ [Add file ▼] [🟢 Code ▼] │ +│ ↑ │ +│ ここをクリック │ +└─────────────────────────────────────────────┘ +``` + +#### 手順2:Create new fileを選択 +``` +┌──────────────────┐ +│ Create new file │ ← これ +│ Upload files │ +└──────────────────┘ +``` + +#### 手順3:ファイル名と内容を入力 +``` +ファイル作成画面 +━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ + +my-awesome-project / [memo.txt___________] + ↑ + ファイル名を入力 + +Edit new file Preview +━━━━━━━━━━━━━━━━━━━━━━━ +1 | 今日の作業メモ +2 | +3 | GitHubの使い方を勉強中 +4 | 思ったより簡単だった! +5 | + ↑ + 内容を入力 +``` + +#### 手順4:保存(コミット) +``` +画面下部 +━━━━━━━━━━━━━━━━━━━━━━━━━━ + +Commit new file + +[メモファイルを追加_______________] + ↑ + 何をしたか書く(日本語OK) + +◉ Commit directly to the main branch +○ Create a new branch + +[Commit new file] ← クリックして保存 +``` + +--- + +## 🎯 実践3:既存ファイルを編集 + +### 手順1:編集したいファイルをクリック +``` +ファイル一覧 +━━━━━━━━━━━━━━━━━━━━ +📄 README.md ← クリック +📄 memo.txt +``` + +### 手順2:編集ボタンをクリック +``` +ファイル表示画面 +┌─────────────────────────────────────┐ +│ README.md ✏️ 🗑️ │ +│ ↑ │ +│ 鉛筆マーク │ +│ ─────────────────────────────────── │ +│ # my-awesome-project │ +│ 私の素晴らしいプロジェクト │ +└─────────────────────────────────────┘ +``` + +### 手順3:編集して保存 +``` +編集画面 +━━━━━━━━━━━━━━━━━━━━━ +1 | # my-awesome-project +2 | 私の素晴らしいプロジェクト +3 | +4 | ## 今日やったこと ← 追加 +5 | - GitHubの勉強 ← 追加 +6 | + +下にスクロールして... + +[Commit changes] をクリック +``` + +--- + +## 🎯 実践4:Issue(タスク)を作る + +### 手順1:Issuesタブをクリック +``` +リポジトリ上部のタブ +━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ +<> Code | 🔴 Issues | 🔄 PR | ⚡ Actions + ↑ + ここをクリック +``` + +### 手順2:New issueをクリック +``` +Issues画面 +┌──────────────────────────────────┐ +│ 🔍 検索バー [New issue] │ +│ ↑ │ +│ 緑のボタン │ +└──────────────────────────────────┘ +``` + +### 手順3:タイトルと内容を書く +``` +新規Issue作成 +━━━━━━━━━━━━━━━━━━━━━━━━━━━ + +Title +[READMEに使い方を追加したい_______] + ↑ + やりたいこと + +Leave a comment +┌─────────────────────────────┐ +│ ## やりたいこと │ +│ READMEに初心者向けの │ +│ 使い方を追加したいです │ +│ │ +│ ## 理由 │ +│ 友達に教えるときに │ +│ 説明しやすくするため │ +└─────────────────────────────┘ + +[Submit new issue] ← クリック +``` + +--- + +## 🎯 実践5:他の人のプロジェクトを見る + +### 手順1:検索する +``` +画面上部の検索バー +┌────────────────────────────┐ +│ 🔍 Search GitHub │ +└────────────────────────────┘ + ↑ + 「recipe」「diary」など + 興味のあるキーワードを入力 +``` + +### 手順2:検索結果から選ぶ +``` +検索結果 +━━━━━━━━━━━━━━━━━━━━━━━━━ + +📁 user/recipe-collection ⭐ 234 + 簡単レシピ集 + +📁 another/my-recipes ⭐ 89 + 毎日の料理レシピ + ↑ + 気になるものをクリック +``` + +### 手順3:スターを付ける +``` +プロジェクトページ +┌────────────────────────────────────┐ +│ 📁 user/recipe-collection │ +│ │ +│ [⭐ Star] [👁️ Watch] [🍴 Fork] │ +│ ↑ │ +│ クリックでお気に入り登録 │ +└────────────────────────────────────┘ +``` + +--- + +## 💡 操作のコツ + +### 🔍 迷ったときは +1. **戻るボタン** - ブラウザの戻るで大丈夫 +2. **ロゴクリック** - GitHubロゴでトップに戻る +3. **パンくずリスト** - 今どこにいるか分かる + +### ⌨️ 便利なキーボードショートカット +画面で `?` を押すと、ショートカット一覧が出ます! + +よく使うもの: +- `t` - ファイル検索 +- `b` - ブランチ切り替え +- `g` `n` - 通知ページへ +- `g` `d` - ダッシュボードへ + +### 🎨 見た目を変える +プロフィール → Settings → Appearance で: +- ☀️ **Light** - 明るいテーマ +- 🌙 **Dark** - 暗いテーマ +- 💻 **System** - OSに合わせる + +--- + +## 🚨 困ったときの対処法 + +### ❌ エラーが出た +``` +エラー例: +┌─────────────────────────────┐ +│ ⚠️ File name already exists │ +└─────────────────────────────┘ +``` +**対処法**: ファイル名を変える + +### 🔒 Permission denied +**対処法**: ログインし直す、権限を確認 + +### 📝 日本語が文字化け +**対処法**: ファイルの文字コードをUTF-8に + +--- + +## 🎓 練習問題 + +### 📌 基本操作をマスターしよう + +#### 課題1:自己紹介リポジトリ +1. `self-introduction` という名前でリポジトリ作成 +2. `profile.md` ファイルを作成 +3. 自己紹介を書く +4. `hobbies.md` を追加して趣味を書く + +#### 課題2:日記リポジトリ +1. `my-diary-2024` でリポジトリ作成 +2. `2024/01/diary.md` を作成(フォルダ付き) +3. 今日の出来事を書く +4. Issue で「明日やること」を作成 + +#### 課題3:学習記録 +1. `learning-log` でリポジトリ作成 +2. `github/` フォルダを作る +3. `day1.md` に今日学んだことを記録 +4. README.md に目次を追加 + +--- + +## 🎉 よくできました! + +ここまでできたら、GitHubの基本操作はバッチリです! + +**次のステップ:** +- 🌿 ブランチを使った安全な編集 +- 🔄 Pull Requestでの共同作業 +- 🌐 GitHub Pagesでサイト公開 + +**覚えておいてください:** +- 😊 間違えても大丈夫、やり直せます +- 📚 分からないことは調べながらでOK +- 🎯 毎日少しずつ使えば必ず上達します + +楽しいGitHubライフを! 🚀 \ No newline at end of file diff --git a/index.md b/index.md index 0dcd642..302a316 100644 --- a/index.md +++ b/index.md @@ -6,7 +6,34 @@ description: "外部ツールに依存せず、GitHub一つで開発業務を完 # 🚀 GitHub完全活用ガイド -> **GitHub機能を網羅的に理解し、開発プロセスを最適化するための実践的解説書** +> **GitHubって何?から始める、初心者からプロまで使える完全ガイド** + +## 🌱 初めての方はこちらから! + +
+

🔰 GitHub初心者の方へ

+

プログラミング知識ゼロでも大丈夫!まずはここから始めましょう。

+ + +

🎯 このサイトで学べること

@@ -260,20 +287,87 @@ gh issue create --title "プロジェクト初期設定" --body "GitHub機能の color: white; } +/* 初心者セクション */ +.beginner-section { + background: #e3f2fd; + padding: 2rem; + border-radius: 10px; + margin: 2rem 0; + text-align: center; +} + +.beginner-section h2 { + color: #1976d2; + margin-bottom: 1rem; +} + +.beginner-links { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 1.5rem; + margin-top: 2rem; +} + +.beginner-card { + background: white; + padding: 2rem; + border-radius: 8px; + text-decoration: none; + color: inherit; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + transition: all 0.3s ease; + position: relative; + overflow: hidden; +} + +.beginner-card:hover { + transform: translateY(-3px); + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15); + text-decoration: none; +} + +.beginner-card h3 { + color: #1976d2; + margin-bottom: 0.5rem; + font-size: 1.3rem; +} + +.beginner-card p { + color: #424242; + line-height: 1.6; + margin-bottom: 1rem; +} + +.beginner-card .time { + display: inline-block; + background: #e3f2fd; + color: #1565c0; + padding: 0.3rem 0.8rem; + border-radius: 20px; + font-size: 0.85rem; + font-weight: 500; +} + /* レスポンシブ対応 */ @media (max-width: 768px) { .features-grid, .guide-links, - .stats-section { + .stats-section, + .beginner-links { grid-template-columns: 1fr; } - .hero-section { + .hero-section, + .beginner-section { padding: 1.5rem; } .stat-item h3 { font-size: 2rem; } + + .beginner-card { + padding: 1.5rem; + } } \ No newline at end of file