TechAcademy（テックアカデミー） Webアプリケーションコース プログラミング Ruby Rubyでライブラリnokogiriを利用して スクレイピングを実行する方法
icon
icon
Ruby

Rubyでライブラリnokogiriを利用して スクレイピングを実行する方法

初心者向けにRubyでライブラリnokogiriを利用して スクレイピングを実行する方法について解説しています。スクレイピングとはWeb上から情報を取得することをいいます。ここではスクレイピングを行うライブラリnokogiriのインストール方法と基本の使い方、実行結果を見ていきましょう。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社　調査期間：2021年8月12日～8月16日　 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名　 調査手法：インターネット調査

Rubyでライブラリnokogiriを利用して スクレイピングを実行する方法について解説します。

 
そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を読むとさらに理解が深まります。

なお本記事は、TechAcademyのオンラインブートキャンプRuby講座の内容をもとに紹介しています。

 

田島悠介

今回は、Rubyに関する内容だね！

大石ゆかり

どういう内容でしょうか？

田島悠介

ライブラリnokogiriを利用して スクレイピングを実行する方法について詳しく説明していくね！

大石ゆかり

お願いします！

 

ライブラリnokogiriとは

webスクレイピングでよく使われるRubyのライブラリーで、nokogiriというライブラリーがあります。他にMechanaizeというライブラリーもあります。

ここにいうスクレイピングとはweb情報を取得したり、加工したりして使用することです。

今回はこのnokogiriというライブラリーを使用してスクレイピングする方法を紹介していきます。

 

ライブラリnokogiriのインストール方法

Rubyのスクリプトの場合、gem install nokogiriでインストールします。Railsプロジェクトでインストールする場合はGemファイルに、gem ‘nokogiri’ と追記して、bundle install しましょう。

 

[PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中

ライブラリnokogiriを利用してスクレイピングを実行する方法

nokogiriがインストールできたら早速nokogiriを使ってスクレイピングしてみましょう。ファイル以下のように書いて実行してみましょう。

 

require 'nokogiri'
  require 'open-uri'

url = 'https://techacademy.jp/'

charset = nil

html = open(url) do |f|
  charset = f.charset
  f.read
end

doc = Nokogiri::HTML.parse(html, nil, charset)

puts doc
#=>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

...............................................................................

...............................................................................

..............................................................................

...............................................................................

<meta property="og:title" content="パーソナルメンターがつくオンラインブートキャンプ | TechAcademy [テックアカデミー]">

<meta property="og:description" content="プログラミング学習で、もう挫折しない。

パーソナルメンターがつくオンラインブートキャンプ。">

<meta property="og:url" content="https://techacademy.jp/">



<meta name="twitter:title" content="パーソナルメンターがつくオンラインブートキャンプ | TechAcademy [テックアカデミー]">

<meta name="twitter:description" content="プログラミング学習で、もう挫折しない。

パーソナルメンターがつくオンラインブートキャンプ。">

...............................................................................

...............................................................................

..............................................................................

...............................................................................

 

以上のようにwebサイトから情報を取得していますね。

 

筆者プロフィール

町田　耕

学生時代は会計学専攻。塾講師勤務を経て、企業のCFOとして会社経営に携わる。

会社経営から一線を退いた後、インフラエンジニアの妻の勧めでプログラミングを

独学で始め、プログラミングセミナーなど転々としながら、開発案件に携わるようになる。

現在、フリーランスとして活動しながらテックアカデミーのメンターも勤めている。

 

大石ゆかり

内容分かりやすくて良かったです！

田島悠介

ゆかりちゃんも分からないことがあったら質問してね！

大石ゆかり

分かりました。ありがとうございます！

 

TechAcademyでは、初心者でもRuby on Railsを使ったプログラミングを習得できるオンラインブートキャンプRuby講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

初心者・未経験でもできる。まずはテックアカデミーに相談しよう

プログラミングを独学で学習していて、このように感じた経験はないでしょうか？

  • ・調べてもほしい情報が見つからない
  • ・独学のスキルが実際の業務で通用するのか不安
  • ・目標への学習プランがわからず、迷子になりそう

テックアカデミーでは、このような 学習に不安を抱えている方へ、マンツーマンで相談できる機会を無料で提供 しています。
30分間、オンラインでどんなことでも質問し放題です。

「受けてよかった」と感じていただけるよう カウンセラーやエンジニア・デザイナー があなたの相談に真摯に向き合います。

「自分に合っているか診断してほしい」
「漠然としているが話を聞いてみたい」
こんなささいな悩みでも大丈夫です。

無理な勧誘は一切ありません ので、まずはお気軽にご参加ください。
※体験用のカリキュラムも無料で配布いたします。（1週間限定）

今なら参加者限定の割引特典付き！ 無料相談を予約する

記事を検索

関連するキーワード

関連する記事

Rubyのcase文の使い方を現役エンジニアが解説【初心者向け】

Rubyのcase文の使い方について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 Rubyにつ...
Ruby

Rubyのクラスメソッドの使い方を現役エンジニアが解説【初心者向け】

Rubyのクラスメソッドの使い方について解説します。   そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を...
Ruby

RubyでDirクラスを使う方法【初心者向け】

RubyでDirクラスを使う方法について解説します。   そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を...
Ruby

Rubyのjoinメソッドの使い方を現役エンジニアが解説【初心者向け】

Rubyのjoinメソッドの使い方について解説します。   そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事...
Ruby

Rubyでinclude?メソッドを使ってstringクラスを検索する方法を現役エンジニアが解説【初心者向け】

Rubyでinclude?メソッドを使ってstringクラスを検索する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初...
Ruby

Rubyでuntil文を使う方法を現役エンジニアが解説【初心者向け】

Rubyでuntil文を使う方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。  ...
Ruby

あわせてよく読まれている記事

PythonによるWebスクレイピングの方法を現役エンジニアが解説【初心者向け】

PythonによるWebスクレイピングの方法ついて解説します。 そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプPython講座の内容をもとに紹介しています。   田島悠介 今回は、PythonでWebスクレイピングする方法についての内容だね！ 大石ゆかり Webスクレイピングとは何でしょうか？ 田島悠介 Webスクレイピングでできること、その方法を解説していくね！ 大石ゆかり お願いします！   Webスクレイピングとは Webスクレイピングとは、Webページの情報をプログラムを使って取得できる技術です。他のプログラミング言語でもWebスクレイピングはできますが、今回はPythonを使ってWebスクレイピングする方法を紹介します。   Webスクレイピングで何ができる？ では具体的にWebスクレイピングでは何ができるのでしょうか？ たとえば、以下のようなことができます。 あるサイトの特定部分のテキストを定期的に取得 ネットオークションの価格を自動で取得 自動でサイトにログインして、ほしい情報を取得 Webスクレイピングは、業務の自動化などで活躍します。 [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中Webスクレイピングのためのライブラリ・フレームワーク PythonでWebスクレイピングをするための代表絵的なライブラリやフレームワークをいくつか紹介します。 urllib.request Pythonの標準ライブラリです。URLを指定し、Webサイトの情報を取得できます。 Requests urllib.requestに同じく、Webサイトの情報を取得できます。Requestsは人間のためのHTTPとしても親しまれていて、扱いやすいのが特徴です。 beautifulsoup4 beautifulsoup4は、サードパーティ製のhtmlパーサライブラリです。取得したWebサイトから特定のテキスト情報などを抜き出せます。 Webスクレイピングといえばbeautifulsoup4、と覚えてもよいほど有名です。 Selenium 自動でブラウザを操作する為のライブラリです。スクレイピングにも活用することできます。 HTMLの要素にアクセスして情報を取得できるのはもちろん、クリック操作などの制御も可能です。 Scrapy Pythonにおけるスクレイピングのためフレームワークといえば、Scrapyです。 Scrapyは、スクレイピング（Webサイトからデータを取得する）だけではなく、クローリング（プログラムがインターネット上のリンクを辿ってWebサイトを巡回し、Webページ上の情報を複製・保存すること）もできます。少し難易度が高くなりますが、余裕のある方は使ってみてください。   実際に書いてみよう いくつかライブラリ・フレームワークを紹介しましたが、今回は「beautifulsoup4」を使い、実際にWebスクレイピングをします。 NewsPicksのトップページに表示されている記事のタイトルを自動で取得し、出力するプログラムを書いていきます。 サンプルコード(mymod.py) import requests from bs4 import BeautifulSoup result = requests.get('https://newspicks.com/') data_1 = BeautifulSoup(r.text, 'html.parser') data_2 = data.find_all("div", class_="title _ellipsis") for item in data_2: print(item.getText())   実行結果 ボーイング、737減産へ　2割、墜落事故の影響拡大 アップル米有料音楽で逆転　スポティファイ上回る 【必見】シェアエコのいまを押さえる3つのポイント 米大統領、金融緩和を要求　FRBに圧力強める 【独自調べ】「令和」改元は、経済にどんな影響を与えるか？ 【猪瀬直樹】作家の道標は、三島由紀夫とカポーティ ボーイング、737減産へ　2割、墜落事故の影響拡大 アップル米有料音楽で逆転　スポティファイ上回る 【必見】シェアエコのいまを押さえる3つのポイント 米大統領、金融緩和を要求　FRBに圧力強める 東大生が教える｢文章が苦手｣が一瞬で治るコツ Amazon印のワイヤレスイヤホンが開発中？ AirPodsのライバル候補か ｢四角いクルマ｣は､なぜ日本で大人気なのか 解説 requests.get()でNewsPicksトップページのHTMLを取得 find_allでclassを指定し、タイトルを取得 配列に格納された値をfor文とprint文で出力   大石ゆかり 普段みているようなサイトでも簡単にスクレイピングできるんですね！ 田島悠介 余裕ができたらログインなども試してみてね！ 大石ゆかり 分かりました！ありがとうございます！   TechAcademyでは、初心者でもPythonを使った人工知能（AI）や機械学習の基礎を習得できるオンラインブートキャンプPython講座を開催しています。 挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。 プログラミングを独学で学習していて、このように感じた経験はないでしょうか？ ・調べてもほしい情報が見つからない ・独学のスキルが実際の業務で通用するのか不安 ・目標への学習プランがわからず、迷子になりそう
Python

SeleniumとBeautifulsoupを利用してPythonでスクレイピングする方法を現役エンジニアが解説【初心者向け】

SeleniumとBeautifulsoupを利用してPythonでスクレイピングする方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 SeleniumとBeautifulsoupを利用することで、Webページの内容のいち部分を指定して保存できます。 実務でも、自社サービスの表示データの一部をスクレイピングするので、ぜひ学習してみてください。 目次ライブラリnokogiriとはライブラリnokogiriのインストール方法ライブラリnokogiriを利用してスクレイピングを実行する方法筆者プロフィール そもそもPythonについてよく分からないという方は、Pythonとは何なのか解説した記事を読むとさらに理解が深まります。   田島悠介 今回は、Pythonに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 SeleniumとBeautifulsoupを利用してPythonでスクレイピングする方法について詳しく説明していくね！ 大石ゆかり お願いします！   Seleniumとは Seleniumとは、Webブラウザの操作を自動化させるためのライブラリです。 2004年にThoughtWorks社のJason Hugginsによって、ThoughtWorksの内部ツールとして開発されました。 ブラウザ操作の自動化を行うためのスクリプトであるSeleneseでテストを実行することから始まりました。 その後、Seleneseを使う代わりに汎用的なプログラム言語でもテストを行えるクライアントAPIも提供されています。 現在提供されているのは、次の言語用クライアントAPIです。 Java C＃ Ruby JavaScript R Python Kotlin   Beautifulsoup4とは 近年は機械学習などのデータを作成する時に、Webサイトからのデータを収集するための作業をプログラムを使って、半自動化することで大量のデータの取得を効率化させることが多くなりました。 そこで使われる手法がスクレイピングです。 Pythonではいくつかのスクレイピングライブラリがありますが、その1つがBeautifulsoup4です。 Beautifulsoup4とは、HTMLやXMLの中から必要なデータを抽出するためのPythonライブラリです。 HTMLの中身を解析してツリー構造にして目的のコンテンツを取得できることです。 つまり、Seleniumからブラウザを操作して出力された目的のページのHTMLをBeautifulsoup4で取得して、中身の構造を解析してプログラムから目的のデータを抽出するという流れがPythonでスクレイピングをやる時によく使われる手法です。 ちなみあらかじめ目的のページのURLがわかっている場合は、Seleniumの代わりにurllibを使ってHTMLを取得する方法もあります。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中Selenium IDEインストール方法 1.SeleniumIDEのダウンロード ChromeウェブストアのSelenium ページにアクセスしてChromeに追加をクリックします。 もし、Chromeウェブストアページが見つからなかったら、「chromeウェブストア　Selenium 」で検索してみてください。 2.SeleniumIDEのインストール Selenium 拡張機能を追加すると、Selenium IDEのインストールが完了します。 今回はMicrosoft Edgeを利用していますが、Microsoft EdgeはChromeと互換性のある、Chromiumエンジンを利用しているため、Chrome拡張機能の利用が可能です。   コラム コスパとタイパ、両方結果的に良くなる良くなる学び方とは？ 「スクールは高いし時間も縛られて効率が悪い」と考える方は多いと思います。 もちろん、時間も費用もかかることは間違いありません。 ただ 結果的に無駄な学びにお金も時間もかける方がリスクが高いという考えもあります。 コスパ・タイパ最適化の参考として、
Python

HTMLファイルの解析方法を現役デザイナーが解説【初心者向け】

HTMLファイルの解析方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 そもそも、HTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプ、Webデザイン講座のHTMLカリキュラムをもとに執筆しています。   田島悠介 今回は、HTMLに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 HTMLファイルの解析方法について詳しく説明していくね！ 大石ゆかり お願いします！   HTML解析（HTMLファイルの解析）とは 各ブラウザのデベロッパーツールと呼ばれる検証機能を利用し、そのブラウザで表示されているのhtmlファイルとcssファイルのコードを閲覧し、解析していくことができます。クロームやIEなどそれぞれのブラウザでデベロッパーツールを利用することで見ることができ、それらのコーディングをブラウザ上で書き換えることができます。 どのようなコンテンツ構成になっているかを記述されているコードを見て確認することができ、またパソコン画面やスマホ画面などの任意のサイズの画面でどのように表示されているかを確認することも可能となっています。 また、Webスクレイピングと呼ばれるWebからデータを収集、特定データの抽出することで解析することも可能となります。スクレイピングはタイトルなど任意の部分だけを抽出したりすることが可能となり、それらのデータを元に修正や別のコンテンツを作成することへ利用ができるようになります。   HTML解析の方法 デベロッパーツールでの解析はショートカットがあり、WindowsではF12、MacではControl + Option + Iでブラウザ上に表示できるようになります。表示されたElementsを見るとHTMLで書かれたコードが表示されており、任意の加筆修正をすることでhtml表示のテストをすることもできます。 同時にCSSも表示されているので既存のページで使われているコードを見て解析することができ、大きさや色、その他の属性などのテストも可能となります。 これらはブラウザ表示を更新するだけで元のブラウザページに戻るため解析方法としてはとても利用しやすいものになります。Webスクレイピングの方法としてはRubyやPython、Javaなどのプログラミング言語を使用して抜き出していきます。これらのプラグラミング言語にはライブラリと呼ばれる膨大なプラグラムの書かれた拡張機能を利用することができます。 これらのライブラリをインストールし、プログラミングのコードを記述することで任意の抽出などが可能となります。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中HTML解析に役立つツールの紹介  スクレイピングの方法として各ライブラリを利用する方法がありますが、それぞれの言語で利用するライブラリは別のものなので整理していきます。 Rubyはnokogiri、PythonはBeautifulSoup4、Javaではjsoupなどそれぞれありますが、特徴がそれぞれ違うライブラリが各言語に存在するため代表的なものから利用し、スクレイピングに触れていくことが良いでしょう。   実際に解析してみよう ブラウザのデベロッパーツールを利用してTECHACADEMYのホームページのhtmlファイルのコードを確認します。コーディングの中のtitleの要素を探し出し、この後にスクレイピングされた結果と同じであるか確認をしていきます。 スクレイピングはRubyを利用し、ライブラリはnokogiriを利用しています。nokogiriをインストールした後にtest.rbというファイルを作成し、以下のように記述します。 (test.rb) require 'open-uri' require 'nokogiri' url = 'https://techacademy.jp/' charset = nil html = open(url) do |f|   charset = f.charset   f.read end doc = Nokogiri::HTML.parse(html, nil, charset) puts doc.title   ターミナルで、 ruby test.rb として実行した際にターミナルに下記の抽出結果が表示され、先ほどのデベロッパーツールで確認したhtmlのtitleと同じであれば成功です。   コラム コスパとタイパ、両方結果的に良くなる良くなる学び方とは？ 「スクールは高いし時間も縛られて効率が悪い」と考える方は多いと思います。 もちろん、時間も費用もかかることは間違いありません。 ただ 結果的に無駄な学びにお金も時間もかける方がリスクが高いという考えもあります。 コスパ・タイパ最適化の参考として、 テックアカデミー卒業生がスクールを選んだ理由
HTML

RubyとNokogiriを使ってHTMLを解析する方法を現役エンジニアが解説【初心者向け】

RubyとNokogiriを使ってHTMLを解析する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 そもそもRubyについてよく分からないという方は、Rubyとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプRuby講座の内容をもとに紹介しています。 田島悠介 今回は、Rubyに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 RubyとNokogiriを使ってHTMLを解析する方法について詳しく説明していくね！ 大石ゆかり お願いします！   Nokogiriとは？ Nokogiriとは、XML, HTML文書を解析(パース)するためのRubyライブラリです。 解析(パース)はHTML文書が一定の文法に従って記述された内容に対して、プログラム内で扱いやすいデータに変換することをさします。 文書の構造を解析し、XPathもしくはCSS3のセレクタを用いて、要素を抽出できます。 Webページのスクレイピング(要素の抽出)に多用されるライブラリです。 HTMLを解析するためにNokogiriをインストールしてみよう gemコマンドを用いてインストールします。 gem install nokogiri システムによっては、依存ソフトウェアのインストールが必要なケースがあります。 詳細は公式のインストール説明を参照してみましょう。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中HTMLを解析してみよう 以下、サンプルコードです。 require 'nokogiri' require 'open-uri' doc = Nokogiri::HTML(open('https://nokogiri.org/tutorials/installing_nokogiri.html')) doc.css('nav ul.menu li a', 'article h2').each do |link| puts link.content end   実行結果 $ ruby sample.rb Install with included libraries (RECOMMENDED) Install with system libraries Install with custom / non-standard libraries   解説 1,2行目で必要なライブラリを読み込んでいます。 4行目でURLを指定し、HTMLの構造解析を行いました。 6-8行目で、CSSセレクタでHTMLタグを指定し、ループで順に出力しています。 CSSセレクタの一つ目ではメニュー中のリンク要素、2つ目では本文中の見出し要素を指定しました。   執筆してくれたメンター 橋本紘希 システムインテグレータ企業勤務のシステムエンジニア。 開発実績: Javaプログラムを用いた業務用Webアプリケーションや、基幹システム用バッチアプリケーションなどの設計構築試験。   大石ゆかり 内容分かりやすくて良かったです！ 田島悠介 ゆかりちゃんも分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   TechAcademyでは、初心者でもRuby on Railsを使ったプログラミングを習得できるオンラインブートキャンプを開催しています。 また、現役エンジニアから学べる無料体験も実施しているのでぜひ参加してみてください。 プログラミングを独学で学習していて、このように感じた経験はないでしょうか？ ・調べてもほしい情報が見つからない
Ruby

目的を見失わないために！プロトタイピングの間違った手法とは

本稿は、Studio by UXPinのブログ記事を、了解を得て日本語翻訳し掲載した記事になります。また本記事はUXPinのUXデザイナーであるMarcin Treder氏によって投稿されました。 プロトタイピングの間違ったやり方は、あなたが思っている以上にUXデザインを損ないます。 そして、プロトタイピングを実行する段階が早すぎることがなぜ危険なのか、私の経験を基に説明します。   急成長するUXデザイン 10年前にはUXデザインは、デジタル製品の開発プロセスの一部で使われているだけでした。それが2000年代以降に広まり始め、今や全ての製品開発においてUXデザインは重要な役割を果たしています。 次のGoogleトレンドによる分析グラフも、UXデザインの急成長を示しています。   リーン開発、アジャイル開発、ウォーターフォールモデル（上流から下流への開発工程）などの数々のシステム開発のタイプの実例を見たところ、多くの会社ではプロジェクトの時間節約のために、プロトタイピングを早すぎる段階で実行していることに気づいたのです。 その結果、短期的にはチームにとって時間節約になるかもしれませんが、長期的には修正や故障が数多く起こるために、かえって時間がかかるのです。 これでは、デザインの間違いを修正する過程で正しいアイデアを見つけるという、UXの真の価値が失われてしまいます。   間違ったプロトタイピングの危険性 私は、プロトタイプはその良さが生かされないまま、いわば現実離れしたおもちゃになりつつあるのではと思っています。 実際にプロトタイピングは、ものを良く見せるためだけに使われることも多くなっています。その結果としてデザインプロセスは、高い費用がかかり、肥大化し、バラバラに分離した、混乱するようなものになってしまうのです。 私が過去に、ビジュアルデザインのバックグラウンドを持つUXデザイナーと一緒に、eコマースのデザインの仕事をしたときに、まさにこの罠に陥っていました。Photoshopに慣れている彼らは、いきなり実際のサービスをイメージしたモックアップからデザインを始めました。 デザインに問題があれば、サービス責任者からフィードバックを受けたり、インタラクションモデル（ターゲットとするユーザーと共同でデザインを考える手法）においてユーザーから問題を指摘されることもあります。 もちろん、実際のサービスに寄せたプロトタイピングから始める方法が役立つこともあるのですが、それをデフォルトにするのは良くありません。 製品のデザインに、PhotoshopやSketchなどを使うのは、デザインプロセスのもっと後の段階でいいのです。 何よりもまず、そもそものプロトタイプの存在意義について考えてみましょう。   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中プロトタイピングの3つのコスト削減効果 プロトタイピングは実は古くからある概念であり、またインタラクションデザインにおける唯一の手法ではありません。 Michael Guggenheim氏の記事『The Long History of Prototypes』によると、 「プロトタイピングは開発における「原型」として理解されるべきものではなく、またインダストリアルデザインにおけるベータ版（サンプル製品のソフトウェア）のようなものでもありません。プロトタイピングは開発を進めるための手法です。つまり、仮のモデルであり、ブリコラージュ（使えるものを何でも利用して作ること）や、ユーザーの参加、製品の修正などの「オープンな革新」を可能とするものです。決して見知らぬユーザーのために、閉鎖的な実験室で完成度の高い製品を作るための手法ではありません。」 プロトタイピングは、ユーザーに製品への最短経路を提供するものであるべきです。プロトタイプは製品開発の初期において、製品のアイデアをそれを受け取る人（顧客）に示すことができます。これこそプロトタイピングの真の価値です。 プロトタイピングを効果的に使うと、次のようなメリットがあります。 製品のアイデアを検証する 製品の詳細を修正する 製品のアイデアを拡張する デザインの検証、修正、拡張をプロトタイピングで実行すれば、製品開発のコストを大幅に削減できます。 またエンドユーザーにプロトタイプを試用してもらう時期が早いほど、後々高いコストがかかるエラーが発生する可能性も低くできます。これこそプロトタイプを初期から作成するべき理由です。 初めに最もコストのかからないプロトタイプを作成し（ファイデリティを柔軟に変更できて、一応使える代物であれば、プロトタイプとしては完璧です！）、ユーザーのフィードバックを受けた後でイテレーション（反復型の短期の開発サイクル）を行えばいいのです。 外観のデザインの完成度を高めるために多くの時間を費やしたり、プロトタイピングで使うためだけにスクリプト言語でアニメーションを作成するとしたら、時間とエネルギーの無駄です。ユーザーに最初に製品を紹介したときに、良く評価されないリスクが高くなります。 多くのケースにおいて、わざわざグラフィックデザインのツールを使って作成したモックアップから、プロトタイプを作るメリットはありません。最初に完成度の高いデザインに陶酔してしまったら、ユーザーに製品のアイデアを検討してもらうのも、製品を改良するのも難しくなるというデメリットがあるだけです。 つまり、イテレーション（反復型の短期の開発サイクル）の精神が失われてしまうのです。 プロトタイプを最大限活用するには、素早く実践し、チームで共同作業を行い、ユーザー調査に基づいてイテレーション（反復型の短期の開発サイクル）を行うべきです。   プロトタイピングが役立つケース しかしながら、モックアップのプロトタイピングが非常に役立つケースも存在します。   既存のアセットを変更するケース 既存のアセットに小さな変更を加えるだけであれば、効率的です。 グラフィックやコードから小さな操作（要素の再配置など）をするだけで十分なので、わざわざデザインし直すメリットはありません。   顧客向けのプレゼンテーションを行うケース グラフィックで作られたプロトタイプは、顧客向けのプレゼンテーションを行う場合に役立ちます。逆に、完成度の低いプロトタイプをプレゼンテーションで使っても、顧客の関心を引くことはできないでしょう。 すでにユーザーに製品を試用してもらっていて、製品の最終的なインターフェースに自信を持てるとしたら、顧客向けに完成度の高いプロトタイプを作成してもいい段階です。 優れたプロトタイプを顧客に示すことで、より契約獲得の可能性が高まると思います。   複雑なプロジェクトのケース 現実世界のシミュレーションをプロトタイプに反映しなければならないような場合を考えてみてください。 このような複雑なプロジェクト（または「重要度」は高いが「緊急度」は低いプロジェクト）では、現実の変動するデータにアクセスできるプロトタイプを作るのが有効です。 コストは高くつくかもしれませんが、目的を達成するには必要です。しかし他のケースでは、プロトタイプに時間を投資する価値があるかどうか考えましょう。   コラム コスパとタイパ、両方結果的に良くなる良くなる学び方とは？ 「スクールは高いし時間も縛られて効率が悪い」と考える方は多いと思います。 もちろん、時間も費用もかかることは間違いありません。 ただ 結果的に無駄な学びにお金も時間もかける方がリスクが高いという考えもあります。 コスパ・タイパ最適化の参考として、
アプリデザイン

gemを使った開発！Ruby on Railsでクローラーを使う方法【初心者向け】

RubyのフレームワークのRuby on Railsでクローラーを使う方法について解説しています。 分析ツールなどいろんな情報をひとつのサイトにまとめたいという時に便利です。クローラーでは、手動ではできないことをできるので、その面白さを感じるはずです。   なお本記事は、TechAcademyのWebアプリケーションオンラインブートキャンプの内容をもとに紹介しています。   大石ゆかり 田島メンター！！クローラーというのは何ですか〜？ 田島悠介 Webサイトから情報を習得するプログラムのことを言うんだ。 大石ゆかり 例えばどんなときに使うんですか？ 田島悠介 たくさんの量のデータを収集したり、それを分析したりするのにもクローラーは利用することができるよ。まずは必要なライブラリを紹介しよう。   クローラーとは Rubyを勉強しているとクローラープログラムという言葉を見かけることがあります。 このクローラーというのは、Webサイトを巡回して情報を取得するプログラムのことを言います。 クローラを使用すれば、Yahooの最新ニュース情報を取得したり、facebookのタイムライン情報を取得するなど便利な機能を作成することができます。人がブラウザを操作して情報を収集するより、手間を省いて効率的に情報を取得することができますね。 ただクローラはWebページに負荷をかける行為なので使用する際は注意して使用するようにしましょう。 また、サイトによっては、APIを代用して情報を取得できるように用意していることも多いので、何かの情報を取得したいとおもった場合、まずはAPIが無いか調べるようにしましょう。   使用する主なライブラリ 前提条件として、Railsアプリケーションが作られていることとします。Railsアプリケーションの作り方は、Ruby on Railsなどを参考にしてください。 それでは、クローラーを実装する前にクローラーで使用するライブラリの紹介をします。 open-uri open-uriは指定したurlにアクセスするためのライブラリです。 このライブラリがないとまずWebページにたどり着くことができないため、必須のライブラリとなっています。 nokogiri nokogiriはスクレイピング、クローラーで頻繁に使用されるライブラリです。 取得したHTMLの任意の部分だけ抜き取ったり、string型に変換したりできます。   これらのライブラリを使用するには、Railsアプリケーションフォルダの直下にある「Gemfile」ファイルに以下を追記し、コンソールから「bundle install」を実行します。 gem 'nokogiri' ※open-uri は Ruby on Rails 標準ライブラリのため、Gemfileへの追記は不要です。   大石ゆかり このふたつのライブラリが必要になるわけですね。 田島悠介 これらをrequireで読み込んで、クローラーのプログラムを作成するよ。実際に書いてみよう。 大石ゆかり はい！   [PR] Rubyのプログラミングで挫折しない学習方法を動画で公開中情報を取得する方法 今回はRuby on Railsを用いて、Yahooのトップ情報を取得するクローラープログラムを作成していきたいと思います。 初めに、コントローラーを作成します。コンソールで以下のコマンドを入力します。 rails generate controller yahoos   次にそれぞれのファイルを下記のように記述していってください。 app/controllers/yahoos_controller.rb class YahoosController < ApplicationController require "open-uri" require "nokogiri" def index uri = "http://www.yahoo.co.jp/" @doc = Nokogiri::HTML(open(uri),nil,"utf-8") end end app/views/yahoos/index.html.erb <%= @doc %>   config/routes.rb Rails.application.routes.draw do get 'yahoos/index' end   yahoos/indexページ内を開くと以下のようにyahooのトップページのHTML情報が表示されます。ブラウザで見るのと違い、生のHTML情報なので、HTMLソースが表示されていますね。   それでは詳しく見ていきましょう。 Yahooのトップページから情報を取得してきているのは、app/controllers/yahoos_controller.rbファイルのindex関数内にある以下の記述です。 以下では、指定したURIの情報を取得し、viewで表示するために@doc変数に格納しています。 uri = "http://www.yahoo.co.jp/" @doc = Nokogiri::HTML(open(uri),nil,"utf-8")   app/views/yahoos/index.html.erbでは、@doc変数の内容を表示しています。 <%= @doc %>     それでは、index.html.erbを修正し、@docから必要な要素を抽出してみましょう。 @doc変数には、HTML情報が文字列としてではなく、構造化されたHTML文章として取得されています。そのためnokogiriでは、CSSセレクタを使って要素を指定することができます。 それでは、Yahooトップページから、リンク要素の一覧を取得してみましょう。 「@doc.css(“a”)」と書くことで、@doc変数に格納されたリンク要素（aタグ）の一覧を取得できます。 <% @doc.css("a").each do |link| #
Ruby

あなたの目的に合わせて学べるコース

副業したい方

Web制作の力を身につけ
副業までサポート

はじめての副業コース

転職したい方

未経験から16週間で
エンジニアに

エンジニア転職保証コース

スキルアップしたい方

AIも統計解析もできる
Pythonを学ぶ

Pythonコース

※ 経済産業省の第四次産業革命スキル習得認定講座で、厚生労働省指定の専門実践教育訓練給付制度の対象です。条件を満たすことで支払った受講料の最大70％（最大306,460円）が給付金として支給されます。詳しくは エンジニア転職保証コース のページ内の注意事項をご確認ください。

TechAcademyから
現役エンジニアの方へ
お知らせ

1時間でできる無料体験
挫折しない学習方法とは？
TechAcademy（テックアカデミー） Webアプリケーションコース プログラミング Ruby Rubyでライブラリnokogiriを利用して スクレイピングを実行する方法