派遣で働くエンジニアのスキルアップを応援するサイト

PRODUCED BY RECRUIT

【イベントレポート】Pythonでデータ処理と機械学習を始めよう

株式会社リクルートスタッフィングが運営するITSTAFFINGでは、弊社に派遣登録いただいている皆さまのスキル向上を支援するイベントを、定期的に開催しています。

2019年6月14日のイベントでは「Pythonでデータ処理と機械学習を始めよう」を開催。データの前処理を効率的に行うためのライブラリ「Pandas」を使って、機械学習の最も初歩的なモデルが作られるようになるまでを、書籍『Pythonによるはじめての機械学習プログラミング』の著者でもある早川敦士さんが分かりやすく解説してくださいました。

■今回のイベントのポイント
・プログラミングの準備として、データの取り扱いが大切
・データ分析のライブラリ「Pandas」を使いこなそう
・Pythonは、データに触れることが上達への近道

【講師プロフィール】
早川 敦士さん
株式会社FORCAS、株式会社ホクソエムに所属。前職のリクルートコミュニケーションズではB2Cマーケティング、現職のFORCASではB2Bマーケティングプラットフォームのデータ分析及び開発を担当。大学在学中に『データサイエンティスト養成読本』(技術評論社刊)を共著にて執筆。その後も『機械学習のための特徴量エンジニアリング』(オライリー・ジャパン刊)や『Pythonによるはじめての機械学習プログラミング』(技術評論社刊)などで執筆活動を続けている。国内最大級のR言語コミュニティであるJapan.Rを主催。

機械学習プログラミングの準備。データの取り扱い方

機械学習とは、コンピューターにデータを読み込ませ、アルゴリズムに基づいて分析をさせる手法のことです。そのため、ソフトウェアに“学習させるため”のデータが大量に必要となります。

しかし、そのデータがきちんと整形されていなかったり、データに重複や抜け落ちがあったりすると、正しい学習効果を得られません。機械学習を行うプログラムそのものは、豊富なライブラリを使って組むこともできますが、学習データは独自に集めてきたものも多くなります。そうなると、データの取り扱い方こそが大切とも言えます。

今回のイベントでは、機械学習そのものについての解説もありましたが、「機械学習エンジニアへの第一歩は、データの読み込みと書き出しの方法を知ることが大切」と早川さんはお話しされ、ほかのイベントではあまりお目にかかることのないデータの取り扱いについても詳しく解説されました。そこでまずは、Pythonのデータ分析で利用するツールを簡単にご紹介いただきました。

・scikit-learn
機械学習用ライブラリで、機械学習のデファクトスタンダードとも呼ばれる。手法のカバー範囲も広く、統一されたインターフェイスが特長

・Pandas
データフレームを提供するためのツールで、おおざっぱに言えばExcelのようなもの。データの加工や集計に使う

・SciPy、NumPy
Pythonを使われる方には馴染みの深い数値計算用ライブラリで、ベクトル計算や行列計算に便利な命令が多数用意されている

・Plotly
グラフ描画ライブラリ。きれいなグラフが描け、使い勝手の良さが支持されている

次に主要なデータ形式の特徴について学びました。機械学習分野で使われる主要なデータ形式として、Excel形式、JSON形式などがあるそうです。

・Excel形式
小さなデータであれば一覧性が高いという特徴がある。大きなデータである場合には、データ文字列中にカンマが存在する可能性があるため、カンマよりタブで区切ることをお勧め

・JSON形式
JavaScript Object Notation の略。WebサービスのAPIにより提供されるデータ形式は、ほとんどこの形式が使われている。ほか、MySQLやPostgresなどのデータベースの出力や、Webサイトのクローリング形式、ブログ記事などにも使われている

データを扱うためのライブラリ「Pandas」

次に、ライブラリ「Pandas」を使ってデータを読み込みました。サンプルではiris.data.csvというCSV形式のデータを読み込み、データフレームに格納しています。そして、最後に読み込んだデータの概要を表示します。

import pandas as pd
df = pd.read.csv('iris.data.csv', header=None)
dfinfo()

データの概要を表示したら、行数と列数は、しっかり確認しておくと良いそうです。

次に読み込んだデータの一部を表示してみます。データの上から10行分を表示する場合は、次の命令を記述します。

df.head(n = 10)

行数はnで指定します。データの終わりからn行を表示するにはtail()を使います。

ちなみに、このようなプログラムを1つ1つ試しながら結果を参照・実行できるものとして、早川さんが使われていた便利なツールが「Jupyter Notebook」です。「Pandas」と組み合わせて使用すると、簡単にデータ分析ができるそうです。

f:id:itstaffing:20190815122839j:plain
▲Jupyter Notebookは、プログラムを実行し、実行結果を記録しながら、データの分析作業を進められるように設計されたツール。結果をすぐに画面で確認できるのも便利

Pandasで要素を抽出

格納データの任意の部分を表示させる命令もいくつか学びました。

データ位置を数値で指定して表示させるには、ilocメソッドを使います。1行目の2列目を表示するには次のように指定しますが、行も列も0スタートなので1行目が0、2列目が1になる点は注意が必要です。

df.iloc[0, 1]

また、locメソッドを使うと、列名を指定してデータを取り出すこともできます。1行名から5行目までの列名1と列名2の列データを抜き出して表示するには次のように指定します。

df.loc[[0, 1, 2, 3, 4] , ['列名1', '列名2']]

Pandasの便利なメソッド

応用編として、アンケートでの回答の重複が無いかどうかを確認するという例も学びました。回答番号の欄がすべて異なっているかどうかを確認するため、uniqueメソッドでユニークな行がどれだけあるかを調べ、それをデータ全体の合計と比べるというものです。

df["回答番号の列名"].unique()

また、アンケートのなかでユニークな回答が、全部で何種類あるかを求めるには、次のように記述します。

df["列名"].value.counts()

そのほかにも、合計はsum()メソッド、平均はmean()メソッド、最大値はmax()で求められることなど、基本的なメソッドを使って、データを集計したり、データの表示を工夫したりする方法を学びました。これだけでも十分に面白いと感じることができましたが、もちろん、イベントはそれだけでは終わりません。

繰り返し行うデータ集計にも便利なPython

より実践的な事例では、生のデータを整形しながら、機械学習プログラムに利用できる形式に変換する方法を、段階を踏まえながら学んでいきました。

事例では、サイト『Stack Overflow Annual Developer Survey』からダウンロードした、データ『survey_results_public.csv』を使いました。

import pandas as pd
df = pd.read.csv('~/Downloads/survey_results_public.csv',
low_memory = False)
df_info()

このデータを基に、データの型変換、カテゴリを追加する、複数回答を異なる列に展開、4種類ある回答を3種類にまとめるなどの具体的な処理を行っていきました。

また、データを文字列として扱うと、数値に比べて余計にメモリを消費してしまうため、これをコンパクトに格納するテクニックなども紹介してくださいました。

学んでいくにつれ、こうしてデータをさまざまな形にして出力できるのは楽しいと感じられる一方で、データにいろいろな操作を加え整形していくうちに「あれ?今、自分は何をしていたんだっけ?」と迷子になってしまうことも多いようです。

そのため、「常に確認しながらやっていくことが大切。だからJupyter Notebookを使うと良い」と早川さんは教えてくださいました。

こうしたデータの整形はExcelでもできますが、1度Pythonで書いておけば、次回も同じ処理をそのまま実行することができ、さらには機械学習のプログラムの前段に組み込むこともできます。日々の集計や週ごとの集計など、繰り返し行う作業であれば、Pythonで書いておくと良い、とのことでした。

また、Plotlyによるグラフ化についても、教えていただきました。

f:id:itstaffing:20190815122842j:plain
▲Plotlyで描いたグラフは、マウスオンで内訳表示されるほか、拡大や保存などもマウス操作でできるなど、使い勝手が良い

とにかくデータに触れることが上達への近道

この後、実際にscikit-learnを利用した機械学習プログラムの例もいくつか紹介してくださったのですが、このレポートでは割愛します。

これまで機械学習のプログラミングについてのイベントはいくつかありましたが、こうしたデータの前処理に関するものは深堀されていなく、とても参考になったとのお声を参加者から多くいただきました。

早川さんは、「興味のあるデータは探せば意外と見つかるので、練習のつもりで、データにたくさん触れてみることが大切です」と締めくくってくださいました。

【コラム】プログラマを目指すときに知っておきたい基礎用語とは

プログラミングの知識を身につけようと思ったとき、最初のハードルになるのが「専門用語」です。勉強すればするほど知らない用語が登場するため、1つずつ調べながら学ぶことになるかと思います。インターネットを使うと簡単に調べられるようになった一方で、“知らない用語”は調べられないものです。

そこで今回は、プログラミングをするときに最低限知っておきたい基礎的な用語をご紹介します。似ている用語と比較をしているので、その違いも意識してみてください。

【筆者】増井 敏克さん
【筆者】増井 敏克さん
増井技術士事務所代表。技術士(情報工学部門)。情報処理技術者試験にも多数合格。ビジネス数学検定1級。「ビジネス」×「数学」×「IT」を組み合わせ、コンピュータを「正しく」「効率よく」使うためのスキルアップ支援や、各種ソフトウェアの開発、データ分析などを行う。著書に『おうちで学べるセキュリティのきほん』『プログラマ脳を鍛える数学パズル』『エンジニアが生き残るためのテクノロジーの授業』『図解まるわかり セキュリティのしくみ』(以上、翔泳社)、『シゴトに役立つデータ分析・統計のトリセツ』『プログラミング言語図鑑』(以上、ソシム)がある。

機械語とプログラミング言語

コンピュータは、人間が設計書を書けば動いてくれるわけではなく、「機械語」と呼ばれる言語で指示を出す必要があります。しかし、機械語を人間が書いたり読んだりするのはとても大変です。

そこで「プログラミング言語」を使って、人間にとってわかりやすい記述ができるように工夫をしています。ただし、コンピュータにはプログラミング言語が理解できないので、これを機械語に変換する必要があります。

ソースコードとプログラム

プログラミング言語のルールに沿って書かれたものを「ソースコード」と呼びます。そして、このソースコードを機械語の「プログラム」に変換することで、コンピュータが実行可能になります。

f:id:itstaffing:20190808102957j:plain

なお、プログラムと似た言葉に「ソフトウェア」「アプリケーション」があります。ソフトウェアはハードウェアと対比して使われる言葉で、プログラムだけでなくデータや文書などのファイルも含みます。また、アプリケーションは「応用ソフト」と訳されるように、OS(基本ソフト)以外のソフトウェアを指します。

コンパイラとインタプリタ

ソースコードをプログラムに変換する方法は、「コンパイラ」「インタプリタ」に大きく分けられます。

コンパイラはソースコードからプログラムに事前に変換しておくことで、実行時に高速で処理を行えます。ただし、ソースコードに修正が発生した場合は、毎回変換作業をやり直す必要があります。

インタプリタは実行時に変換しながら処理を行うため、コンパイラよりも処理に時間はかかりますが、ソースコードを修正した場合もすぐに実行ができます。

f:id:itstaffing:20190808102959j:plain

ただし、最近では「バイトコード」と呼ばれる中間言語の増加や、「JITコンパイラ」という方式を採用した言語の登場など、コンパイラやインタプリタの分類が難しくなっています。

また、機械語に変換するのではなく、他の言語のソースコードに変換する「トランスパイラ」と呼ばれる言語も登場しています。

コーディングとプログラミング

プログラマがソースコードなどを記述することを「コーディング」といいます。ただし、プログラマの仕事はこのコーディングだけではありません。ソフトウェア開発の大きな流れとして、「V字モデル」という言葉があります。

次の図のように要求分析から始まり、要件定義や基本設計、詳細設計などが前段として存在し、その上で実装をする作業がコーディングです。コーディングを行ったあとには、単体テストや結合テスト、システムテスト、受け入れテストが待っています。

f:id:itstaffing:20190808103003j:plain

このうち、設計や実装、テストまでの広い範囲が「プログラミング」だと考えられます。この言葉の指す範囲は曖昧で、その会社や組織によってプログラマが担当する範囲は異なることがあります。

データ構造とアルゴリズム

『アルゴリズム+データ構造=プログラム』という本があるように、プログラムを作る上でアルゴリズムやデータ構造についての知識は必須です。

「データ構造」によって、プログラム中どのようにデータを格納するかが決まります。整数や小数、文字などを格納する「基本データ型」だけでなく、これらを組み合わせた「配列」、その格納方法や取り出し方として「キュー」「スタック」などの言葉も知っておきましょう。

f:id:itstaffing:20190808103006j:plain

一方、プログラムでの処理手順を示したものが「アルゴリズム」です。配列の中から欲しいデータを見つけ出す「探索」や、昇順や降順に並べ替える「ソート」など、基本的なアルゴリズムは書籍などで学んでおきましょう。

計算量とオーダー

複数のアルゴリズムの中から、最適な手法を選ぶためには基準が必要です。その基準として「計算量」という考え方がよく使われます。

“良い”アルゴリズムには、処理するデータが増えても、それほど処理時間が長くならないと考える「時間計算量」と、メモリやディスクをそれほど消費しないかを考える「空間計算量」といった基準があります。

その中でも、アルゴリズムの比較では時間計算量がよく使われ、「オーダー」という表記がよく使われます。オーダーを考えるときは、入力のデータ量(サイズ)が大きくなったときに、処理時間がどれくらい増えるのかを調べます。例えば、繰り返し(ループ)において、その実行回数を数えてみるとイメージしやすいでしょう。

f:id:itstaffing:20190808103009j:plain

フレームワークとライブラリ

最近ではアプリケーションを作成する際に、「フレームワーク」を使うことが一般的になりました。

フレームワークは多くのプログラムで共通して使える処理の枠組みのことで、Windowsの場合は.NET Framework、iOSのApp Frameworks、Webアプリを作成する場合のWebアプリケーションフレームワーク、CSSフレームワークなどがあります。

フレームワークに似たようなソフトウェアとして「ライブラリ」という言葉が使われることがありますが、ライブラリはメールの送信やログの記録、数学的な関数や画像処理など、便利な機能をまとめたものです。

フレームワークを使って共通の処理を土台として実現し、ライブラリを使ってアプリケーションに独自の機能を簡単に追加できます。

f:id:itstaffing:20190808103012j:plain

APIとシステムコール

ソフトウェアがライブラリを呼び出すときのインターフェイスとして「API(Application Programming Interface)」があります。Windowsの機能を呼び出すときにはWin32 APIなどが使われ、WebアプリでもGoogle Chart APIや、SNSの自動投稿用として、そのサービスの提供元からAPIが提供されています。

f:id:itstaffing:20190808103015j:plain

また、OSが提供するインターフェイスを「システムコール」といいます。ハードウェアを制御するソフトウェアを作りたい場合には必須の知識ですが、ゲームや組み込みなどの開発を行わない場合には、使う場面が減っています。

テスト手法とテスト駆動開発

ソフトウェアは開発するだけでなく、「テスト」が必要です。テストは、作成したプログラムが使用通り動作しているか、不具合がないかを確認する作業です。

正しいデータや操作を正常に処理できるかを確認するだけでなく、誤ったデータが与えられた・想定外の操作が行われた、といった場合にも異常終了しないことを確認する必要があります。

なお、テストで不具合が見つかった場合に、その原因を調べて修正する作業や、修正する必要があるか探す作業のことを「デバッグ」といいます。

また、そのテストが動作するように実装する開発手法として、「テスト駆動開発」があります。テストを自動的に実行できる環境を用意することで、プログラムを修正した場合にも、他に悪い影響を与えていないかチェックできる可能性が高まります。

ウォーターフォールとアジャイル

開発手法としてウォーターフォールやアジャイルなどが取り上げられることがあります。

「ウォーターフォール」はV字モデルにおける要件定義や設計、開発、テスト、運用というステップを大きな流れとして、できるかぎり逆方向に戻ることがないように進める方法です。

一方、「アジャイル」はこのサイクルを小さな単位で繰り返す方法だと考えられます。

f:id:itstaffing:20190808103017j:plain

ただし、実際にはアジャイルにはスクラム開発やXP(eXtreme Programming)のほか、いくつかの手法があります。スクラム開発の場合であれば、見積ポーカーという見積手法や、スプリント計画、デイリースクラム、スプリントレビューなどプロジェクトを進めるにあたり、さまざまな手法が用いられており、単純にサイクルを小さくするだけではありません。

おわりに

プログラマとして働く上では、次々と新しい用語が登場します。それらを1つずつ学ぶだけではなく、複数のキーワードを関連付けて、調べていくことが大切です。知らない用語を見つけた、新しい用語が気になった場合には、これまでとどう違うのか、その違いを比べながら学ぶようにしましょう。

このコラムの内容は、2019年7月10日に開催した「プログラマを目指すときに知っておきたい基礎用語とは」と題したイベントで、より詳しく増井さんにご解説いただきました。今後も皆さまのスキル向上を支援するイベントを定期的に開催いたします。ぜひご参加ください。

【インタビュー】優れたコードよりも、当たり前のことを。年収1000万円フリーランスエンジニアへの道

エンジニアとしてのキャリアを考える上で、スキルアップに不安を持つ方は多いのではないでしょうか。株式会社リクルートスタッフィングが運営するITSTAFFINGでは、スキルアップのために努力されている登録スタッフにインタビューをし、普段のお仕事で気を付けていることや、スキルアップのための取組み方について、定期的にご紹介します。

「フリーランスとして年収1000万円」ーーそう聞くと、自分とは遠い世界、たとえば天才的なコードをスラスラ書けるとか、難しい要件のシステムを巧みに設計してしまう、そんな想像をされる方もいるかもしれません。今回お話をうかがった永井充さんは、フリーランスとして年収1000万円を実現しているそう。しかも、かつてITスタッフィングで登録派遣のエンジニアとして活躍していた一人です。現在のポジションをどのように獲得していったのでしょうか。

f:id:itstaffing:20190723111458j:plain

エンジニアへの道で一度挫折を味わう

永井さんは大学の水産学部を卒業。当時は、インターネット環境といえば、せいぜい大学や大企業の汎用コンピュータがつながっているぐらい。そのため、永井さんも学生時代にコンピュータに深く関わったわけではなかった。

しかし就職はソフトウェア開発会社へ。1988年のことである。まだインターネット普及前とはいえ、当時すでにコンピュータ業界は今後普及していく期待の業種だった。

永井さんが担当したのは大手証券会社のシステム開発。ターゲットはメインフレーム(汎用機)で、開発言語はCOBOLやFORTRANという今ではマイナーになってしまった言語。研修でコーディングを覚え、プログラマとして活躍した。

「結局、その会社には10年ほど在籍しましたが、自分にはコーディングは向いていないと感じました。それよりシステム全体を見渡すような上級SEを目指したいと思い、転職に踏み切りました」

転職先は営業が中心のシステム開発会社で、永井さんは客先でPMを担当。時代はちょうどWindows 3.1からWindows 95に移行する時期で、ホストコンピューティングからクライアントサーバ型のシステムへの移行も始まっていた。

「サーバーコンピュータもコンパックやIBMのタワー型筐体で、LANも今のようなTCP/IPではなく、Netware社のプロトコルで接続していた時代です。『ダウンサイジング』というキャッチフレーズが流行り、新たなプロジェクトが、それこそ山のように生まれていきました」

永井さんは同社で15年ほど務めたが、結果、この会社も退職することになる。その理由は、担当した大きなプロジェクトで損失を出してしまったこと。悩んだ挙句に責任をとって退職した。

f:id:itstaffing:20190723111501j:plain

偶然知った派遣という世界が再びエンジニアの道へ

もうエンジニアはこりごりと思い、次に転職したのは外資系保険会社の販売代理店で、職種は営業だった。2011年のことである。

「歩合制なので、売れているうちは収入も大きく伸ばすことができました。最初のうちは、友人や知人を頼って売っていったのですが、次第に手持ちの人脈も尽きてきます。そうなると苦しいですね。しかし、この仕事で、電話や手紙など、人脈構築のために地道な努力をすることを学びました(笑)」

永井さんは、結局、一定の成績を保てず、3年ほどで代理店契約を切られてしまい、無職になった。「奥さんに申し訳ない」という気持ちでいっぱいの永井さんは、警備員のアルバイトをしながらすぐに職探しを始めた。しかし、いくつもの求人に応募し、その都度、面接でスキルや経験を聞かれることの繰り返しが次第に煩わしく感じるようになってきたという。

「そんなとき、知人から聞いた派遣会社のWebページを覗いてみると、いろいろな仕事が豊富にあり、とても驚きました。登録時に自分の職歴やスキルを書いておけば良いのもとても便利でした」

もうこりごりと思ったIT業界だが、20年以上の経験があり、PMまで経験していることは自身の強みと考え、派遣スタッフとして電力系企業や通信キャリア系企業のPMまたはPMOの仕事を選んでいった。

f:id:itstaffing:20190723111504j:plain

自身に対する人件費に見合ったサービスを提供できているか?

その後も、いくつかの派遣先を経験した永井さんだが、2018年に、派遣からフリーランスへの転機となるプロジェクトに携わることになる。

そのプロジェクトとは、派遣先であるITサービス企業でPMOスタッフとして働くというものだった。

「実質PMとして動いていて、主に化粧品通販会社のコンタクトセンターなどを任されました。改修や機能追加などもあり、常にバックログが10件ほど走っていて、収支を考えながら、人員をどのように配置していくかを考えるのが、とても面白い仕事でした」

このようなプロジェクトを任され、収支や人件費について考えることで業務に対する視野が広がり、フリーランスとして働くことを決めた。

しかし、フリーランスになることに不安はなかったのだろうか。よく言われるのは、仕事が無くなったときに困らないかという問題である。

「その点については、常に5社ほどエージェントと連絡を取り続けています。加えて、これまで派遣でお世話になった仕事先のキーパーソンの方々にも。なかには『今の仕事が無くなったらウチに来て』と言ってくださる方もいらっしゃいます」

今の仕事をこなすだけでなく、先を見据えた営業活動も。こうした地道な関係構築は、かつて外資系保険会社の営業をしていた時に身につけたものだそう。

「ちなみに、無職だったときにやっていた警備員のアルバイトですが、今でも週に1回だけやらせてもらっているんです(笑)。休日は人を集めにくいらしく、重宝されています。これも将来、仕事がまったく無くなったときの保険のようなものですね」

f:id:itstaffing:20190723111507j:plain

年収1000万円のフリーランサーからのアドバイス

永井さんにとって、フリーランスになって良かったと感じている部分はどこだろうか。

「たとえば年収1000万円を達成するには、ざっくり時給にして5,600円が必要です。その上で月に160時間、そして12カ月間きっちり働かなければなりません。その点、フリーランスは準委任業務という契約なので、契約次第ですが、月ごとに結果を出せれば時間に縛られることがなく、働き方を自分で調節できます」

実際に、永井さんは、そのときの忙しさに合わせて仕事の時間を月140時間から180時間の間でコントロールしているという。

働き方が調節できて収入も向上する“良いことづくめ”のように見えるフリーランス。永井さんの話を聞いて自分も目指したいと思った方もいるのではないだろうか。そんな方に向けて、永井さんから心強いアドバイスをいただいた。

「私は人より優れたコードが書ける訳でもなく、卓越した設計ができるわけでもありません。PMの経験はありましたが、PMとしての個々のスキルだけなら、自分より上の人は世の中にいくらでもいると思います。そんな人たちと、同じ土俵ではとても戦えません。それならば、どうするか。人が嫌がること、やりたくないと思うことを率先して引き受けるようにしています。たとえば、プロジェクトの進捗管理は、担当者から煙たがられるので、多くのPMが嫌がる業務の一つですが、これもしっかりとやる。PMの仕事だから当たり前と思うかもしれませんが、そこがとても大切です」

f:id:itstaffing:20190723111510j:plain

加えて、永井さんはフリーランスとして活躍するためのポイントとして、きちんと会社に来る、トラブルが発生したときに逃げない、きちんとした恰好をする、の3つを挙げてくれた。「こうした当たり前のことを続けるだけでも大きな武器になる」という。

「フリーランスか派遣社員かというのは契約上の問題に過ぎません。大切なのは周囲の人たちに、いかに気持ち良く仕事をしてもらうかということです。たとえば、トラブルが発生したときに逃げないこと。これは、自分自身が解決に直接役立てなくても構いません。とにかくその場にいることが大切なのです。誰かを手伝えるかもしれないし、チーム一丸となって解決に当たるんだ、というムードをその場に作り出せるかもしれません。何ができるのかではなく、どう動くのかが大切です。きちんと仕事をしていけば、道は必ず開けてきます」

なにが自分の強みなのか、しっかり理解している永井さん。スキルを上げることももちろん大切だが、それとは別に、自分が周囲のためにできることを探してみるのも良いかもしれない。

第2話 ブランチとは?ポインタってどういう意味?作成・確認・切り替え方法【連載】マンガでわかるGit ~コマンド編~

f:id:itstaffing:20190717120313j:plain

Webサービスやアプリ開発の現場では必須のバージョン管理システム「Git(ギット)」。Gitは、専用のソフトを使えばクリックで直感的に操作することもできますが、いざというときにコマンドが使えると便利です。

第1話 では、

$ git init (リポジトリを作る)
$ git status (状況を確認する)
$ git add (ステージする)
$ git commit (コミットする)
$ git log (履歴を見る)

を習得しました。

今回の第2話では、ブランチの概念の理解と、ブランチの作成・確認・切り替えを実践していきます。主人公のわかばちゃんと一緒に、楽しくGitコマンドを学んでいきましょう!

【筆者】湊川 あいさん
【筆者】湊川 あいさん
フリーランスのWebデザイナー・漫画家・イラストレーター。マンガと図解で、技術をわかりやすく伝えることが好き。 著書『わかばちゃんと学ぶ Git使い方入門』『わかばちゃんと学ぶ Googleアナリティクス』『わかばちゃんと学ぶ Webサイト制作の基本』『運用ちゃんと学ぶ システム運用の基本』が発売中のほか、マンガでわかるGit・マンガでわかるDocker・マンガでわかるRuby・マンガでわかるScrapbox・マンガでわかるLINE Clova開発・マンガでわかる衛星データ活用といった分野横断的なコンテンツを展開している。

・Amazon著者ページ
・Twitterアカウント

ブランチとは?ブランチを活用しないとこんなことに

「ブランチとは並行世界である」と例えられることが多いですが、実際の活用場面がわからないとイメージできませんよね。そこで、ブランチを活用しないとき・活用したときの違いをマンガで見てみましょう。

たとえば「Webサービスに新機能を追加してほしい」と言われたとします。

そんなときにブランチを活用せず、本番環境に新機能を直接付けていくと、こんなことになってしまいます。
f:id:itstaffing:20190717120316j:plain

ブランチを活用するとこんなに便利!

では、ブランチを活用するとどうなるでしょうか?
f:id:itstaffing:20190717120319j:plain
「masterブランチ」というのは最初から存在するブランチです。$ git init でリポジトリを作ったときから存在しています。先ほどはmasterブランチひとつしか使っていませんでしたが、この例では「developブランチ」というものを新しく作りました。

複数のブランチを活用すると、本番環境に使われているソースコードに影響を与えず、安心して別のブランチで開発を進めることができます。開発用のブランチのコミットが更新されたら、テスト用URLの内容も自動で更新することも可能です。

新機能が安定し「もう本番に公開しても大丈夫だね」とわかってから、満を持して本番環境にマージ(統合)するというわけです。

「ブランチとはポインタである」ってどういう意味?

せっかくなので、ブランチについてもう一段深く理解してみましょう。

Gitの公式ドキュメント によると

ブランチとは(中略)コミットを指す軽量なポインタに過ぎません

と説明されています。

Gitにおけるポインタとは、具体的にどのようなものなのでしょうか?これを理解していると、今後Gitの概念をより理解しやすくなりますよ。
f:id:itstaffing:20190717120235j:plain

ブランチの正体を解き明かそう

f:id:itstaffing:20190617145538j:plain
え!?
リポジトリの中って入れるの!?
f:id:itstaffing:20190617145541j:plain
もちろん入れるとも。
「.git」という名前の、半透明のフォルダがリポジトリだ。
f:id:itstaffing:20190617145541j:plain
第1話 で作ったlessonファイルを開こう。
こんな状態になっているはずだ。
f:id:itstaffing:20190717120239j:plain
f:id:itstaffing:20190617145541j:plain
さっそくリポジトリの中身を見てみるぞ。
「.git」という名前の、半透明の隠しフォルダがあるな。
こいつがリポジトリだ。ダブルクリックして開いてくれたまえ。
(.gitフォルダが確認できない場合は、隠しファイルの表示設定をONにしましょう)
f:id:itstaffing:20190617145541j:plain
その中にある refs > heads の順にフォルダを開いていくと、masterというファイルがあるはずだ。
これがmasterブランチの正体だ。
さて、このファイルには何が書いてあるだろうか?
テキストエディタで開いてみたまえ。
f:id:itstaffing:20190717120242j:plain
f:id:itstaffing:20190717120247j:plain
f:id:itstaffing:20190617145538j:plain
masterっていうのは、最初からあるブランチの名前だよね!
開いてみると…
アレッ?たったこれだけ?
f:id:itstaffing:20190617145541j:plain
そう、ブランチの中身は驚くほどシンプルなんだ。
f:id:itstaffing:20190617145538j:plain
英数字の羅列が書いてあるけど…
02f11b759bfeb461e117c5da18bb2dcbe06d862a
これは何かの暗号?
f:id:itstaffing:20190617145541j:plain
HAHAHA、この文字列は「コミットID」だ。
「コミットハッシュ値」とも呼ばれているな。
f:id:itstaffing:20190617145535j:plain
そういえば前回、この長~い文字列、見た気がする!
コミットの履歴を見ようと $ git log を実行したときに、コミットメッセージと一緒に表示されてたわ。
f:id:itstaffing:20190617145541j:plain
いかにも。
コミットによって生成されたデータのことを「コミットオブジェクト」と呼ぶ。
Gitはひとつのコミットオブジェクトに対して、40文字のIDを割り当ててくれる。
これがコミットIDだ。
f:id:itstaffing:20190617145535j:plain
ほほう…!?なんだか面白くなってきたぞ。
で、つまりどういうこと?
f:id:itstaffing:20190617145541j:plain
つまり、ブランチは「ただ単に特定のコミットIDを指差しているだけ」なんだ。
f:id:itstaffing:20190717120250j:plain
f:id:itstaffing:20190617145535j:plain
ええ~っ!
拍子抜けするほどカンタンな話じゃん!
f:id:itstaffing:20190717120254j:plain

コミットオブジェクトの中身をのぞいてみよう

コミットが「コミットを指し示している」とはどういうことでしょうか?実際に見てみましょう。

同じ練習用フォルダの中で、もうひとつコミットを作り、コミットログには計2つのコミットがある状態にしてください。操作方法は次の通りです。

1. sample.txtに何かしら変更を加える
2. $ git add sample.txt
3. $ git commit -m “2回目のコミット”
4. $ git log

f:id:itstaffing:20190717120258j:plain

2回目のコミットが記録できましたね。コミット履歴がこのようになっていればOKです。

さて、このとき2回目のコミットオブジェクトには何が記録されているでしょうか?次のコマンドで見てみましょう。

$ git cat-file -p 0e9556

▼ 表示結果:これがコミットオブジェクトだ

treeee290b48b356d721ae54d1edb03993802cc98bad8
parentt02f11b759bfeb461e117c5da18bb2dcbe06d862a
authorrllminatolll<XXX@mail.com>l1562052826 +0900
committerrllminatolll<XXX@mail.com>l1562052826 +0900

「parent」の部分に注目です!02f11b…と書かれています。

f:id:itstaffing:20190617145535j:plain
あっ! このコミットIDは、ひとつ前のものだよね。
2つ目のコミットが、1つ目のコミットを指差してるってワケだ!
▼ 今の状態
f:id:itstaffing:20190717120300j:plain

コミットとコミットを結びつけているのは、このparent(親)の記載です。一番初めのコミットを除き、すべてのコミットオブジェクトには必ずparentが記載されています。

▼ 試しに、一番初めのコミット(イニシャルコミット)のコミットオブジェクトも見てみましょう。記載があるのはtree、author、committerの3つだけ。parentの記載がないのが見てとれます。

$ git cat-file -p 02f11b759

treee4576025551dd04fafbcb36bd7e1e7814018d11ea
authorrllminatolll<XXX@mail.com>11559898094 +0900
committerrllminatolll<XXX@mail.com>11559898094 +0900
 
★コミットIDは何を元に作られているの?

コミットID(コミットハッシュ値)は、実はこのコミットオブジェクトのバイト数と中身を使い、計算されて作られています。よって、コミットした人の名前やコミットした時間、指し示すparent、treeが違えばコミットハッシュ値も違うものになります。

その証拠に、同じ内容をコミットしていても、あなたの練習用リポジトリとわかばちゃんのコミットIDは違うはずです。コミットハッシュ値についてもっと深く知りたい方は、こちらの記事が詳しいのでおすすめです。

▼ Gitのコミットハッシュ値は何を元にどうやって生成されているのか

https://tech.mercari.com/entry/2016/02/08/173000

今存在するブランチを確認しよう

$ git branch

今、存在するブランチの一覧が表示されます。現段階では、masterブランチしかないので、* master と表示されると思います。

ブランチを作ろう

$ git branch [ブランチ名]

新しいブランチを作るコマンドです。$ git branch develop と打ち込みましょう。その後 $ git branch でブランチ一覧を見ると、このように表示されます。

  develop
* master

ちなみにこのアスタリスクマーク「*」は、簡単に言うと「あなたは今そのブランチの中にいますよ」という意味です。

▼ 今の状態
f:id:itstaffing:20190717120304j:plain

任意のブランチへ移動しよう

$ git checkout [ブランチ名]

さて、masterブランチからdevelopブランチに切り替えてみましょう。

$ git checkout develop と打ち込み、その後 $ git branch でブランチ一覧を見ると、今自分はdevelopブランチの中にいることが見てとれます。

▼ 今の状態
f:id:itstaffing:20190717120307j:plain

試しに、developブランチの中にいる状態で、sample.txtに何かしら文字を追加して新たにコミットを作ってみてください。

developブランチの指差しだけが動き、masterは2回目のコミットを指差したままです。こういう仕組みのおかげで、masterブランチに影響を与えることなく、開発用ブランチにコミットを積み重ねていくことができるのです。

▼ 今の状態
f:id:itstaffing:20190717120311j:plain
★知っていると便利! git checkout コマンドの豆知識

「-b」オプション

$ git checkout -b [ブランチ名]


ブランチの作成とチェックアウトを同時に行えます。


「-f」オプション

$ git checkout -f [ブランチ名]


ブランチを強制的に切り替えることができます。
(コミットしていない作業データは消えるので注意)

まとめ

さて、ここまでで、ブランチの概念の習得と合わせて

$ git branch(ブランチを作る)
$ git checkout (チェックアウトする)

が使えるようになりましたね!

Gitにはまだまだたくさんのコマンドがあります。
次回は、ブランチとブランチを併合する「マージ」について解説します!

▼登場キャラクター紹介
f:id:itstaffing:20200122103525j:plain

▼わかばちゃんが登場する書籍

▼ これまでの「マンガでわかるGit」

【イベントレポート】プログラミング未経験者でもできる!動かして学ぶRPA超入門ハンズオン

株式会社リクルートスタッフィングが運営するITSTAFFINGでは、弊社に派遣登録いただいている皆さまのスキル向上を支援するイベントを、定期的に開催しています。

2019年5月24日のイベントでは「プログラミング未経験者でもできる!動かして学ぶRPA超入門ハンズオン」と題し、株式会社完全自動化研究所の代表であり、RPAについての書籍も執筆する小佐井 宏之さんを講師にお招きし、RPAについて教えていただきました。今回のイベントは、実際に手を動かすハンズオン形式。参加者は各自ノートPCを持ち込んで学ばれました。

■今回のイベントのポイント
・RPAとは?
・簡単なロボットを作ってみよう
・RPAツール「SikuliX」のテクニック

【講師プロフィール】
小佐井 宏之さん
エンジニア。株式会社完全自動化研究所代表取締役社長。京都工芸繊維大学造形工学専攻修士課程修了。大学院まで現代アートやデザインを勉強していたが、客先常駐のプログラマとしてIT業界に飛び込み、現場でプログラムやシステム開発を身に付ける。2010年フリーランスとして独立し、2016年RPAと出会う。2017年に起業し、2018年に書籍「オープンソースで作る!RPAシステム開発入門」(翔泳社)を上梓。執筆・講演の傍ら、顧客企業内の業務自動化をサポートしている。

RPAとは?

RPA(Robotic Process Automation)とは、コンピュータにできることはコンピュータにさせるということ。人員不足や働き方改革が叫ばれる今、注目されているテーマでもあります。

f:id:itstaffing:20190708111732j:plain

▲RPAが注目される理由は大きく3つ。システムが乱立している環境下で、異なるシステム間のつなぎ業務を行うというニーズもある

RPAツールには、実行環境と認識タイプにそれぞれの種類があるそうです。今回のイベントで使われた「SikuliX」は、デスクトップ型、画像認識型に分類されます。

SikuliXは、Windows上で動作し、無料で使えるアプリケーションで、人の目のように画像を認識し、人の手のようにマウスやキーボードを動かしてくれます。また、条件に応じた操作や、繰り返しなどの処理は、プログラミング言語のPythonを使うことで対応できます。

RPAツールを使って簡単なロボットを作ってみよう

まずは簡単なロボットを作ってみます。今回作るロボットの作業は次のようなもの。

f:id:itstaffing:20190708111736j:plain

▲デスクトップ上のテキストファイルを開き、文字列を書き加え、別名で保存し、メモ帳を終了させる

SikuliXでは条件分岐、繰り返しなどの複雑な処理も行えますが、今回は順次処理のみを使います。

作業登録の準備として、事前にデスクトップに「hello.txt」という名前のファイルを作成。中身は何も入力されていない空の状態です。

次に具体的な作業手順を登録していきます。手順は、小佐井さんのとても分かりやすいスライドがあったため、参加者の皆さんも戸惑うことはありませんでした。

ポイントは、あらかじめSikuliX以外のウィンドウを最小化にしておくなど、登録作業がスムーズに行えるのと同時に、SikuliXが画面認識を間違えないようにしておくことだそうです。

f:id:itstaffing:20190708111739j:plain

▲コマンドリストの「マウスの動作」から「doubleClick()」をクリックする。すると、SikuliXのウィンドウが最小化され、デスクトップが表示される。この状態をキャプチャーモードと呼ぶ

キャプチャーモードの状態から、マウスでhello.txtのアイコンを範囲指定の要領で囲んで、クリックをします。アイコンを囲むのに失敗したら、ソースコードウィンドウに記述されたコードを削除して、やり直します。

成功したら、SikuliXの「実行」ボタンをクリック。hello.txtのアイコンがダブルクリックされ、メモ帳が立ち上がればOK。うまくいけば、テキストを入力する部分をプログラミングします。

SikuliXのソースコードウィンドウに次のプログラムを追加します。

sleep(3)
type("Hello")
sleep(3)

sleep(3)は3秒待つための命令で、ウィンドウが開く前にテキスト入力してしまうのを避けるためのものだそうです。

f:id:itstaffing:20190708111724j:plain

▲SikuliXでは、画面キャプチャーと、プログラムコードの記述で、作業を登録していく

次に名前を付けて保存する作業を登録します。

SikuliXのコマンドから「click()」を選択し、キャプチャーモードで、メモ帳の「ファイル」メニューを選択。これで「ファイル」メニューをクリックするところは登録できました。

問題は次です。キャプチャーモードにしてから、「ファイル」メニューを開き、一覧から「名前を付けて保存」を選択するのですが、どうしても間に合いません。

そんなときは、SikuliXの「ファイル」メニューから「環境設定」をクリックし、「環境設定」ダイアログボックスで「キャプチャーを実行するまでの時間」を1秒から3秒に変更します。

f:id:itstaffing:20190708111727j:plain

▲キャプチャーモードに移行するまでの時間を調整できる(スライド右下の囲み)

「名前を付けて保存」の選択ができたら、ファイル名を入力させます。

「ファイル名を付けて保存」のダイアログボックスは、表示されたとき、ファイル名を入力するテキストボックスの文字列が選択されている状態。なので、そのまま新しいファイル名を入力します。

そこで、SikuliXのソースコードウィンドウに、

type("hello2.txt")

と入力します。

今回のイベントでは作業を進めるため、実際の「ファイル名を付けて保存」のダイアログボックスの方にも、人間の手でファイル名を入力。

次に、「click()」でキャプチャーモードにして、ダイアログボックスの「保存」ボタンを選択します。

この後、実際のメモ帳の方は保存ぜず、操作をキャンセルし、メモ帳の画面に戻ります。こうしておかなければHello2.txtが作られ、SikuliXに作業をさせるとき、既にファイルが存在する旨の警告メッセージが表示されてしまい、手順通りに進まなくなってしまうからです。

そして最後にメモ帳を終了させます。ウィンドウを閉じるには、ウィンドウ右上の「×」(閉じる)ボタンをクリックする、F4キーのショートカットを使う、「ファイル」メニューから「終了」を選ぶなど、複数の異なる方法があります。今回は「ファイル」メニューから「終了」を選びます。手順は「名前を付けて保存」のときと同じです。

以上でSikuliXへの登録作業はおしまい。実際に、SikuliXの「実行」ボタンをクリックしてみると、あっと言う間に、メモ帳が勝手に立ち上がり、文字列が入力され、勝手に新しいファイルに保存され、メモ帳が終了。参加者の皆さんは、感動されていたのと同時に驚かれていました。

SikuliXのテクニック

基本的な操作が理解できたところで、小佐井さんがSikuliXのちょっとしたテクニックをいくつか教えてくださいました。

■ターゲットオフセット
Webのログイン画面などで、IDとパスワードを入力するテキストボックスが同じように並んでいる場合に、それぞれの入力で、テキストボックスを画像として指定しても、それがIDなのか、パスワードなのか、SikuliXには区別がつきません。

そのままだと、先に一致したIDのテキストボックスにパスワードを入力してしまうといったミスが起きてしまう可能性もあります。

これを解決するのが「ターゲットオフセット」という機能で、テキストボックスのタイトル文字列などで位置を特定しておき、そこからオフセットさせたテキストボックスに文字を入力させることができます。

f:id:itstaffing:20190708111729j:plain

▲type(カメラマーク, text)コマンドを使うと、見出しなどを選択し、そこからさらにオフセット位置を指定したテキストボックスに文字を入力できる

■Region
指定した画面領域の中から画像を探させる「Region」という機能もあります。こちらは、異なる複数の領域に同じ画像がある場合も特定できるように、画面内の絶対座標で定められた領域内で判断しています。ただし、絶対座標で画像を探すため、ウィンドウの最大化や、表示位置の変更で、正しく認識できないこともあるそうです。

イベントの最後には小佐井さんが、WebブラウザからIDとパスワードを入力してシステムにログインをしたあと、特定の期間の売上データをダウンロードして保存するという、本格的なロボットのデモを披露。毎日、あるいは毎週の売上をダウンロードして保存するなどといった「定型業務」をこのような形で自動化できたら便利ですね。

【イベントレポート】サーバーから見るシステムとITの動向~システム開発未経験者でもOK!~

株式会社リクルートスタッフィングが運営するITSTAFFINGでは、弊社に派遣登録いただいている皆さまのスキル向上を支援するイベントを、定期的に開催しています。

2019年5月10日のイベントでは「サーバーから見るシステムとITの動向~システム開発未経験者でもOK!~」と題して、書籍『図解まるわかり サーバーのしくみ』の著者である西村泰洋氏を講師にお迎えし、サーバーの基本から話題のAIやIoT、RPAといったシステムについても、サーバーからの視点で解説していただきました。

※本レポートで使用する図版は、西村さんの著書『図解まるわかり サーバーのしくみ』より抜粋しております。

■今回のイベントのポイント
・企業や団体で稼働しているシステムについて
・サーバーの基本
・話題のAI、IoT、RPAなどのシステムとしての実態

【講師プロフィール】
西村 泰洋さん
富士通株式会社フィールド・イノベーション本部 金融FI統括部長。デジタル技術を中心にさまざまなシステムと関連するビジネスに携わる。著書に『図解まるわかり サーバーのしくみ』『絵で見てわかるRPAの仕組み』『RFID+ICタグ システム導入・構築 標準講座』(以上、翔泳社)『デジタル化の教科書』『図解入門 最新 RPAがよ~くわかる本』(以上、秀和システム)『成功する企業提携』(NTT出版)がある。

企業や団体で稼働しているシステム

今回のイベントは「サーバーのしくみ」と「エンジニアのキャリア」という2つのテーマを巧みに組み合わせた構成でした。今回のレポートでは「サーバーのしくみ」を中心にお伝えします。

今やインターネットサービスで多数のサーバーが使われていますが、台数から言えば、組織や団体内で日々の業務を支えているものが圧倒的な多数を占めています。

そこで、まずは組織内の典型的なサーバー構成を見てみることに。

f:id:itstaffing:20190627111430j:plain
▲「進んだ企業」の業務システム例。一部オンプレミスのシステムが残るものの、かなりの部分はクラウド化されている(P221)

最初は「進んでいる企業」(西村さん)のケース。この企業では200を超えるシステムが稼働しており、多くのシステムはクラウドに置かれ、ERPは、まだクラウドに移行されておらず、オンプレミスのサーバー上で運用されています。各部署では部内ファイルサーバーなどが運用されているケースも、実際の現場でよく見受けられます。

一方で、比較的規模の小さな組織では、ほぼオンプレミスで構成されています。

f:id:itstaffing:20190627111432j:plain
▲別の企業の業務システム例。オンプレミスのサーバー上でシステムを利用している(P223)

企業によっては、一度作ったシステムをできるだけ長く使おうとする傾向にあり、IT投資の割合が大きくありません。エンジニアから見ると寂しい限りですが、西村さん曰く「意外と、こういう会社のほうが儲かっていたりする」のだそうです。

続いて、これらのサーバーに関する基礎知識について解説してくださいました。

サーバーの基本

まずは企業や団体で使われている業務システムのサーバーについて、基本形から学んでいきます。

業務システムにおいて重要なのはユーザーが入力する「データ」。そのため多くの業務システムは、データベースサーバーとシステム規模が大きくなる場合にはアプリケーションサーバーという2つで構成されています。

f:id:itstaffing:20190627111435j:plain
▲業務システムに限らず、インターネット上でさまざまなサービスを提供するサーバーにおいても、データベースとアプリケーションサーバーで構成されることが多くなっている(P103)

この後、サーバーのハードウェアについてや、ファイルサーバー、プリントサーバー、メールサーバー、Webサーバー、DNSサーバー、プロキシサーバーといった各種サーバーについて、そしてインターネットの基本的な仕組みについても解説がありました。

話題のAI、IoT、RPAなどのシステムとしての実態

この中で、クライアントサーバー型のシステム構成に対して、サーバーから命令や指示を出し、配下のコンピュータおよびデバイスに処理をさせる「サーバーからの処理」に興味をひかれました。具体的には、運用監視、RPA(Robotic Process Automation)、IoT(Internet of Things)、BPMS(Business Process Management System)などだそうです。

RPAは、事務処理を自動化するためのソフトウェアで、単体のデスクトップPC上の操作を自動化するものもありますが、サーバーからの処理で複数のデスクトップPC上の操作を統合して、処理を大幅に効率化するものもあるそうです。

f:id:itstaffing:20190627111438j:plain
▲RPAでは、サーバーのなかに仮想化された複数のロボットファイルと実行環境を備えて、デスクトップがそれらを取得して実行することで、複数のデスクトップPCの操作を統合し、処理を大幅に効率化するものもある(P139)

西村さんによれば、「近年、BPMSとの連携が増えている」とのこと。BPMはその名の通り業務プロセスの管理なのですが、各種のシステムを連動しながら、業務プロセスを見える化し、PDCAサイクルを用いて、業務プロセスを改善・効率化していくものだそうです。

また「IoTには手を出すな」という話も興味深いお話でした。IoTは、(ハードウェアなどの)素の性能がきちんと分かっていないと、システムの効果を見積もれないという難しさがあるそうです。西村さんの経験談として「東京で実績のあるICタグのシステムを北海道に展開したときに、大雪が原因でタグが読めなくなるという不具合」が実際にあったそうです。システムの開発・構築時に、大雪を想定できるかどうかは、なかなか難しそうです。

不正アクセスやデータ漏洩に対するセキュリティについてもお話がありました。冒頭にお話があったように、業務システムにおいて大切なのはデータです。これを勝手に持ち出されないよう、暗号化通信やファイアウォール、DMZ設置などの外部からの不正アクセス対策に加え、ユーザーグループの設定やアクセス権の制限など、組織内部からの不正アクセス防止も忘れてはなりません。運用レベルでも、きちんと考える必要があるそうです。

f:id:itstaffing:20190627111440j:plain
▲不正アクセスは外部だけでなく、内部からもあり得る。アクセス権の設定なども含め、運用レベルでのセキュリティ対策も忘れてはならない(P153)

今回のイベントでは、こうしたサーバーの解説と並行して、エンジニアとしてのキャリア形成や技術スキルの向上などについても、さまざまなアドバイスがありました。ソフトウェア開発エンジニアだから、フロントエンジニアだから、サーバーやネットワークのことは知らなくても良いということはなく、こうした基本的な知識は、しっかりと備えておくべきだと再認識した内容でした。

第1話 リポジトリを作ってコミットしてみよう【連載】マンガでわかるGit ~コマンド編~

f:id:itstaffing:20190617145602j:plain

Webサービスやアプリ開発の現場では必須のバージョン管理システム「Git(ギット)」。4月のイベントでは、Gitの基礎の基礎をお伝えしましたが、この連載コラムでは、「Git コマンド編」をマンガで解説します。

Gitは、専用のソフトを使えばクリックで直感的に操作することもできますが、いざというときにコマンドが使えると便利です。今回は、ある程度のGUIでならGitは使えるけれど、コマンド操作は苦手という方のために、主人公のわかばちゃんがカンタンなGitコマンドを実践していきます。みなさんも一緒に操作してみましょう!

【筆者】湊川 あいさん
【筆者】湊川 あいさん
フリーランスのWebデザイナー・漫画家・イラストレーター。マンガと図解で、技術をわかりやすく伝えることが好き。 著書『わかばちゃんと学ぶ Git使い方入門』『わかばちゃんと学ぶ Googleアナリティクス』『わかばちゃんと学ぶ Webサイト制作の基本』『運用ちゃんと学ぶ システム運用の基本』が発売中のほか、マンガでわかるGit・マンガでわかるDocker・マンガでわかるRuby・マンガでわかるScrapbox・マンガでわかるLINE Clova開発・マンガでわかる衛星データ活用といった分野横断的なコンテンツを展開している。千代田まどかさんとのコラボレーション企画をTECH PLAY Magazineで連載中。

・Amazon著者ページ
・Twitterアカウント
 
f:id:itstaffing:20190617145606j:plain

GUIとCLIの違い

みなさんが普段パソコンを操作するとき、どのように操作していますか?マウスやタッチパッドを使って、デスクトップのアイコンをクリックしたり、ファイルをドラッグしてゴミ箱に捨てたりしていると思います。これがGUI(グラフィカルユーザーインタフェース)です。

対して、キーボードのみを使ってOSに命令を送り、パソコンを操作するのがCLI(コマンドラインインターフェース)です。プログラマが使っている「黒い画面」と言えばイメージが付きやすいでしょうか。

▼CLIの例:ターミナル(Windowsだとコマンドプロンプトという名前)
f:id:itstaffing:20190617145611j:plain

もともと、初期のコンピュータは、キーボードからコマンドを打ち込んで操作するものでした。1980年以降、コンピュータの処理性能が上がったことによって、直感的に操作できるGUIが普及し始めたのです。

Gitも本来はCLIで操作するものですが、普及に伴って、コマンドを打ち込まずともクリックで操作できるGUIソフトが登場してきました。SourceTree(ソースツリー)やGitKraken(ギットクラーケン)、GitHub Desktop(ギットハブデスクトップ)などです。

▼GUIの例:SourceTreeの操作画面
f:id:itstaffing:20190617145613j:plain

これだけを聞くと「操作しやすいGUIがあるなら、わざわざ玄人向けのCLIを使う必要はないじゃない」と思うかもしれません。ところがCLIには様々なメリットがあるのです。

CLIのメリット

たとえば、今から新規リポジトリを作るとしましょう。

GUIの場合、ソフトを立ち上げてから「新規リポジトリ → ローカルリポジトリを作成」の順にクリックする必要があります。

対して、CLIならこう打つだけです。

$ git init

これだけで新規リポジトリができてしまいます。
どうですか?簡単でしょう。

単に操作がシンプルになるだけではありません。CLIにしかできない操作もあります。GUIは初心者でも使いやすいことを目的として作られているため、基本的な操作はできるものの、一部削ぎ落とされている機能があるからです。

いざというとき便利なコマンド、かゆいところに手が届くコマンドがGitにはたくさんあります。この連載でひとつずつ知っていくことで、「pushできなくなった」「マージしていないブランチを間違って消してしまった」といった問題が起きても、すぐ対処できるようになります。きっとあなたもGitをもっと好きになることでしょう。

CLIを使ってみよう

f:id:itstaffing:20190617145541j:plain
ではさっそく、CLIの画面を出してみたまえ。
Macの場合:
MacのCLIは「ターミナル」と呼ばれているぞ。Launchpadの「その他」から選んでクリックします。もしくは[Control] + [スペース]キーを同時に押して、「terminal」と入力、検索すると出てきます。
f:id:itstaffing:20190617145617j:plain

Windowsの場合:
Windowsでは「コマンドプロンプト」と呼ばれています。
[スタートボタン] > [すべてのプログラム] > [アクセサリ] > [コマンドプロンプト] をクリックすると立ち上がります。

Gitがインストール済みか確認しよう

$ git --version

と入力して、
git version 2.19.0

のように出てくればインストール済みです。次に進みましょう。

f:id:itstaffing:20190617145622j:plain

インストールがまだの方は、Git公式ドキュメントのGitのインストールの手順を実行するか、SourceTreeをインストールしてください。SourceTreeのパッケージの中にGitも含まれています。

コマンドでGitを使ってみよう

基本的なコマンド

f:id:itstaffing:20190617145541j:plain
まずは、もとからパソコンに入っている基本的なコマンドを使ってCLIに慣れてみよう。「pwd」と打ち込んでエンターを押したまえ。あぁ、先頭の$マークは打たなくていいぞ。
$ pwd
f:id:itstaffing:20190617145538j:plain
たった3文字でいいんですか?pwd エンターっと…
$ pwd

/Users/wakaba
f:id:itstaffing:20190617145535j:plain
おお!?なんか文字が出てきた!
f:id:itstaffing:20190617145541j:plain
これが、君が今いるディレクトリ(階層)だ。 ディレクトリはわかるな?
f:id:itstaffing:20190617145535j:plain
フォルダ構成みたいな感じだよね。今私は、Usersというフォルダの中の、wakabaというフォルダにいるってワケだ。
f:id:itstaffing:20190617145541j:plain
その通り。pwdというのは「Print Working Directory」の略なんだ。今どこにいるか表示して」という意味だな。
f:id:itstaffing:20190617145541j:plain
お次は「ls」とだけ打ち込んでみたまえ。(Windowsコマンドプロンプトの場合は「dir」)
$ ls

Desktop

Documents

Downloads

Library

Movies

Music

Pictures

Public

……
f:id:itstaffing:20190617145541j:plain
お見事!今自分がいるディレクトリの直下にあるものが表示されたな。ちなみにlsはList Segmentsの略だ。
f:id:itstaffing:20190617145541j:plain
今表示された中にあった「Desktop」という場所に移動してみようか。 「cd」というコマンドに続けて、移動したいディレクトリ名を打つと、その階層に行けるぞ。
$ cd Desktop
f:id:itstaffing:20190617145538j:plain
「cd」はなんの略なの?
f:id:itstaffing:20190617145541j:plain
Change Directoryの略だ。覚えやすいだろう。
ディレクトリ(フォルダ)を作ろう

f:id:itstaffing:20190617145541j:plain
デスクトップに移動したところで、Git練習用のディレクトリ(フォルダ)を作ろう。「mkdir」に続けて、希望のディレクトリ名を打ち込んでエンターだ。
f:id:itstaffing:20190617145535j:plain
じゃあlessonっていう名前にしたいわ。
$ mkdir lesson
f:id:itstaffing:20190617145624j:plain

f:id:itstaffing:20190617145535j:plain
わぁ、デスクトップにlessonっていうディレクトリが爆誕したよ!いつもクリックでやっている作業が、短い文字を打つだけでどんどんできていく!スゴイ!
リポジトリを作ろう

f:id:itstaffing:20190617145541j:plain
さて、いよいよGitコマンドを使っていくぞ。Gitコマンドは先頭に「git」をつけるのが特徴だ。

▼lessonディレクトリに移動して
$ cd lesson
▼リポジトリを作る
$ git init
すると……
f:id:itstaffing:20190617145628j:plain

たったこれだけでリポジトリができました!

f:id:itstaffing:20190617145535j:plain
そうそう、.gitっていう隠しファイルがGitリポジトリの証なんだよね。
サンプルファイルを作ろう

f:id:itstaffing:20190617145535j:plain
リポジトリを作ったはいいけど、lessonディレクトリにはまだ何もファイルがないや。テキストエディタを開いて、適当なファイルを作ろうかな。
f:id:itstaffing:20190617145541j:plain
おっと!せっかくならテキストファイルもコマンドで作ってみようか。

$ echo “Hello Git” > sample.txt
f:id:itstaffing:20190617145632j:plain
 
f:id:itstaffing:20190617145634j:plain
f:id:itstaffing:20190617145535j:plain
わわっ!ファイルが作成されて、しかも内容も入力されてる!CLIってなかなかやるじゃん!
ステージングエリアに乗せてコミットしよう

f:id:itstaffing:20190617145541j:plain
じゃあ、今作ったsample.txtをリポジトリに記録しよう。まずは git status コマンドを使って、作業ディレクトリの状態を確認するんだ。
$ git status
f:id:itstaffing:20190617145638j:plain
赤文字で表示されているのは、まだステージングエリアに乗せられていないファイルです。

f:id:itstaffing:20190617145641j:plain
では、sample.txtをステージングエリアの上に乗せてあげましょう。

f:id:itstaffing:20190617145538j:plain
私がいつも使ってるGUIでは、チェックマークを入れてステージングエリアに乗せてるけど、コマンドではどうやるんだろう?
f:id:itstaffing:20190617145541j:plain
あれは、裏で git add コマンドを実行しているだけだ。ステージングエリアに乗せたいファイルの名前を git add に続けて打ち込みたまえ。

$ git add [ファイル名]
f:id:itstaffing:20190617145538j:plain
git add sample.txt っと。……ん?しかし何も起こらないけど……?
f:id:itstaffing:20190617145541j:plain
git status で、もう一度状態を確認してみるのだ。
$ git status
f:id:itstaffing:20190617145644j:plain

f:id:itstaffing:20190617145535j:plain
おや?さっき赤文字だったファイル名が、緑色になってる!
f:id:itstaffing:20190617145647j:plain
f:id:itstaffing:20190617145541j:plain

その通り!緑色になっているファイルは「今ステージングエリアの上に乗っていて、コミット待ちですよ~」ということを示している。
f:id:itstaffing:20190617145541j:plain
最後に、いよいよコミットしてみよう。コミットは、撮影台(=ステージングエリア)に乗っているものをパシャッとカメラで撮って、アルバム(=リポジトリ)に記録するイメージだ。
f:id:itstaffing:20190617145650j:plain
$ git commit -m “ここにコミットメッセージを書く”
 
f:id:itstaffing:20190617145535j:plain
コミットメッセージは -m の後ろにダブルクォーテーションで囲って書くんだね。$ git commit -m “はじめてのコミット” っと…

コミットログ(履歴)を見てみよう

f:id:itstaffing:20190617145541j:plain
よし!では、ちゃんとコミットされたか確認してみよう。
$ git log
f:id:itstaffing:20190617145653j:plain

f:id:itstaffing:20190617145535j:plain
おおーっ!ちゃんとコミットした人・時間・メッセージが記録されてる!
f:id:itstaffing:20190617145538j:plain
履歴を見れたはいいけど… これ、履歴が多くなってきた場合は一番古いコミットログにたどり着くまで終われないよ!閲覧を終わらせるにはどーしたらいいの!?
f:id:itstaffing:20190617145541j:plain
アルファベットの「q」を押すんだ!Quit(辞めるという意味)の「q」だと覚えよう。
f:id:itstaffing:20190617145541j:plain
ちなみに、--graph というオプションをつけて実行すると、コミットログをアスキーアートでカラフルに表示してくれるぞ。今はまだコミットをひとつしか記録していないから、代わり映えがしないと思うが、たくさんブランチがあるリポジトリでやってみるとおもしろいだろう。
$ git log --graph
▼CLIで見た場合のコミットグラフ
f:id:itstaffing:20190617145655j:plain

コミットグラフを見るときはGUIの方が見やすいので、操作はCLIで行って、確認用にGUIを横に置いて作業する人もいます。
このあたりはいろいろ試しながらやってみて、あなたがやりやすい方法を選んでくださいね。

▼SourceTreeで見た場合のコミットグラフ
f:id:itstaffing:20190617145555j:plain

 
★魔王教授 本日の豆知識

f:id:itstaffing:20190617145541j:plain
CLIで「↑」キーを押せば、最近自分が打ちこんだコマンドを再利用できて便利だぞ!
▼上下キーで使いたいコマンドを選び、エンターで実行できる
f:id:itstaffing:20190617145558g:plain

まとめ

さて、ここまでで

$ git init (リポジトリを作る)

$ git status (状況を確認する)

$ git add (ステージする)

$ git commit (コミットする)

$ git log (履歴を見る)

が使えるようになりましたね!

Gitにはまだまだたくさんのコマンドがあります。次回は、さらに役立つGitコマンドも登場。わかばちゃんと一緒に学んでいきましょう!

▼登場キャラクター紹介
f:id:itstaffing:20200122103525j:plain

▼わかばちゃんが登場する書籍

▼ これまでの「マンガでわかるGit」