このリポジトリは、電気通信大学MMAが2014年に開催するRubyプログラミングワークショップで使用した資料及びプログラムを公開するためのリポジトリです。
このテキストでは、Rubyワークショップで行ったことと、それに関連する文書及びプログラムを示します。
以下の資料は、学内から作業を行うことを前提に記述されています。学外からの場合、proxyを通さないような設定に切り替える必要があります。
Linuxのデスクトップの右上に表示されている自分のIDをクリックし、「システム設定」をクリックします。
システム設定のウィンドウが開くので、「ネットワーク」をクリックします。
「ネットワークプロキシ」をクリックすると、proxyの設定が開くので、「なし」に切り替えます。
またgitを使う場合は、gitのプロキシ設定を切る必要があります。gitのプロキシ設定を切るためには、以下のコマンドを実行します。
git config --global --unset http.proxy
git config --global --unset http.proxy
もちろん学内からの場合は、proxy設定を再び有効にする必要があります。
- プログラマに必要な3つのものを紹介しました
- ワークショップの目的と方針を紹介しました
- 講習会ではなくワークショップであること、自発的な参加を歓迎することを伝えました
- 参加登録でのアンケート結果を紹介しました
- Rubyの紹介をしました
Virtual Boxは、コンピュータ上に仮想的にコンピュータを再現することができるソフトウェアです。今回はこれを用いて、皆さんのPCの上にLinuxを新たにインストールすることにします。
Linuxには様々な種類がありますが、今回インストールするLinuxとしてはDebianを選択しました。
Rubyの最新バージョンは(2014/5/19現在)2.1.2ですが、Debianの初期状態でインストール可能な最新バージョンであるRuby1.9.3をとりあえずインストールします。
ソフトウェア開発の例として、主催らが24時間で開発したスマホアプリ連携型Webサービスを紹介しました。
Rubyでの最初のプログラムとして、1+1の結果を出力するプログラムを作成し、動くことを確認しました。
- チューリングマシン、チューリング完全、構造化定理の話をしました。
- 機械語とアセンブリ、そしてより高度なプログラミング言語との関連の話をしました。
rbenvは、複数のバージョンのRubyを簡単に切り替えることができるツールです。
- putsとgets
- 変数
- 配列
- eachを使った繰り返し についてプログラムを触りながら学びました。
putsは、文字列を画面に出力をするための命令です。文字列とは、文字が並んでいるようなデータのことを指します。文字列は文字の並びを''や""で囲んで表します。
'hogehoge'
'まさわだ'
putsは、以下のようにして使います。
puts 'hogehoge'
上のプログラムを実行すると、「hogehoge」という文字列が表示されます。
getsは、逆にキーボードから入力された文字列を得る命令です。 getsは、以下のようにして使います。
a = gets
aとgetsの間にある等号は、右側の結果に左側に書かれている名前を対応付けるという意味です。つまり、「getsの結果にaという名前をつける」ということを表します。aのことを「変数」と言います。変数とデータの間に対応付けを行うことを、「代入」といいます。この場合、「aにgetsの結果を代入した」といえます。
多くのデータを扱うとき、変数がたくさん並んでいるような構造を取りあつかえると便利なことがあります。Rubyではそのような構造を「配列」と呼んでいて、利用することができます。配列は次のようにして使います。
a = [1, 2, 3]
上の例は、「aという変数に1,2,3という配列を代入した」状態を表しています。1の入った変数、2の入った変数、3の入った変数が順番に並んでいるようなイメージです。これらのデータには、前から順番に0番目、1番目、2番目と番号がついています。この番号を使って、配列に中にはいっているデータを取り出すことができます。
a[0]
a[1]
上のように書くと、それぞれ1と2という結果が得られます。
配列に入っているそれぞれのデータを、「要素」といいます。
配列の要素を順々に取り出して、それぞれについて処理を行いたいということがあります。例えば配列の要素を取り出してputsで出力するといったことです。このような処理を簡単に書けるようにするため、Rubyにはeachというものが用意されています。
a = [1, 2, 3]
a.each do |i|
puts a
end
上のプログラムは、eachを用いた例です。eachを用いると、後ろのdo〜endのプログラムが繰り返し実行されます。この時配列の要素が順々に取り出されて|で囲まれた変数に代入されます。つまり、上のプログラムを実行すると、次の結果が得られます。
1
2
3
Rubyの基礎の学習の続きを行いました。
配列は、番号を使ってデータを取り出すようなデータ構造でしたが、単なる番号ではなく、もう少しわかりやすい文字列で示された目印を使える配列があると便利そうです。そのような構造として、ハッシュというものが用意されています。
a = {:name => "alstamber", :age => 22}
上のプログラムが、ハッシュの利用例です。このハッシュは、次のように利用できます。
a[:name]
上のプログラムを実行すると、alstamberという文字列が得られます。
あらゆるプログラムの流れは、単純な上から下への実行、繰り返し、条件分岐の3つで書くことができます。単純な実行と繰り返しは、すでにやりました。あとは条件分岐のみです。条件分岐とは、ある条件を満たしている時のみ、予め決められたプログラムを実行するという処理の流れです。
Rubyでの条件分岐は、if式というものを用いて書きます。
if a == 1 then
puts "a is 1"
end
上のプログラムは、a == 1という条件を満たしていれば、puts "a is 1"という部分を実行するというプログラムです。==は左と右にあるものが等しいことを表すものです。
if a == 1 then
puts "a is 1"
else
puts "a is not 1"
end
elseを使うと、条件を満たしていなかった時の処理を記述することもできます。
変数や配列、ハッシュは、データに名前をつけるためのものでしたが、あるひとかたまりの処理に名前を付けたい時もあります。例えば、次のようなプログラムを考えます。
a = "abc"
hoge(a)
fuga(a)
puts a
puts "-----"
a = "def"
hoge(a)
fuga(a)
puts a
ここでhoge、fuga、puts aというものが2回現れていることがわかります。2回ぐらいならコピペで何とかなりそうですが、これが何度も何度も出てくるようなときにいちいちこの3つを書くのは面倒臭いでしょう。そこで、この3つにまとめて名前をつけることにします。
def func(a)
hoge(a)
fuga(a)
puts a
end
aa = "abc"
func(aa)
このプログラムで、defからendの部分が、処理に名前をつけている部分で、その後ろの2行が、実際にその処理を利用している部分です。func(aa)というプログラムを実行すると、def func(a)のaの部分がaaと置き換えられます。つまり上のプログラムは、次のように書いたのと同じです。
aa = "abc"
hoge(aa)
fuga(aa)
puts aa
このプログラムを使うと、最初に提示したプログラムは、次のように書き換えられます。
a = "abc"
func(a)
puts "-----"
a = "def"
func(a)
Markdownは、見出しなどの構造を持った文書を手軽に記述することができる言語です。 Daring Fireball: Markdown
また、HTMLは、Webページの構造を記述するために用いられている言語です。Webブラウザは、HTMLを読み込んできて、その構造を解析し、その構造を表現するように視覚的に画面に表示しています。
典型的なHTMLで書かれた文書を以下に示します。
<html>
<head>
<title>タイトル</title>
</head>
<body>
<p>
ああああ
</p>
</body>
</html>
<>で囲まれた部分をタグといいます。タグは開始タグと終了タグの組になっています。上の例の場合、<title>のようなものが開始タグで、</title>のようなものが終了タグです。開始タグと終了タグで挟まれた部分が、そのタグの内容になります。titleタグのように普通の文字列を内容として持つタグもありますし、headやbodyのように、一般に更に別のタグを内容として持つタグもあります。
タグをディレクトリ、タグが持つ別のタグを子ディレクトリ、タグが持つ普通の文字列をファイルに例えれば、HTMLの構造はUNIXのディレクトリ構造とそっくりです。ルートディレクトリに相当する場所が、htmlタグです。このような構造を木構造といいます。植物の木をひっくり返した時の構造にそっくりだからです。
世の中にはたくさんのRubyプログラムが存在しますが、これらには共通する処理というものがよくみられます。このような処理は、いちいち手で一から書くのではなく、予め用意しておいたプログラムを読み込んできて利用するようにするのが便利です。なぜなら、一度そういうプログラムを作っておけば、それを読み込むだけでそういった処理ができるようになり、プログラムの手間が省けますし、また無用なミスを減らすことができるからです。このようなプログラムのことを、ライブラリと呼びます。本当に頻繁に使われる処理(日付データを処理するなど)については、Rubyに標準でライブラリが用意されていて、それを読み込む命令を記述するだけで、利用できるようになっています。しかし、Rubyに標準では備わっていないけども、それなりの頻度で行われる処理というのもあります。例えば、あるURLからファイルを読み込んでくるという処理などが良い例です。こういった処理については、有志が作成しインターネット上に公開しているライブラリをダウンロードしてきて、読みこむようにすることで、一から開発する手間を省けることがあります。
Rubyには、有志がインターネット上にそうしたプログラムを公開する仕組みが用意されています。この仕組みをgemとよんでいます。Rubyをインストールすると、同時にgemというコマンドが使えるようになります。
gem install <gem名>
とすれば、指定した名前のgemをインストールすることができます。インストールしたgemは、Rubyプログラムの先頭に
require 'gem名'
と書くことで、読み込んで利用することができます。
Rdiscountは、MarkdownをHTMLに変化したりする機能を提供するgemです。
gem install rdiscount
とすることで、Rdiscountをインストールできます。
require 'rdiscount' # Rdiscountを読み込んでいる
f = open('hoge.md') # openというメソッドを用いて、hoge.mdというファイルを開いている
text = f.read # 開いたファイルをtextという変数に読み込んで代入している
f.close # ファイルは開いたら閉じる
markdown = RDiscount.new(text) # RDiscount.newメソッドを使うことで、文字列をMarkdownとして解析して読み込むことができる
print markdown.to_html # 読み込んだMarkdownをto_htmlメソッドを使ってHTMLに変換して画面に出力
上のプログラムは、hoge.mdというMarkdownで書かれたファイルを内容を読み取って、それをHTMLに変換して表示するプログラムです。
nokogiriはHTMLの一部を指定して切り出すことができるgemです。HTMLが木構造になっているという話を第4回にしましたが、その木の一部を切ってくるところが、のこぎりを使っているようにみえることから、このような名前がついたようです。
gem install nokogiri
とすることで、nokogiriをインストールすることができます。
require 'nokogiri'
require 'open-uri' # 指定したURLからファイルを読み込むためのライブラリ
f = open('http://www.uec.ac.jp') # UECの公式ページを開く
html = f.read # 開いたページから読み込む
f.close
tree = Nokogori::HTML.parse(html) # htmlを解析して、木構造として扱えるようにする
上のプログラムは、UECの公式ページを読み込んで、Nokogiriを使って木構造を取り出すプログラムです。HTMLを読み込んでくるだけでは、ただの文字の羅列で、そこに木構造を見出すことはできません。Nokogiri::HTML.parseメソッドを使うことで、ただの文字の羅列をnokogiriが解析し、木構造として扱えるようになります。
上のプログラムによって、nokogiriを用いて木構造を作り出すことはできますが、nokogiriの本来の目的である木の一部を切ってくるためには、木のどの部分を切ってくるのかを指定できる必要があります。nokogiriでは、その方法としてXPathというものとCSSセレクタというものを提供しています。今回のワークショップでは、CSSセレクタを用いることにします。
CSSは、HTMLで書かれた文書のデザインを決めるための言語です。CSSは、HTMLのタグを指定し、そのタグの部分に対してどのようなデザインを行うのかを指定する形でデザインを作っていきます。例えば、
a {
color : red;
}
上のようなCSSは、aというタグの内容について、色を赤色にしなさいということを指定しています。
CSSで、HTMLのタグを指定する際に用いるのがCSSセレクタです。上の例の場合、aがCSSセレクタです。
p, div
のように、カンマで区切って複数個を並べると、pタグおよびdivタグと言う意味になります。また
p > a
のように書くと、pタグの下に配置されているaタグという意味になります。
少し前に書いたとおり、nokogiriではHTMLという木の一部分を指定する際に、CSSセレクタを使うことができます。例えば、
tree = Nokogori::HTML.parse(html)
a = tree.css('a')
```
とかくと、treeという木の中からaタグの部分が切りだされて、aという変数に代入されます。例えば、
```
<p>
<a>ああああ</a>
</p>
```
というHTMLに対して、上のプログラムを実行すれば、<a>ああああ</a>の部分だけを取り出すことができます。ここで少し立ち止まって考えてみると、あらゆるHTMLを入力として考えた時、そのHTMLの木の中からaタグの部分だけを取り出そうとすると、その結果は複数個になる可能性があります。例えば、
```
<p>
<a>ああああ</a>
<a>いいいい</a>
</p>
```
というHTMLを考えた時、これに対して上のプログラムを実行すると、<a>ああああ</a>と<a>いいいい</a>という2つの結果が得られます。なので、cssというメソッドは、配列を返すようになっていて、eachメソッドを実行することができます。
```
tree = Nokogori::HTML.parse(html)
tree.css('a').each do |a|
puts a.inner_text # inner_textメソッドは、タグの中身を取り出すメソッド
end
```
上のプログラムを実行すると、htmlの中に含まれているすべてのaタグを取り出してきて、その中身をputsメソッドで出力するという動きをします。
#### gitによる履歴管理
gitを使うと、プログラム開発におけるプログラムの変更履歴を記録することができます。
gitを用いるには、gitで管理したいファイルがおいてあるディレクトリ上で
```
git init
```
というコマンドを実行します。
gitの基本的な利用方法は、git initしたディレクトリにあるファイルを編集した後、どのような編集を行ったのかを記録することです。
gitでファイルの変更履歴を管理するためには、まず変更履歴を記録したいファイルをgitの管理下に入れる必要があります。
```
git add ファイル名
```
というコマンドを実行すると、指定したファイルをgitの管理下に置くことができます。
git addした上で、次は変更履歴を記録します。変更履歴を記録するためには、
```
git commit
```
というコマンドを実行します。このコマンドの名前から、変更履歴を記録することをコミットするとも言います。
このコマンドを実行すると、テキストエディタが開きます。ここに変更点について簡単にまとめて記述した上で保存すると、それがgitによって記録されます。この記録は、
```
git log
```
というコマンドでいつでも閲覧できます。
プログラム開発の際には、プログラムを変更する→git addする→git commitする の繰り返しを行って、プログラムの変更履歴を記録しておくことが重要です。この記録をしておくことで、後でバグが発生した時に元にもどしたりすることが容易になります。
ちなみに、この文書もgitによって変更履歴が管理されています。
### 第6回
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent