jQuery APIでWebサイトを演出しよう

APIの基本

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
API(Apllication Programming Intaerface)とは何でしょうか?WebAPI、マッシュアップについて学びます。
講師:
03:55

字幕

このレッスンではAPI の基本について学びます。それではまず API フォルダーを開いて中にある index.html をGoogle Chrome で開きます。開いたらまずページの内容を見ていきましょう。まず API とはApplication ProgrammingInterface の略です。元々ウェブの用語ではなく、システムなどの機能を連携させるために作られた入口という概念で用いられてきました。現在ではウェブ上にある様々なサービスなどの機能を自分のサービスでも取り入れるようにできるという仕組みを指していることが多いです。では1つ例を見てみましょう。こちらに Practice という欄がありますがGoogle Charts API というものを使っています。こちらのリンクをクリックしてみると、このような Google の開発者向けのコンテンツに飛びます。こういったグラフがありますがマウスをホバーさせると、このように項目名やパーセンテージなどが表示されるようになっていますがこれは自前で HTML などを用意しているのではなくてGoogle の API を使ってアンケートを表示しています。 なのでこのデザインなどはGoogle のサーバー側で処理していてこちら側ではこういった項目名や数字だけを入力すれば自動的にグラフが生成できるといったようなサービスです。まずはソースを見てみましょう。フォルダーに切り替えて、API というフォルダーの中にあるindex.html をSublime Text でも開いてみましょう。本来グラフを生成するということは非常に大変な仕組みですがGoogle が提供している38行目にある、Google の jsapi という所があります。これを外部から読み込んでおけばグラフの生成はそちらに任せて後は設定だけを JavaScript で書いてあげることでグラフが自動的に生成されるという仕組みになっています。一見複雑そうに見えますが、例えば読めるところに着目して例えば大好きとか20 とか書いてありますがここの数字を例えば 50 と打ち変えて上書き保存をしてGoogle Chrome に戻って更新を押してみましょう。そうするとこのように大好きの項目が50 という風になってパーセントも自動的に計算がされています。このように、サーバーの仕組みをAPI によって使わせてもらってそしてこちら側ではその設定だけをいじるということで様々なサービスを連携させることができます。 こういうったサービスを連携させて色々な仕組みを作っていくことをマッシュアップと言ったりします。例えば Google マップの API を使えば位置情報や地図の情報を取得できるのでそこにオリジナルのマーカーなどを設置しておいしいものマップみたいなサービスを作り出すことも可能です。API は様々なものが公開されています。Google だけではなくてソーシャルサービスなども公開されているので是非調べてみてください。このレッスンではAPI の基本について学びました。

jQuery APIでWebサイトを演出しよう

jQueryはJavaScriptを効率良く記述することができる、世界中で広く使われているライブラリです。APIとは外部のウェブサービスを自分のサイト内で利用できる仕組みのことです。このコースではjQueryやAPIの基本を学習したのち、jQueryのプラグインやGoogle APIなどの実践的な使い方について学びます。

2時間43分 (22 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2014年05月29日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。