Flux react現状確認会
2. 前提となる適用先 • 管理画面的なWebアプリケーションのリニューアル …だったもの（仮） • REST APIを前提としたSingle Page Applicationもどき （※すべてが1ページではないけど） • 機能・画面が多い • 複雑化することがほぼ確実 3. Viewへの要求事項 • 統一されたスタイルでUIとなるHTMLを生成できる • なるべく簡単に書けること（含セキュリティリスク回避） （生DOM・jQueryはあり得ない） • 業界におけるパラダイムが過渡期のため、 巨大フレームワークに乗っかりたくは無い （交換可能な部品の組み合わせでプレーンに） • 困ってもなんとか出来るための緊急ハッチも必要
Service WorkerとHTTP/2が切り開く新しいWeb Pushの世界 - ぼちぼち日記
この記事は、HTTP2 Advent Calendar 2014の6日目のエントリーです（2日前にフライイング公開してます）。 1. はじめに、 HTTP/2仕様の標準化作業は、WGラストコールも終わり、今後IESGレビューやIETFラストコール等の大詰めの段階に来ました。来年のRFC化に向けてまだまだ予断を許しませんが、プロトコル設計自体の作業はほぼ完了し、後はすんなり行くことを祈るばかりです。 こんな状況なのに気が早いですが、もう既に標準化後を見据え、HTTP/2の機能を使った新しい仕組みを作る動きが始まっています。 そこで今回はHTTP/2技術の応用として、HTTP/2の「サーバプッシュ機能」と今ホットなブラウザの新技術「Service Worker機能」を組み合わせた次世代のプッシュ機能「Web Push/Push API」について書いてみたいと思います。 ただ、個人的に色々タスク
React.jsを触った感想 - axross blog
2014-12-25 React.jsを触った感想 Javascript React.js Virtual DOM クライアントサイドJS ここ二週間ほどReact.jsを触っていて、業務でも今の案件で使うことにしたので、簡単な紹介と、触ってみた感想。 React.jsについて A JavaScript library for building user interfaces | React React.jsは、Facebook製のクライアントサイドJSフレームワーク。 Angular.jsなどの並べられがちだけど、ああいう俗にいう「MV*」でフルスタックなものとは違って、View層に特化している。 3つの特徴 UIに特化 ここでいうUIとは、UI部品のことで、つまりは複数のDOMを内包する1つの部分的なDOMツリーのこと。これをReactではComponentと呼んでいる。 このComp
Stream API がブラウザにやってくる - Block Rockin’ Codes
Intro 今日は、フロントのプログラミングスタイルに、にまた一つ大きな変化をもたらすであろう Stream という API についてです。 この仕様は現時点でまだ策定中であるため、 API は変更される恐れがある点にご注意ください。 Stream API 以前 「Node.js の Stream API で「データの流れ」を扱う方法」 という記事を書きましたが、簡単に言うとあれがブラウザにもやってくるという話です。 非同期処理おさらい もう何度も書いた話なので駆け足で。 JS はシングルスレッドでイベント駆動な世界なので、何をするにも非同期であり、コールバックを登録することで完了した結果を受け取る API が基本です。 これは、ブラウザの DOM の API でも、 Node.js でも共通しています。 概念を疑似コードで書くと以下のような感じです。 console.log('1');
Yehuda Katzという生き方とインディーWeb - ワザノバ | wazanova
https://frontsidethepodcast.simplecast.fm/16 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 41分前 昨日のエントリーでも名前のでてきたYehuda Katzですが、Rails / Ember.js / jQuery / W3C Technical Architecture Group (TAG) / TC39-ECMAScriptなどで活躍し、今回はRustのコアチームに参加することが発表されてます。Tom Dale曰く「インターネットの半分くらい書いてる感じだから。[1] 」という勢いがあります。Yehudaの仕事振りやプロジェクト運営における考えは、オープンソースという視点での発言ですが、企業におけるプロジェクトの進め方や今後の働き方のスタイルがどう変わるか、変
io.jsについて知っていること - from scratch
今、Node.jsに起きてることを語る上で、io.jsは避けて通れない話題でしょう。 今回のNode.js アドベントカレンダー 2014の締めを飾るために、このio.jsについて僕が知っている限りの事をまとめて書くことにします。 io.jsを知り、今後"Node"がどうなっていくのかを皆で一緒に考えていきましょう。 またこの一連のio.jsのfork騒動はOSSという特殊なプロジェクトをどう進めていくのがハッピーなのかを知る一つの教材だと思います。 OSSに関わっている皆さん、今回も長いですが、最後まで読んでもらえると幸いです。 io.js とは何か Node.jsのForkです。次のNode.jsの安定版になる、v0.12をForkしています。「アイ・オー ジェイエス」と読みます。名前の由来は木星にある四番目に大きな衛星の名前から取られました。*1 Nodeを使っている人のことをnod
slightlyoff/NavigationController · GitHub
Service workers are a new browser feature that provide event-driven scripts that run independently of web pages. Unlike other workers, service workers can be shut down at the end of events, note the lack of retained references from documents, and they have access to domain-wide events such as network fetches. Service workers also have scriptable caches. Along with the ability to respond to network
RESTful Web API 開発をささえる Garage (client 編) - クックパッド開発者ブログ
料理動画事業室の @yoshiori です。前に「RESTful Web API 開発をささえる Garage」で紹介した RESTful Web API を開発する Garage のクライアント側のライブラリを公開しました。この記事ではその使い方を紹介したいと思います。Garage の設計思想やサーバ側の実装については上記記事を御覧ください。 今回は簡単にクライアント側の挙動を知っていただくために pry を使って説明したいと思います。 アクセスするサーバは先程の記事で作成したアプリケーションを使用してみます。 サーバの準備 https://github.com/taiki45/garage-example の README にも書いてありますので簡単に進めたいと思います。 まずは下準備としてコードを github から clone してきて、ライブラリのインストールと DB のマイグレ
HTML5 – Check it Before you Wreck it with Mike[tm] Smith | HTML5 Doctor
The W3C’s Mike[tm] Smith (AKA @sideshowbarker) is the man with his head in the W3C validation markup checking tool source code; he makes the magic happen. Questions were asked for the HTML5 Doctor reader’s delight and edification. Russian Translation: Не проверив HTML5-кода, не суйся в воду — с Майком Смитом First off tell us a bit about what you do and what you work on Mike[tm] Smith – Deputy Di
![HTML5 – Check it Before you Wreck it with Mike[tm] Smith | HTML5 Doctor](https://cdn-ak-scissors.b.st-hatena.com/image/square/fa90b83be07846bb6fc736664b4415ebecceadd7/height=288;version=1;width=512/http%3A%2F%2Fhtml5doctor.com%2Fwp-content%2Fuploads%2F2014%2F10%2Fms-e1414048507324.jpeg)
AngularJS 2.0 のご様子 - Can I do web?
Advent Calendar 20日目のポストです。 ちょうど2.0について書こうと思ってたところに、昨日さらにつっこまれたので取りあげてみます。 で、画像中の記事がこちら この記事について振られたので調べてみた。 元記事をお読み頂きつつ。 #ツールに新たに追加される概念は、1つではなく3つ！ これは2.0になるので知っておこう、なのでそうなりそうです。 ただし、AtScript については Optional な感じで良いと思います。TypeScript + AngularJS な人は知っておくと恩恵があるのではないでしょうか。 #変わるが、良くならない このコードのサンプルだと、記述が変わったなということ位しかわからくて、あまり意味がありません。v2.0 では、Web Conponents や以前から統合するといっていたPolymer との連携を考慮すると、従来通りの Attribut
Smashing Magazineのパフォーマンス改善ケースが凄まじい件 - MOL
Frontrend Advent Calendar 2014 - Qiitaの24日目。たぶん。知らんけど。 ちょっと前になるが12/13にバンクーバーで開催されたThe Style & Class Conference 2014に参加してきた。前日にSmashing Conferenceが、ウィスラーというバンクーバーから比較的近い所で開催されていて、本当はそっちに行きたかったんだけど高額なため、地元コミュニティのほうにだけ参加した。ウィスラーの方の記事は@ygoto3が書いてたっぽい。 Smashing Conferenceで登壇していたJohn Allsopp氏やVal Head氏もこのカンファレンスで登壇するということで、『なんだ、ウィスラーのついでかよー』と思い全然期待してなかったのだが、行ってみたらカンファレンス全体の構成などすごく考えられていて、とても素晴らしいカンファレンス
#HTTP2Study の軌跡 - Block Rockin’ Codes
Intro この記事は HTTP2 アドベントカレンダー 24 日目 の記事です。 HTTP2Study HTTP2 Study は、2013年8月くらいから小さく小さく活動しているコミュニティです。 HTTP2 もまだ HTTP2.0 と呼ばれていた頃で、 Draft でいうと 04 くらいですね(今は 16)。 (ちなみに、現在の仕様では "HTTP2.0" ではなく "HTTP/2" もしくは "HTTP2" が正しい名称です。) 仕様を策定してる HTTPbis としての議論は概ね片付いて、 HTTP2 の仕様は RFC にするための次のステップに移り、もし仕様を覆すような大きな指摘が無ければ、来年の頭にはこのまま RFC として公開されるかもしれないというところまで来ました。 そして今日はこの仕様策定をずっと追いかけてきた HTTP2Study がやってきたことを、簡単にまとめて
Fetch API 解説、または Web において "Fetch する" とは何か？ - Block Rockin’ Codes
Update [14/11/11]: Chromium での実装が M40 からあるそうなので、末尾に引用追記させていただきました。 [14/11/12]: この記事を書くにあたって、色々なかたにレビューや助言を頂いたのですが、謝辞などが一切抜けてました、本当にすいません。追記しました、ご協力頂いた方々本当にありがとうございました。 WHATGW Fetch Spec WHATWG のメンテナンスするドラフトに Fetch Spec が追加されました。 もうすでに日本語訳もあります、すばらしい。Fetch Standard 日本語訳 この仕様には二つのことが定義されています。 "Fetching": Fetch するとは何か? の定義 "Fetch API": fetch() の定義 後者の定義に基づく fetch() という DOM API の実装も始まっています。(詳細は後述) しかし
Fetch Standard （日本語訳）
Fetch Standard （日本語訳） Fetch Standard 日本語訳 このページ は、 WHATWG による， 2013 年 8 月 30 日時点の Fetch Standard を日本語に翻訳したものです。 この翻訳の正確性は保証されません。 この仕様の公式な文書は英語版であり、この日本語訳は公式のものではありません。 【 と 】で囲まれた部分は【訳者による注釈】です。 （他のウェブ関連仕様の一覧と共通機能の詳細） 更新： 2013-08-30 （公開： 2013-04-27） このページの大部分はスクリプトにより生成されています（ 古いブラウザなど，一部のブラウザには対応していません： 生成中…この表示が消えない場合はどこかでエラーが生じています）。 本文ダブルクリックで当該箇所の原文が表示されます（左下隅に各種 表示切替ボタン — CSS や DOM の対応が古いブラウ
gulpで依存関係を考慮した自動コンパイル - Hatena Developer Blog
こんにちは、シニアアプリケーションエンジニアのid:taraoです。はてなエンジニアアドベントカレンダー2014の21日目として、依存先のファイルが更新されたらコンパイルしなおす処理をgulpで実現する方法について、とくにLessを例にとって紹介します。 はてなでは、JavaScriptやCSSなどの静的ファイルをTypeScriptやLessなどからコンパイルして生成することが増えています。CSS(Less)は主にデザイナが書くため、コンパイル手順はできる限り簡単にする必要があります。多くのチームでは、サーバアプリケーションをローカル環境で実行している最中はファイルの変更に応じて自動的にコンパイルしなおすようになっています。 ファイルの更新監視からコンパイルまでの処理にはGruntなどを使ってきましたが、コンパイル対象のファイルに依存関係がある場合、依存先のファイルの変更に応じて依存元の
Introduction to Service Worker: How to use Service Worker - HTML5 Rocks
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
Chrome 40 で今すぐ ServiceWorker を試す - Qiita
Chrome では、リリース 40 からごく一部で「マシな AppCache」とも言われている ServiceWorker がデフォルトで使えるようになります。ServiceWorker はオフライン API の1つとして紹介されていることが多いですが、実は 「Webの世界観を変える (かもしれない) 大注目API」の1つです！ ここでは、Chrome 40 で出来たての ServiceWorker をひと通り試す方法を書いてみたいと思います。 ServiceWorker とは? 詳しいことは最新スペック (Editor's Draft)やHTML5Rocks の記事を見てもらうとして、ものすごくざっくり書くと ServiceWorker とはバックグラウンドで実行される Javascript 環境のことで、 ブラウザ内で動くJavascriptで書いたネットワークプロキシ のように動作さ
Chrome40にservice workersがきた
Chrome 40になってService workersが来たらしい。デモを動かしてみたり自分で書いてみたりして紹介記事でも書こうかなと思っていたが、 +Hajime Morrita はRebuild.fmに出演して紹介してしまったし、ほかにもすでにいくらか紹介記事が出始めてきた（たとえばhttp://qiita.com/kinu/items/2abd61b4390f9bbaffc9）。賑やかしにと自分もスクリーンキャストの動画も撮ってみた。 ここではデモの補足として、Service workersってどんなものなのかをふんわり考えてみる。 Service workers とは って項目を書いたのだがこの説明が難しい……。新しいウェブのAPI、だけだとだからなにって感じ。Service workersはweb workersの一種なのだが、って説明しはじめると泥沼に嵌りそうだ。 Servi
web workers三兄弟
Service workersの仕様を説明していて思ったのだが人々はどれぐらいweb workersのことについて詳しいのだろうか。 あんがい知らない気がするので簡単に解説してみる。まあ俺もニワカです。 共通部分 ブラウザのなかで、ウェブページとはある程度独立して、ある種の処理をするためのスクリプトを実行するモノのことをworkerと呼んでいる。ようするにJSの実行環境というかVMインスタンスというか。 ブラウザのなかでふつうのJSの実行環境であるタブの中とはいろいろ違うが、 windowオブジェクトがない。一部のJS APIは使えないしdocumentなどは持たない。DOMツリーもさわれない ただしメッセージループは持つ。windowはないがselfというやつがいてこいつを使う（self.onmessage = function() { ... } みたいな感じ） タブのなかとはmess
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
NavigationController/explainer.md at master · slightlyoff/NavigationController · GitHub