UIが嘘をつく？ ユーザ体験における「楽観的な更新」とSPAでの作り方
こんにちは、株式会社カミナシでデザインエンジニアをしているショウです。 突然ですが、UI/UX デザインにおいて、「楽観的な更新」という言葉を聞いたことがありますか？あまり聞いたことがなくても、実は日常にたくさん存在しています。 例えば、 twitter や facebook のいいねボタン。いいねをタップした直後に色がつくのですが、実はサーバーへのリクエスト送信と UI 上のいいねの色付きが同時に発生しています。つまりサーバーからの通信結果を待たずに UI を更新しています。 他に、trello でタスクカードを隣の列に移動したり、iMessage や Facebook メッセンジャーでのメッセージの送信、Kindle アプリで途中までしかダウンロード出来てない本が読めることなども楽観的な更新です。 図：楽観的な更新を採用しない時と採用した時のメッセージ送信のUI （引用元） 楽観的な更
Firebaseで作ったWebサービスを3ヶ月運用してみて、ハマったこと・知っておきたかったこと - Qiita
Nuxt.jsとFirebaseで作っていたWebサービスを7月末にリリースして、はや3ヶ月。。 RDB脳なのでFirebaseを使った開発でいろいろとハマった。。そのポイントを整理してみました。 Firebaseをはじめようとしている人の一助になれば。 Nuxt.js(SPA)+Firebaseで作っています！ 以前、以下のような記事を書いたのですが、そのFirebase関連ぽいまとめです。 ・Nuxt.js(SPA)+Firebaseで積読用の読書管理サービスを作ってみたときにハマったこと... - Qiita 前回同様、内容的にはドキュメントをよく読めば書いてあることばかりですが、 実際に運用したり、機能追加したりする時に、気づくので、手戻りが多く... あらかじめ、知っていたら良かったなと思う点をまとめています。 Firebaseはとてもよいですが、RDBに慣れ親しんでいると、 思
弊社マッチングアプリ「CoupLink」をVue.jsでSPA化しました | LINKBAL Blog
はじめまして、リンクバルエンジニアの北村尚之です。 弊社が運営するマッチングアプリ「CoupLink」ですが、今年の夏にソースコードの全面的なリプレイスを行いました。 具体的には、Vue.jsというライブラリを用いてフロントエンドをSingle Page Application(以下SPA)化しました。 また、HTMLを提供していたバックエンドも、DB設計からやり直し、APIサーバーとして一新しました。 この記事では、主にフロントエンド部分について、下記の話をしたいと思います。 リプレイスの目的 SPA化にあたり考えたこと 設計について Vue.jsの学習コストについて リプレイスの目的 SPA化による高速化 今回の改修以前のCoupLinkは、Ruby on Railsで組まれた通常のHTMLを返すWebページをベースに、ハイブリッドアプリとして提供されていました。 この構成だと、画面遷
レガシーシステムの大規模リプレイスで分かった「Vue.jsでSPAならNuxt.jsが有力」 #エンジニアHub - エンジニアHub｜若手Webエンジニアのキャリアを考える！
レガシーシステムの大規模リプレイスで分かった「Vue.jsでSPAならNuxt.jsが有力」 10年以上前に作られたレガシーシステムをVue.jsで大規模リプレイスしたエムスリーに、導入して感じたVue.jsのメリットや、活用法を伺いました。 JavaScript（JS）のフレームワークは、何を使うのがベストなのでしょうか。ここ3年ほどで数々のJSフレームワークが誕生していますが、React、Angularという二大巨塔を超えるものはなかなか現れていません。 そんな状況の中、GitHubではReactを上回るスター数を誇っている1のが、2014年のリリース後、着実に進化を重ね、日本でも採用事例が増えてきているVue.jsです。「JavaScript ベスト・オブ・ザ・イヤー」に2016年、2017年と2年連続で選ばれているほか、Ruby on Rails（Rails）やLaravel とい
ReactとAngular、使うならどっち？ JavaScriptギークが6つの視点で徹底比較 - エンジニアHub｜Webエンジニアのキャリアを考える！
ReactとAngular、どちらを選ぶべきか？ 使用するJavaScriptフレームワークを選ぶ際、この2つはよく比較対象に挙がります。しかし、両者の特徴をよく理解していなければ、選定は困難でしょう。 今回は、両フレームワークが具体的にどんな強みを持っているのかを、Reactの専門家 小林徹さんとAngularの専門家 稲富駿さんに解説してもらいました。両フレームワークの設計思想から使用において考慮すべき点、今後実装される予定の機能まで、利用者が気になるポイントを網羅しています。 JavaScriptギークである2人のノウハウ、ぜひ選定の参考にしてください！
CSSレスポンシブデザインをSPAで使うと破滅する - 橋本商会
レスポンシブデザインは あくまで見た目の調整、表示・非表示のコントロールなので 下手に使うと、デバイス毎にインタラクションが違うUIのstateが無茶苦茶複雑になっていく コンポーネントという概念が無かった時代の設計を、SPAに持ってくるのはおかしい 画面サイズ毎にCSSで手軽にを切り替える、というのなら良い しかし、画面サイズ毎にインタラクションが違う部品が出てくると設計が破綻する 画面サイズ毎のがごちゃ混ぜになる コードが追えなくなり、バグの温床になる では、どうするか？ 素直に画面サイズ毎、デバイス毎、あるいはインタラクション毎のReactコンポーネントを書けばいい 使いまわせる部品は、コンポーネントとして切り出して再利用する 歴史を紐解く 2011年頃、レスポンシブデザインが生まれた 当時のwebにはコンポーネントが存在しなかった 単体で複雑な状態遷移をするインタラクティブなパーツ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Nuxt.js v2とGAE/SE Node.jsでSPA×SSR×PWA×サーバーレスを実現する - DMM inside
