Yuya Karubeさん
  • コラボレーター
  • SELECK(How to)
  • Yuya Karube

【第3回】非エンジニア向けGitHub入門〜GitHubでファイルを管理する方法〜

  • -
  • このエントリーをはてなブックマークに追加
    -
  • tweet

非エンジニアのためのGitHub入門第3回、ようやくGitHub本来の機能「ファイル管理」についてです。

SELECK上で公開されている記事のテキストデータは、公開前はGitHubで管理されています。これには記事を自動校正する(リンク先の記事はエンジニア向けです)という目的もあるのですが、主な目的は記事の編集履歴を残すことです。

この仕組みは、仕事をする上で欠かすことのできない仕様書や提案書などのファイルの管理にも応用できます。

▼エンジニアにも対応したGithub入門の連載記事は以下をご覧ください

チーム開発を変える「GitHub」とは?導入方法・使い方を徹底解説!【第1回】【導入編】

GitHubでファイルを管理するメリットとは?

第1回の記事でも解説しましたが、自分でファイルのバージョンを管理しようとすると、煩雑になりがちです。結局どのファイルが最新なのか分からない、誰かがいつの間にか上書きしてしまっている、というような事態を経験したことがある人も多いのではないでしょうか。

その問題を解決するための履歴管理機能がGitHubには備わっています。誰が、いつファイルを更新したのかが分かり、いつでも過去の状態に戻すことができます。

それでは実際にGitHubでファイルを管理する方法を見ていきましょう。

まずはファイルを作成しよう

本来、GitHub(とGit)のファイルはコマンドで操作します。エンジニアのPCを見ると、真っ黒な背景に文字だけが表示された画面に、何やら難しいコマンドを打ち込んでいるのを観測できるはずです。

本当はそういったコマンド操作が必要なのですが、GitHubの場合は基本的な操作をWebの画面上から行うことができます。ファイルの作成も、ボタンひとつで実行できます。[New File]ボタンをクリックし、テキストファイルを追加してみましょう。

GitHub ファイル 新規作成

[Name your file...]の欄にファイル名を入力し、下の入力フォームにファイルの中身を記述します。ちなみにここで指定している.mdという拡張子はMarkdownというファイル形式で、「ちょっとした装飾ができるテキストファイル」のようなものです。まあ難しいことは考えずに、普通に文章を書いてみましょう。

GitHub ファイル 作成

そして一番下にある[Commit new file]というボタンを押すと、それで保存完了です。レポジトリのファイル一覧画面に先ほど作成したファイルが追加されていると思います。

GitHub ファイル 作成

作成したファイルを編集してみよう

先ほど作成したファイルをクリックしてみましょう。鉛筆ボタンを押すと、編集画面に遷移します。

GitHub ファイル 編集

ファイル作成時と同様に、本文を適当に書きかえます。また、更新内容を[Commit changes]の欄に書いてみましょう。ここに書いたコメントは編集履歴の画面に表示されるので、どんな理由で編集されたのかという事が分かりやすくなります。

GitHub コメント

[Commit Changes]ボタンでファイルを更新します。また一覧からファイルを選択すると更新されていることが確認できるはずです。

編集履歴を確認する

先ほど鉛筆ボタンを押した画面に、[History]というボタンがあります。このボタンを押すと、ファイルの履歴を参照できます。

GitHub 編集履歴

このように、更新日時と更新した人、コメントが一覧表示されます。

GitHub 編集履歴

これだけでも便利ですが、コメントの部分をクリックしてみると...

GitHub 編集前後 差分

そこでどのような更新があったのか、差分を表示してくれます!(差分が横に並んでいない場合は、[split]というボタンを押しましょう)。

これで誰が、いつ、どんな目的で、どういう変更を加えたのか一目瞭然です。もう「ファイルを誰かが勝手に更新した」とか、「ファイルを作った人がいなくなって何の目的で書かれたのか分からない」という事態は解消されるでしょう。

テキスト以外のファイルをアップロードする

GitHubには画像やMicrosoft Officeなどの、テキスト以外のファイルもアップロードできます。レポジトリのトップ画面で、[Upload Files]を選択します。

GitHub ファイル アップロード

ここで[choose your files]を選択するか、ドラッグ&ドロップでファイルをアップロードしましよう。[Commit changes]を選択して完了です。

画像ファイルであれば、GitHub上でプレビュー表示ができます。差分も並べて見れるのが面白いですね。

GitHub 差分

次回はPull Requestについて

今回はGitHubの本来の機能である、ファイル管理について解説しました。本来はコマンドや専用のツールでやる作業なので、正直なところWeb上では使いづらいところも多いです。ただ、どういった仕組みになっているのかを把握するだけでも、エンジニアとの意思疎通も図りやすいのではないでしょうか。

次回はPull Request、通称「ぷるりく」についてを予定しています。ぷるりくは簡単に言うと、「このファイルをこういう風に変更して」という依頼を出す機能です。みんなでファイルを編集したいけど、一度レビューは通したい、というときにオススメの機能です。これが出来ればエンジニア気分が味わえます!?

▼エンジニアにも対応したGithub入門の連載記事は以下をご覧ください

チーム開発を変える「GitHub」とは?導入方法・使い方を徹底解説!【第1回】【導入編】

  • -
  • このエントリーをはてなブックマークに追加
    -
  • tweet