WordPressレッスン後記 -アメブロRSS取り込み-
今日はお昼のレッスンでした。
扱ったテーマは「アメブロのRSSをトップページに取込む方法」です。
RSSとは？
RSSとは、ブログやホームページの記事の内容を、専用のURLを経由して
外部のサイトやアプリケーションから取り込めるようにしたものです。
RSSの具体例（１）
お気に入りのブログに新しい記事が書きこまれたとき、
自動的に知らせてくれたら便利ですよね？
そこで、RSSを登録したブログの新着情報を自動的に取得したり
メールで通知してくれる専用のアプリケーションがあります。
いわゆる「RSSリーダー」という種類のアプリケーションです。
ブラウザの拡張機能として簡単に追加することができるので、
情報収集に役立ちます。
RSSの具体例（２）
サイトのトップページによくある「新着記事」もRSSの典型例です。
サイト内の新着記事ならRSSを使う必要がありませんが、
ホームページとは別途、アメブロなどでブログをやっている場合は、
アメブロで書いた記事をホームページのほうに自動表示させるには
「アメブロ側のRSSをホームページ側のプログラムから取得しに行き、
取得したデータをホームページ内に表示させる」
という仕組みを、ホームページ側に追加しなければなりません。
そう、外部のサイトの新着情報を自分のサイトに自動連携するには
・RSSのデータを受信する
・受信したデータをHTMLに加工して表示する
という手順を踏んだプログラムが必要なのです。
RSSの正体
RSSとして配信する記事データは、インターネット上のいろんな場所から
いろんな目的で取得できる「汎用的」な仕組みである必要があります。
配信元のサイトのHTMLデータをそのまま配信したのでは、
サイトのテンプレートによってHTMLの構造が違うため、
RSSを取込む側がテンプレートに応じた加工をしなければならず、
使い勝手が悪いです。
ですから、HTMLの構造を抜きにして、
・記事のタイトル
・記事のURL
・記事の本文（HTML抜き）
のような、いわゆる「生のデータ」だけを詰め込んだ形式にするという
発想になります。
<item>
<title>記事のタイトル</title>
<link>http://......</link>
（省略）
</item>XMLはこのように、非常にHTMLと似たタグ構造をしています。
HTMLはあらかじめタグの種類が決まっていますが、
XMLは自由にタグの名前をつけることができるので、
ウェブページの表示以外の用途にも使えるのです。
実は、インターネット上の全てのウェブサイトを構成しているHTMLは、
XMLから生まれた記述法です。
XMLが本家だとしたら、HTMLは分家ということです。
似ているのも当然ですね。
RSSをサイトに取り込む手順
ウェブページの中で、データを受信したり加工したりするには
jQueryやPHPなどの「通信ができる」プログラム言語を使って
プログラムコードを記述する必要があります。
HTMLやCSSにはそのような機能がそもそも言語仕様的にありません。
どちらかというと、HTMLファイルに直接記述して動くjQueryを
使うのが簡単だと思います。
（注）初心者でも簡単という意味ではありません。
しかし、jQueryではRSSの取込元と取込先が別々のドメインだと
データが取得できないというセキュリティ上の壁があります。
全てのアメブロはアメーバのドメイン配下にありますから、
この制約に引っかかってしまうわけです。
そこで、PHPの力を借ります。
手順は以下の通りです。
1. PHPでアメブロのRSSを受信するプログラムファイルを作成し、
取込先サイトと同じドメイン内にPHPファイルを配置する。
→これでドメインの壁を越える。
2. 1で作成したPHPにjQueryでアクセスしてXMLデータを取得する
3. jQueryでXMLの構造を解析して記事のデータを抜き出す。
4. 抜き出したデータをjQueryでHTMLに埋め込んで整形する。
自分でできるために何が必要か？
上記の手順をプログラムとして実装するためには、
「手順を考え付く力」が必要です。
そのためには、以下のような知識と理解がどうしても必要です。
・RSSの正体
・XMLは汎用的なデータ形式なのでいろんなプログラム言語で解析ができる
・解析プログラムは自分で用意しなければならない
・解析に使うプログラムの文法
・文法の調べ方
・調べたことを組み込む方法
・うまくいかないとき原因を特定する方法
特に最後の「うまくいかないとき原因を特定する方法」が大事です。
なぜなら、RSSを取込む方法はネット上にたくさん載っていますが、
自分のサイトの場合に当てはめるとどう書けば良いのかという、
個別のケースに応じた、コピペするだけでOKなプログラムコード
なんて、あるはずがないからです。
上記のような知識がなければ、うまくいかない原因を特定できず、
修正方法を思いつけるはずがないのです。
「どうやれば良いか」が大事なのではなく、
「背景で使われている技術と仕組み」を理解することが大事なんです。
答えを知るのが大事なのではなく、
答えを導くために考える材料（技術と知識）を身に付けることが大事なんです。
よく誤解される「本質的なプログラミングスキル」とは？
PHPの場合はこう書けばよいとか、jQueryの場合はこうするといった
文法の知識が本質的なプログラミングスキルなのではありません。
ここ、初心者であればあるほど、誤解してしまうポイントです。
この誤解から覚めなければ、いつまでも「書き方」をネットで探すだけで、
どうやれば解決するかを自分で考える力が伸びません。
プログラムは「書き写す」ものではなく「組み上げる」ものなのです。
プログラミングとは、処理の手順を考えることから始まります。
文法やアルゴリズムというのは、手順をプログラムの言葉に置き換える手段
でしかないということを忘れてはなりません。
本質的なプログラミングスキルとは、
「どのような手順でどのような処理をすれば目的が叶うかを考えるスキル」
なのです。
・論理的思考力
・文法知識
・調べる力
がモノを言います。
自分で考え付く力を身に付ける方法とは？
実務も含めて20年以上のプログラミング経験を持つプログラマーから、
考え方を盗み取るのが一番です。
独学だと「自分が知っている発想」の枠でしか物事を理解できません。
だから、本を買っても挫折する方が多いのだと思えてなりません。
プログラミングスクールも多々ありますが、
やり方を覚えようという姿勢で取り組むと、「考え方」は身に付かず、
応用ができません。
なぜなら、応用は自分で考えなければできないことだからです。
プログラミング講座のご案内
2015年12月現在、まだ初級コースだけですが、
【期間限定】クリスマス前日までのお申し込み
に限り、特別価格にてご参加いただけます。
↓↓↓ 仮登録フォームはこちら ↓↓↓
docs.google.com
※仮登録いただいた方には講座の詳細をご連絡させていただきます。
※仮登録は受講枠の仮押さえとお考えください。
本登録するまで料金は発生しませんのでご安心ください。
office-ing.hatenablog.com
office-ing.hatenablog.com
office-ing.hatenablog.com
office-ing.hatenablog.com
office-ing.hatenablog.com
