TypeScriptで今すぐ使える実践的『ECMAScript 2015』
TypeScriptで今すぐ使える実践的『ECMAScript 2015』 わかめまさひろ（株式会社トップゲート） TypeScriptを使ってECMAScript 2015時代のコードを書く 3 第一回は、「なぜTypeScriptか？」という話を書きました。前回はTypeScriptで開発する際の環境についてがテーマでした。今回は、最後の締めくくりとしてECMAScript 2015において積極的に利用するべき構文を紹介していきます。 まず、TypeScriptの近況をお伝えしておきます。TypeScriptの現在のバージョンは1.7.5で、この後もまだまだアップデート予定は詰まっています。アップデートの予定はたくさんありますが、これは必ずしも機能が十分に揃っていないということを意味しません。 第一回で触れたとおり、TypeScriptはECMAScript 2015のsuperset
ビデオチャット＆テキストチャット作成チュートリアル！WebRTCを簡単＆柔軟に使える「SkyWay」を使ってみよう
ビデオチャット＆テキストチャット作成チュートリアル！WebRTCを簡単＆柔軟に使える「SkyWay」を使ってみよう 桂健太（HTML5 Experts.jp編集部） WebRTCを簡単に利用するためのプラットフォームSkyWayをご存知ですか？本連載では、WebRTCを簡単に利用するためのプラットフォームSkyWayについて、基本的なチュートリアルから、各種ライブラリの紹介までしていきます。 連載第1回目である今回は、まず、WebRTCの基本的な説明をした後に、実際にSkyWayを使って、ビデオチャットの作成とデータチャンネルを使ったチャットの作成をしていきます。 WebRTCとは WebRTCとは、ブラウザやアプリ間でビデオや音声、データのやり取りをP2P(Peer to Peer)で行うことを可能にする規格です。 従来のビデオチャットは互換性のない独自技術で実装されていましたが、Web
JavaScriptにもクラスがやってきた！JavaScriptの新しいclass構文をマスターしよう
JavaScriptにもクラスがやってきた！JavaScriptの新しいclass構文をマスターしよう 高津戸壮（株式会社ピクセルグリッド） ECMAScript 2015（ECMAScript 6）で新たに追加された待望のclass構文について、その概要をサンプルコードを交えて紹介します。 これまでのJavaScriptにおけるクラス 多くのプログラミング言語はクラスを作れる機能を持っていますが、JavaScriptにその機能は用意されていませんでした。しかし、JavaScriptにはprototypeという柔軟な仕組みが存在しており、このprototypeを利用することで、他の言語で表現されている「クラス」と似たような振る舞いを再現することが可能でした。 それは例えば、こんなふうにです。 /* Cat雛形の作成 */ function Cat(name) { this.setName(
誰でもハイパフォーマンス！OnsenUIが変えるハイブリッドアプリ開発の常識ーng-japan 2015
誰でもハイパフォーマンス！OnsenUIが変えるハイブリッドアプリ開発の常識ーng-japan 2015 佐川 夫美雄（Ashiras, inc.） この記事は、Angularをテーマとした日本初のカンファレンス 「ng-japan」のイベントレポート（第2回目）です。 はじめに HTML5ハイブリッドアプリケーションとは、内部の実装にHTML5が利用されているモバイルアプリケーションです。アプリの内部実装にHTML5を使うことでクロスプラットフォーム対応が可能になりますが、その代わり問題となるのがUIとパフォーマンスです。このセッションでは、Angularの上に構築されたUIフレームワークであるOnsen UIを紹介しながら、Angularでどうすれば高速かつ快適なUIを持つモバイルアプリを作れるかについて話します。 AngularとOnsen UIで作る最高のHTML5ハイブリッドアプ
Web制作者にもチャレンジできるIoT入門～Tesselの基礎～
2015年はIoT元年と言われるくらい、IoTやWoTという単語がバズワード化してきました。2014年頃からArduinoやRaspberryPi、Galileo、Edisonといったマイコンボードが急激に人気になってきましたね。Web開発者がハードウェア領域に進出しやすくなりました。ただ、センサーの利用など応用的なことをしようとすると、GPIOや電流などの知識をある程度は知っておく必要があります。 今回は、Webの知識だけでほぼ操作でき、初心者向けのTesselというマイコンボードを紹介します。具体的には、Tesselの開発環境整備から環境センサを扱うところまでを紹介したいと思います。Webエンジニア向けに説明を書きましたが、Webデザイナーやディレクターなど、非エンジニアの方でもチャレンジしていただけたら幸いです。 Web制作者向けマイコンボードTesselとは 参考リンク 次世代マイ
WebRTCでキャスしよう！片方向リアルタイム映像配信を作ろう
こんにちは！がねこまさしです。「WebRTCを使ってみよう」シリーズの最新話をお送りします。今回は、簡易的な放送局を作ってみましょう。 片方向配信の特徴 WebRTCを使った音声通話、ビデオチャットのサンプルには、双方向のものが多く見られます。ライブラリもそれを前提とした作りのモノが多いようです。なので今回は、片方向配信を実際に動かしてみましょう。 片方向配信には、双方向通信とは異なる特徴があります。 視聴側はカメラやマイクといった機器が不要なので、参加のハードルが下がる Peer-to-Peerでもフルメッシュ構造にはならないので、より多くの人が同時に利用できる 特に同時接続数はは双方向では4～5人が実用範囲なのに対し、片方向では10～30人程度に対して1つのPCから配信できます。ちょっとした仲間内のイベントや、社内イベントであれば、十分にカバーできるのではないでしょうか？（社内で動かせ
WebGLを活用した3D Web ゲーム『翠星のガルガンティア～キミと届けるメッセージ～』
WebGLを活用した3D Web ゲーム『翠星のガルガンティア～キミと届けるメッセージ～』 春日井 良隆（日本マイクロソフト株式会社 プロダクトマ...） Production I.Gと日本マイクロソフトのコラボレーションによる3D Webゲーム『翠星のガルガンティア ～キミと届けるメッセージ～』が、Internet Explorerのデモサイト「Rethink」シリーズの日本発コンテンツとして、6月18日に公開されました。 このゲームはアニメ『翠星のガルガンティア』から生まれたスカイアクションゲームで、この作品のためにシナリオを書き下ろし、アニメ本編の声優はフルボイスで出演、そして世界中のファンが楽しめるように、日本語と英語のキャプションを用意するなど、ゲームそのものに気合いが入っているだけでなく、開発者向けにはソースコードの一部と3Dモデルを公開し、WebGLの裾野を広げることも目的に
WebGLとWebSocketによる3Dオンラインレースゲーム「JS-Racing」の全て！（前編）
WebGLとWebSocketによる3Dオンラインレースゲーム「JS-Racing」の全て！（前編） 西田慎吾（株式会社アイ・エム・ジェイ） 今回はHTML5JapanCup2014にてWebGL賞と優秀賞を受賞したオンラインレースゲーム、JS-Racingの技術解説を書かせていただきます。 このコンテンツはWebGLの3D表現を活かした3Dレースゲームです。 また、WebSocketを使用しサーバを介して、複数のクライアントでの同時走行が可能なオンラインゲームになっています。同時に、ソケット通信時に発行されるソケットIDをPCとスマートフォンで共有することで、スマートフォンからPC上の車を操作することも可能です。 クライアントサイドの使用技術 クライアントサイドの構築において、目的・用途に応じて使用した言語やライブラリに関して解説します。 TypeScriptによるクラス設計 クライアン
WebRTCで注目された海外企業のサービス19本一挙公開
「WebRTC Conference and Expo 2013 Atlanta」のレポート。日本ではまだまだ様子見の雰囲気が強いWebRTCですが、特にアメリカでは様々なサービスや取り組みが始まっています。日本からもどんどんWebRTCを活用したアクティビティを発信して行きたいですね！海外動向が気になる人は要チェック！ 世界中で注目されるWebRTC HTML5 Experts.jp編集部による執筆記事第一弾とりなす。2013年6月25日から27日の3日間、アメリカのアトランタにて「WebRTC Conference and Expo 2013 Atlanta」が開催されました。カンファレンスでは、Developer、Business、Enterprise、Telecom、Mobileそれぞれの分野についてのパネルセッションやワークショップなど計39セッションに加え、参加企業50社以上の
HTML5Experts.jp
WebRTC開発者にはたまらない！徹頭徹尾、デベロッパーファーストだった「SkyWay Developer Meetup#1」 白石 俊平 9月29日に開催された、SkyWay初の開発者向けミートアップ「SkyWay Developer Meetup#1」。 2013年12月からトライアルサービスとして提供されてきたWebRTC Platform SkyWa...
「今どきのGruntを使ったフロントエンド開発（HTML/CSS編）」HTML5 Conference 2013 セッションレポート
「今どきのGruntを使ったフロントエンド開発（HTML/CSS編）」HTML5 Conference 2013 セッションレポート 出口 達也 2013年11月30日（土）に開催された「HTML5 Conference 2013」の、株式会社サイバーエージェント・石本光司さんによるセッション「今どきのGruntを使ったフロントエンド開発（HTML/CSS編）」の内容をご紹介します。 なお、セッションのターゲットはGruntを使ったことのないHTML/CSSコーダーやWebデザイナーさんです。 なぜGruntを使うのか Gruntとは、JavaScriptで書いたタスクを実行してくれるアプリケーション（JavaScript Task Runner）です。 Webアプリケーションの開発が複雑になってきて、CoffeeScript、Sassなどのコンパイルが必要な技術を使うことが多くなってきた
JavaScript Promises、CSS変数、Quartz ComposerのプラグインOrigamiなど海外WEBテク20本を一挙公開
JavaScript Promises、CSS変数、Quartz ComposerのプラグインOrigamiなど海外WEBテク20本を一挙公開 斉藤 祐也（株式会社リッチメディア） 斉藤祐也の海外WEBテク定点観測＜Issue.9: 2013/12/01-2013/12/31＞ 今月の定点観測は、JavaScriptにおけるPromises実装について、CSSの変数(Custom Properties)、Quartz ComposerのプラグインOrigamiなど合計20件の記事や動画などを紹介します。 注目ニュースピックアップ JavaScriptにおけるPromises実装について – HTML5 Rocks 原題: JavaScript Promises: There and back again これまでJavaScriptの『限界』であるシングルスレッドを解決するために、コールバ
WebRTC開発者向けライブラリ「PeerJS」はこうして作られた
NTT Communications（以下、NTT Com）が提供するWebRTC開発用プラットフォーム SkyWayはPeerJSをベースに構成されています。この記事ではPeerJS開発者であるEric Zhang氏の素顔に迫ります！ はじめに 2013年11月19日から21日にアメリカで開催されたWebRTC Conference & Expoに合わせて、NTT ComのSkyWay開発担当者がアメリカを訪れ、PeerJS開発者の一人であるEric Zhang氏にインタビューを行いました。 （写真左：NTT com SkyWay開発チームの飯田アレン真人氏、写真右：PeerJS開発者のEric Zhang氏） ──PeerJSとは？ WebRTCを活用したアプリケーションを開発できるようにするためのJavaScriptライブラリ。PeerServer Cloud serviceというW
HTML5 Experts.jp編集部より感謝を込めて！「2013年の読まれた記事ランキング」年間TOP20
HTML5 Experts.jp編集部より感謝を込めて！「2013年の読まれた記事ランキング」年間TOP20 馬場 美由紀（HTML5 Experts.jp編集部） 7月10日に開設した日本初のHTML5技術専門サイト「HTML5 Experts.jp」。2013年は数々のHTML5を中心とした最新技術の動向や活用方法の解説、Web業界の著名人のインタビュー、事例やイベントレポートをお届けしてきました。今年最後のレポートは「記事公開後1週間の閲覧数（PV)」をもとに、2013年人気記事ランキング年間TOP20をお届けします！ ＜1位＞ iOS7におけるMobile Safariの主な変更点 ──白石 俊平（HTML5 Experts.jp編集長） iOS 7上のSafariがどのように変化したかについて、Maximiliano Firtman氏（@firt）のブログから、Web制作者／開発
Google Hosted Library – Webを速くするためにGoogleがやっていること Make the Web Faster 03 –
Google Hosted Library – Webを速くするためにGoogleがやっていること Make the Web Faster 03 – Jxck Googleは、よく使われるJavaScriptのライブラリなどをGoogleのインフラを使って配布しています。 これを Google Hosted Library と呼びます。 この、Hosted Libraryの導入を単純に「自分で配布しない分が楽になるだけ」、くらいな感覚で使っている方も多いと思います。しかし、実はこれはみんなが使えば使うほど、得をする仕組みになっていることを見落としてはいないでしょうか？ 今回はそんな、Google Hosted Libraryについて、その仕組となるCDNやキャッシュの技術などについて解説します。 よくある Web ページ 例えば自分が配信するindex.html内でjquery.2.0.3
テレビ画面はdiv要素でできている！- Hybridcastとテレビの未来 –
テレビ画面はdiv要素でできている！- Hybridcastとテレビの未来 – 仲 裕介（HTML5 Experts.jp副編集長） 日本放送協会（以下、NHK）が提供するHybridcastについて、NHKメディア企画室専任局長の加藤久和氏（以下、加藤氏）、同放送技術研究所ハイブリッド放送システム研究部主任研究員の松村欣司氏（以下、松村氏）に、Web技術者の視点からさまざまな話を聞きました。インタービューで気になったキーワードを取り上げます！ 変わりゆくテレビ 1953年にNHKがテレビの本放送を開始し、今年で60年になります。白黒からカラーへ、アナログ放送からデジタル放送へと、テレビを取り巻く技術は進化しています。特にテレビを情報端末として活用する動きは、2000年に開始した“データ放送”を皮切りに、2003年から開始されたデータ放送とインターネットを組み合わせて情報配信するデータオン
iOS7におけるMobile Safariの主な変更点
iOS7上のSafariがどのように変化したかについて、Maximiliano Firtman氏（@firt）がブログで詳細に解説しています。 この記事では、同氏のブログから、Web制作者／開発者にとって重要と思われる情報を引用して、Web技術者にとっても大きな影響を持つこのアップデートについて紹介していきたいと思います。 元記事は非常に長大、かつ詳細なため、全てのポイントを紹介することはとてもできません。素晴らしい記事ですので、関心のある人は、ぜひ元記事を参照してください。 ちなみに、最初にガッカリさせることになってしまいますが、@firt氏によれば、「1.0以降最もバグの多いバージョンだ」（this is the buggiest Safari version since 1.0）だそうです… UIが大幅に変更、フルスクリーン（に近いサイズ）がデフォルトに Webブラウジングをしている
Webサイト・アプリ高速化テクニック徹底解説 （第1回 Webサイト・アプリの高速化ファーストステップ）
「Webサイト・アプリ高速化テクニック徹底解説」ということで、本連載はWebサイト・アプリの高速化テクニックについて幅広く解説していく予定です。今回は、具体的な高速化のテクニックに触れずに、高速化が必要な理由や、スピード測定ツールなど基本的な部分について解説します。 皆さんはじめまして、「Webサイト・アプリ高速化テクニック徹底解説」というタイトルでこれから連載させて頂く、HTML5 エキスパートの吉川です。連載の初回ということもあり、今回はWebサイト・アプリの高速化に関する全体的な概要や最新情報、今後連載で触れていくトピックスなどを紹介していきます。 何故、高速化が必要なのか？ 最近では、HTML5とその周辺技術などによってWebの表現力が非常に豊かになりました。そのため、これまでのWebでは考えられなかったような多彩なWebサイトが増え、多機能なWebアプリも多く見られるようになって
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
