Web Platform Dive into the web platform, at your pace.
The Polymer library is in maintenance mode. For new development, we recommend Lit. The Polymer library provides a set of features for creating custom elements. These features are designed to make it easier and faster to make custom elements that work like standard DOM elements. Similar to standard DOM elements, Polymer elements can be: Instantiated using a constructor or document.createElement. Co
こんにちは。PR TIMESフロント・エンジニアの山田です。 弊社ではAjaxを使ったサイトやサービスも多く運営しています。 さて、そのAjaxですがページ遷移なしにコンテンツを切り替える場合、当然ながらそのままではブラウザのURLも変わりません。これではユーザーが直接読み込み先にアクセスしたり、ブラウザのBACKボタンで前に戻ったりできないので不便です。そんな時に使えるのが、Hisotry API。これはブラウザの履歴をJavascriptから管理、操作できる便利なAPIです。 まず以下の4つは以前からあり、古いブラウザでも動作します。 history.back();//表示した履歴の1つ前のページにもどる history.go(4);//表示した履歴の4つ前のページにもどる history.go(2);//表示した履歴の2つ先のページに進む history.forward();//表示
JavaScriptでフレームワークを書くのはもうやめましょう。 JavaScriptフレームワークというものは、あたかも避けられない死と税金のようなもの、絶対にぶちあたる避けられないものといわれています。こっそり聞いてみましょう、新しいウェブプロジェクトが始まるとき、一番初めに聞かれる質問は?十中八九は「どのJSフレームワーク使っているの?」でしょうね。昨今の業界においてJSフレームワークというものは本当に根深く浸透しているのです。でも、だから必須だというものではないのです。実際、もう使うべきではないのです。 どうしてこういった結論に至ったのか、振り返ってみましょう。 AngularにBackbone、Ember・・・ ここのところ長い間、 ウェブプラットフォーム とはHTML+CSS+JS、と簡潔に技術用語の羅列でまとめられてしまっていましたが、そこにはもっとぴったり表す用語“大混乱”
1 pixel|サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 みなさんこんにちは。アメーバ事業本部の泉水(@1000ch)です。 今日はHTMLをコンポーネント化するWeb Componentsという新しいHTMLの仕様と、 その機能を補完するPolymerというライブラリについてお話させていただきます。 Web Components Web Componentsについては、2013年のHTML5 ConferenceでGoogleの夷藤さんがセッションされていました。夷藤さんはChromeチームで、Web Componentの周りの実装をされていたり、Shadow DOMの仕様の編集をされています。 セッショ
今日の概要 実は使われてるJavaScript AST JavaScript AST(Abstract Syntax Tree)とは? JavaScript ASTを使ったツール紹介 使うだけじゃなくて書いてみよう browserify Node.jsで書かれたものをブラウザ向けに変換するツール Node環境で開発 -> browserifyでビルド -> ブラウザで動く JavaScriptのコードを 変換 する ≒ JavaScript ASTを見て変換 する 本体の色々な部分、transform pluginなどでASTを使ってる
2013年4月27日、六本木ヒルズ森タワーのグーグルにて「第38回HTML5とか勉強会」が開催された。HTML5とか勉強会とは、HTML5に関心のあるエンジニアやWebデザイナ向けの勉強会だ。今回のテーマはJavaScriptのテストフレームワーク。別室のサテライト会場を用意しなくてはならないほど会場は多くの参加者であふれた。テーマへの関心の高さがうかがわれる。テストフレームワークを使いこなす現場のプロたちの解説により、その最新事情と基本的な使い方が分かった。 JavaScriptテストの必要性と最新事情 サイボウズの佐藤鉄平氏は、JavaScriptのテストの基礎知識と全体像について語った。 公開スライド 佐藤氏は、結合テストやユニット(単体)テスト、そのほかにユーザビリティテストなど、そもそもテストにはどんな種類があるのかを解説した後、ユニットテストの重要性を強調した。技術面で開発チー
外道はるかぜちゃんジェネレータというWebアプリを いまどきな手法を用いて爆速で開発した話を紹介します。 先の3連休中、外道はるかぜちゃんジェネレータというWebアプリを開発&公開しました。ここで採用した開発手法がいまどきな爆速開発でしたのでちょっと紹介&ステマします。使った技術は以下の通りです。 AngularJS: Googleが開発しているViewModelなWeb開発ライブラリ(MVW: Model View Whateverだったかな?w) Github pages: スタティックサイトのホスティングに最適 Kii Cloud: mBaaS (mobile backend as a service) で共有データの保存に利用 HTML5 Canvas: 画像生成に。サーバサイドではなにもしてない! サービス概要 外道はるかぜちゃんジェネレータはベースとなる画像があり、そこに面白い
HTML5向けのゲームエンジンとして国内で知名度を上げて来たenchant.jsのブース出展としては今回が2回目。 残念ながらセッションを取材する時間は取れなかったが、その分、ブースに集まって来たさまざまな情報から、次世代ゲームのあるべき具体像が明確化してきた。 1. かつて億単位のライセンス料が必要だったハイエンドゲームエンジンが原則無料で使用可能に 今回、PS4の発表に合わせてUnreal Engine 4(以下、UE4)やCryengineなどハイエンドゲーム向けのゲームエンジンのバージョンアップが多数発表された。 UE4はPS3、Xbox360世代でデファクトスタンダードの地位を確立したUnreal Engine3の正統的なバージョンアップで、新世代のハードウェアに対応した機能が多数搭載された。 CryengineはCrytechのゲームエンジンで、こちらもハイエンドゲーム向けだが
「守りたい、そのブロック」――「ブロック崩し」の発想を逆転させたゲーム「ブロック崩さぬ」がTwitterで話題だ。ブロックを「崩さない」ように画面上のバーを操作するゲームで、スマートフォンやPCのWebブラウザから無料で遊べる。 ブロック崩しは、落ちてくるボールに画面上のバーを当て、跳ね返してブロックを崩すゲームだが、ブロック崩さぬは逆。バーにボールが当たらないよう操作し、ボールを落とすほど得点が積み上がり、ブロックが全部崩れたらゲームオーバーとなる。得点をTwitterでつぶやき、ほかのプレイヤーと競うこともできる。 うちょ(@utyo)さんが、ゲーム開発などに利用できるJavaScriptライブラリ「timlib.js」を使って開発した。「仕事をサボッてる時に思いつきました!ブロックを崩さないゲームです!!!往年の名作ゲームに真っ向からケンカを売る形になります!!よろしくおねがいします
単純ではない、最新「クロスサイトスクリプティング」事情:HTML5時代の「新しいセキュリティ・エチケット」(2)(1/3 ページ) 連載目次 皆さんこんにちは。ネットエージェントのはせがわようすけです。第1回目は、Webアプリケーションセキュリティの境界条件であるオリジンという概念について説明しました。 現在のWebブラウザーでは、同一オリジンのリソースは同じ保護範囲にあるものとし、オリジンを超えたアクセスについてはリソースの提供元が明示的に許可しない限りはアクセスできないという、「同一オリジンポリシー(Same-Origin Policy)」に従ってリソースを保護しています。 その保護範囲であるオリジンを超え、リソースにアクセスする攻撃の代表事例であるクロスサイトスクリプティング(XSS)について、今回、および次回の2回に分け、HTML5においてより高度化された攻撃と、その対策を説明しま
ブラウザ間でリアルタイム通信を実現する WebRTCのプラットフォーム「SkyWay」の提供開始 およびライブラリ・ソースコードの公開について ~国内初の公開トライアルで、WebRTCの普及を促進~ NTTコミュニケーションズ(略称:NTT Com)は、ブラウザ間でリアルタイム通信を実現するWebRTC(Web Real-Time Communications)技術を活用するために開発したプラットフォーム「SkyWay」の無償提供と、ソフトウェア開発支援サービスGitHub*1上における「SkyWay」のライブラリ・ソースコードの公開を開始します。「SkyWay」のプラットフォームやライブラリの利用によって、WebRTC技術を利用したWebアプリケーション(音声や映像を使ってコミュニケーションできるアプリケーションなど)の開発を簡単にすることができます。 1.背景・目的 (1) WebRT
Canvas、WebGL、WebRTC、WebSocketなど、HTML5の花形スターとも言えるモテ系APIは、常に世間の注目を集めている。これらAPIを使いこなせるウェブディベロッパーはどこからも引っ張りだこだろう。しかし、注目度が低いながらも、今後のウェブを支える(かもしれない)最新のAPIが数多く存在する。このようなAPIは派手さが足りないゆえに話題になることもない。しかし、これら非モテ系のAPIも含めてHTML5だ。 本セッションでは、ありきたりのモテ系APIに飽きたマニアな貴方のために、普段は陽の当たらないAPIを一挙紹介する。もちろん、どれかのブラウザーに実装されているAPIのみだ。今から使おうと思えば使えないことはない。そして、W3Cにて仕様策定が始まって日が浅いため、明日にはどうなるか分からない。無くなるかもしれないし、大幅に変更されてしまうかもしれない。今覚えても役に立た
本シリーズは、WebブラウザをUIとして利用した業務システムやアプリケーション(以下、Webシステム、Webアプリケーション)のテストをテーマとして、Webブラウザを使ったテストを自動化するOSSのツール「Selenium2」を紹介します。業務システム開発の現場で適用してきたノウハウを元に、これまでSelenium2について知らなかった人から以前使った経験がある人まで、より実践的な「使える」内容を盛り込んでいきたいと思います。 本シリーズのスコープと対象読者 本シリーズはWebシステム・Webアプリケーションのテストの中でも「Webブラウザを操作して実施するテスト」をスコープにしています。開発工程としては、1モジュールとして単体テストに位置付けられる場合もあれば、複数のモジュールやシステムと連携して結合テストや総合テストに位置付けられる場合もあるでしょう。これらのテストのことを、本シリーズ
Create engaging videos, images, and HTML5-based designs for your business that can run on any device Intended for business use only Features that help businesses bring ideas to life Google Web Designer gives you the power to create beautiful and compelling videos, images, and HTML5 ads. Use animation and interactive elements to build out your creative vision, then scale your content for different
HTML5によるハイブリッドアプリをオンラインの統合開発環境で開発できる「Monaca」が正式版をリリース。3プロジェクトまで無償 HTML5/CSS/JavaScriptのWebテクノロジーでアプリケーションを開発し、PhoneGapでビルドしてモバイル向けのハイブリッドアプリを生成できるオンラインサービス「Monaca」が正式版として公開されました。 Monacaはオンライン上でエディタ、コンパイラ(PhoneGapによるビルド)、デバッガ、実機へのアプリの転送、実機上での実行機能などを備えたモバイルアプリケーションの統合開発環境。PhoneGapによるビルドで、iOS、Android、Windowsに対応したアプリケーションが生成されます。 Webブラウザ上の開発環境にも簡易なプレビュー機能が備わっており、動作確認できますが、モバイルデバイスへその場で転送してデバイス上で即座に動作確
cocos2dっていうiPhoneでは有名なゲームエンジンがあるんだけど、それのHTML5版でcocos2d-html5ってのがある。 http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Cocos2d-html5 これ、ちょっとまともに調べてみたけどかなり凄い。 凄いんだけどいまいちZyngaの日本での頑張りが足らないのか記事が少ないので、ちょっと紹介する。 ダウンロードとか とりあえず自分で触ってみるわって人は、上のリンクからCocos2d-html5-v何がしの最新版リンクをクリックしてダウンロードすればいい。 この記事時点ではCocos2d-html5-v2.1.4が最新。 サンプルゲームはpixi.js辺りに比べるといまいちだけど、個別の機能を確認するのはcocos2d-html5のテストプログラムが使える。 http://www.c
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く