33ステップで解説、GitHubオープンソース貢献入門、IchigoJamプリントをつくってみよう！「もじのしょうたい CHR$/ASC」とはじめてのプルリク

2020-08-01

#IchigoJam #github

世界中で使われているオープンな共同制作プラットフォーム「GitHub」、アカウントを作って、自分のお気に入りのプロジェクト、応援したいプロジェクトに参加してみましょう！（東京都、経産省、Denoなど、有名オープンソースも多数！）

誤字やバグを直したり、自分の作った新機能をそのプロジェクトへ反映を依頼することを「プルリク（＝Pull Request）」と呼び、反映（マージ）された人は、コントリビューター（貢献者）として、そのプロジェクトに名前が載ります。

簡単で気軽なところから練習できるように、IchigoJamで進めているオープンソースなプログラミング教材プロジェクト「IchigoJamプリント」への貢献手順を解説してみました。貢献はじめのいっぽにぜひどうぞ！

1. まずはGitHubにユーザー登録。13才以上、メールアドレスがあればOKです。

2. GitHub上のプロジェクト「IchigoJamプリント」を開きます（Git上のプロジェクトをリポジトリと呼びます）

3. 右上の「Fork」をクリック。（枝分かれする食器、フォークが語源。この時点のリポジトリの全ファイルを自分のリポジトリとしてコピーします）

4. ja フォルダをクリック

5. 新しくプリントを作るベースとして DRAW.html を使いましょう

6. 鉛筆マークをクリックして編集画面に

7. 中身を全選択(Ctrl+A または command+A)して、コピー(Ctrl+C または command+C)

8. ja フォルダに戻ります

9. Add file、Create new file で、新しくファイルをつくります

10. 名前はとりあえず「TEST.html」としましょう（IchigoJamプリントで大文字ファイル名+.htmlとしています

11. 変えたことが分かるように、タイトルを変えてみましょう

12. Commit new file で保存します

13. リンクを辿って見えるように、リストも更新しましょう。スクロールして下の方、index.html をクリック。

14. 鉛筆マークで編集

15. テストとして、プログラミングコースの前に下記1行を追加します
「- <a href=TEST.html>テスト TEST</a><br>」

16. Commit changings で保存

17. GitHub Pagesとしてブラウザで見られるように公開設定します。「Settings」をクリック

18. スクロールして、GitHub Pages の Source を None をクリック、master にする

19. Saveボタンをおすと、自動的にページが再読み込みされます

20. もういちどスクロールして GitHub Pages のところをみると、自分のアカウント名+github.io/print/ として公開されたことがわかります。新規ウィンドウで開きましょう（実際に公開されたり、変更が反映されるまでるまでに1分前後タイムラグがあるので、404が出ても焦らずしばらくまってリロードしましょう）

21. 日本語をクリック

22. index.html に追加したテストが見えました！

23. 中身もばっちり作成したテストになってます！このウィンドウは確認用に開いたままにします

24. GitHub Pages を開いた元のウィンドウに切り替え、print フォルダにもどります

25. 再び TEST.html を開き、オリジナルなIchigoJamプリントを作ってみましょう
Commit changesして、ちょっと待って、別のウィンドウをリロードして確認を、納得いくまで繰り返し
新プリント「もじのしょうたい CHR$/ASC (src on GitHub)」も参考にどうぞ！