要約
日本のIT企業は、最新技術に常に注目しています。
その中でも、javascriptはWeb開発に欠かせない言語として、多くの企業で活用されています。
ここでは、javascriptを用いてWebサービスを提供する、ある日本企業の例を紹介します。
詳細内容
「株式会社はてな」という日本のIT企業は、ブログやウェブページ制作に特化した会社として1999年に設立されました。
はてなでは、ライブドア事件をきっかけに急速に普及したライブドアブログに代わる、新しいブログサービス「はてなブログ」を提供しています。
その中で、JavaScriptを用いた様々な機能を組み込んでいることが特徴の一つです。
はてなブログでは、JavaScriptを用いてブログのデザインを自由にカスタマイズしたり、タグ検索機能やページ内リンク機能を提供することができます。
また、ブログ内にはてなブックマークやTwitterのシェアボタンを配置することで、読者が簡単に記事を共有することができます。
はてなブログでのJavaScriptの使用例として、記事内に埋め込まれたリンクのサムネイル表示機能を挙げることができます。
この機能を実現するために、はてなはjQueryというJavaScriptのライブラリを使用しています。
以下は、はてなブログでのサムネイル表示機能のコードの一例です。
“` javascript
$(document).ready(function() {
$(‘a’).each(function() { //全てのリンクについて
if ($(this).hasClass(‘nothumb’)) { //nothumbクラスがある場合は除外する
return;
}
var url = $(this).attr(‘href’); //リンク先のURLを取得
$(this).html(‘‘
+ $(this).html()); //リンクの先頭に表示する
});
});
“`上記のコードでは、`$(document).ready`内で、全てのリンク要素を走査しています。
新しいタブで開かれるリンクや、`.nothumb`クラスが指定されたリンクは対象外としています。
リンク先のURLを取得した後は、取得したURLを利用して、「https://capture.heartrails.com/」というサイトで提供されているサムネイル画像を生成するAPIを呼び出しています。
このAPIを利用することで、実際にリンク先のサイトにアクセスし、そのサイトのスクリーンショットを取得してサムネイル画像を生成することができます。
最後に、生成した画像をリンクの先頭に表示するようにしています。
このように、jQueryを活用すれば、比較的簡単にJavaScriptを使った機能を実現することができます。
また、はてなブログでは、JavaScriptを用いて、広告表示機能も実現されています。
広告表示機能のコードは以下のようになっています。
“` javascript
';
s += ad1;
s += '';
s += '
';
s += ad2;
s += '';
document.write(s);
“`このコードでは、Google AdSenseの広告を表示するために、`data-ad-client`と`data-ad-slot`属性を指定した`ins`タグを生成しています。
最後に、生成されたタグに対して`window.adsbygoogle.push()`関数を呼び出すことで、広告を表示することができます。
はてなブログのように、JavaScriptとライブラリを駆使し、ユーザーに便利で使いやすいブログサービスを提供している日本企業は多数あります。
今後も、より多くの企業が、最新技術を駆使したWebサービスの開発に取り組んでいくことが期待されます。
コメント