react-railsでサーバーサイドレンダリングしつつクライアントでsetStateできて最高になった - Qiita
土日でreact-railsとturbolinksを勉強してみた成果です やりたいこと 画面遷移するときは<div id='content'></div> の中身だけ入れ替えて、pushStateで行き来できるようにしたい reactを使ったリッチなページでも、イニシャルロードやSEOの為にサーバーサイドでレンダリングしておきたい サーバーサイドレンダリングした要素を破棄することなくReactで初期化してsetStateでガンガンViewを書き換えたい 結果どうなったか サーバーサイドでReactComponentをレンダリングしてクライアントのReact.renderで初期化情報を揃えて引き継ぎ どんな画面でもapp.component.setState({})が反映されて最高 TurbolinksでReactComponentをマウントしたルート要素だけ入れ替え その為にTurboli
Turbolinksのpartial replacementsについて
Turbolinks 3.0からpartial replacementsをサポートした事なので試してみた。 以下readmeを見ながらつらつらと。 名前の通りで、body全体の変更ではなく、body内の特定の部分のみの変更が出来る機能。 元々、turbograftというgemがあって、そのgemで提供していた機能を参考にして、本体に機能を導入したらしいです。 使い方Turbolinks.visit(path, options) 又はTurbolinks.replace(html, options) を使用した場合に、自動的にpartial replacementsが行われます。なお、最新のコンテンツをサーバから取得し直したい場合はTurbolinks.visit を、既にコンテンツを取得済みで、手動で現在のページのhtmlの置き換えをしたい場合はTurbolinks.replace を使う
13: Begrudging Applause (Aaron Patterson)
Live from RailsConf, Aaron Patterson joins the show to talk about Rails 5, Rack 2, Contributing to Open Source, and cats. We also field audience questions. Video-version of this podcast! DHH's RailsConf Keynote Aaron's RailsConf Keynote Action Cable Long Polling TurboLinks Ember RFC Process Rack 2 Neko Atsume (also on Android) Ruby Together Chicken Scheme Awful Offal Node/IO Fork Agile Web Develop
Rails 5 の足音 - 弥生開発者ブログ
こんにちは、Misoca開発部のtaiki-tです。 名古屋に引っ越して半年が経ちました。良いところですね。 さて、GWも終わってしまいましたが、2015年は9月にシルバーウィークがあるので、それまで頑張りましょう。 今回は、RailsConf 2015で紹介されたRails 5 についての話を少し紹介したいと思います。 Rails5から加わる主な機能 ActionCable Turbolinks 3.0 Rails API ActionCable ActionCableの「Cable」は、WebSocketを表します。 WebSocketというcableでユーザとアプリケーションをつなげる、というコンセプトに基づきます。 WebSocketと聞いてピンときたかもしれませんが、ActionCableは、Railsにリアルタイム通信の仕組みを取り入れるものです。 これまではRailsでリアル
Turbolinksでprogress barを表示する
Turbolinks 2.5.2からProgress Barを表示する機能が追加されたので試してみた。 使い方Turbolinks.enableProgressBar() メソッドをJSの中で呼ぶだけ。 Turbolinks.enableProgressBar() これでページ上部にprogress barが表示される。こんな感じ。 動くサンプルはこちら。 デザインデフォルトではbackground-colorは#0076ff、heightは3pxになっている。これは自分でスタイルを定義して変更する事が出来る。以下サンプル。 html.turbolinks-progress-bar::before { background-color: red !important; height: 5px !important; } まとめTurbolinks、進行状況が分かりづらかったのでこれで大分解
Fun with Turbolinks
I build great products and teams • Co-Founder & CTO @ Empathy (previously at PayPal, eBay, WeWork). I recently finished working on a small weekend project based on an idea I’ve been rolling with for almost 2 years. It’s called Coffee.Spec and it lets you create stunning coffee infographic posters for your office. It all started from this awesome Oatmeal comic about coffee, during lunch @shayhdavid
turbolinksを使うときに気をつけるべきたった一つのこと - (ﾟ∀ﾟ)o彡 sasata299's blog
2013年10月10日14:48 JavaScript Ruby turbolinksを使うときに気をつけるべきたった一つのこと さて、今更ですが、turbolinks とは pjax（Ajaxで要素を動的に変えつつ、pushStateでURLも変更しちゃう）をRailsで簡単に利用出来るようにしたものです。 pjaxを使えば、Ajaxと違ってURLもちゃんと変わるし、ブラウザの戻るだって普通に使えるからとても便利です。毎回ページ全部を評価してまるっと書き換えるんじゃなくて、必要と部分だけを入れ替えるので、レスポンスだって高速になります。 このturbolinksに関してはいろんな人が記事を書いてくれているので詳細はそちらを見ていただくとして、 Rails 4のturbolinksについて最低でも知っておきたい事 | KRAY Inc Rails4でturbolinksを謳歌するためのまと
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
