[B! Vue] momochin44のブックマーク

Vue・React・Angularのパフォーマンス比較検証 - ICS MEDIA

ウェブのフロントエンド開発に役立つライブラリとして、VueとReact、Angularがよく取り上げられます。これらのライブラリは、SPA（シングルページアプリケーション）の開発に役立つ多くの機能を持っています。フレームワークを選定するには、「人気だから使う」という短絡的な理由で選択をするのは望ましくありません。設計思想や機能の種類、学習コストなどの観点で、プロダクト・プロジェクトチームへの適性を検討するのがセオリーです。幸いにも、それぞれを比較した記事がウェブに数多くあり、選定のヒントを簡単に得ることができます。一方、機能面の比較ばかりが取り上げられ、性能面で紹介されている記事が少ないように見受けられます。記事『サービスにおいて速さこそが神である｜深津貴之』でも紹介されているように、昨今のウェブはスピードが求められる時代でもあり、ライブラリの性能評価の記事があってもよいのではないで

momochin44 2019/08/01

リンク

FormVuelar

Vue form components with server side validation in mind.

momochin44 2019/02/14

Vue

リンク

「Vue Fes Japan 2018」に参加してきました - ozaki25’s diary

Vue Fes Japan 2018に参加してきました。 vuefes.jp 会場A 会場B キーノート Evan You - Next-level Vue Animations Sarah Drasner Vue.js と Web Components のこれから Takanori Oki Vue Designer: デザインと実装の統合 katashin Unit testing a Vuex store Edd Yerburgh Atomic Design のデザインと実装の狭間菅原孝則 Nuxt.js 2.0 Sébastien Chopin A deep dive in SFC compilation Rahul Kadyan note のフロントエンドを Nuxt.js で再構築した話福井烈 Vue CLI 3 and its Graphical User Interf

momochin44 2018/11/07

Vue

リンク

Vue.js SEO-Friendly SPAs: Tips, Tools & Prerender Example

Do you know about Hulu's JavaScript fail story? Back in 2016, the online video streaming service experienced a 56% visibility drop due to bad JS handling. A nightmare no business wants to go through. To avoid such disasters, you have to know what you're doing when working with modern JavaScript frameworks. Here at Snipcart we are expert of JavaScript for e-commerce, and we love Vue.js. However, we

momochin44 2018/10/30

リンク

基礎から学ぶ Vue.js

どんな本？機能ごとに解説している Vue.js 入門書です。これからはじめる方にも、すでに Vue.js をお使いの方にも、楽しんでいただける内容になっています。しっかり学習できる！ Vue.js は直感的に使える機能が多く、雰囲気で使ってしまいがちです。どんなメリット＆デメリットがあるかも解説しているため、しっかりと学習できます。「Vue.js が楽しい！」ウェブフロントエンド界隈でこの言葉を耳にすることが増えました。フロントエンドを取り巻く技術の進化によって、フロントエンドの役割は増え、フレームワークもより身近なものになっています。この本では「Vue.js ってなに？」「フレームワークってなに？」という基礎概念と導入からプロダクトに役立つ情報までを体系的に解説しています。これから JavaScript のフレームワークを始める方にはもちろん、すでに Vue.js をお使いの

momochin44 2018/10/23

リンク

vue-cli 3.0で始めるPWAとVue.jsのconfig周り

Domain error Failed to resolve DNS path for this host

momochin44 2018/10/12

Vue
Vue.js

リンク

一休.comレストランのスマートフォン検索ページがSPAになりました - 一休.com Developers Blog

一休.com レストランは今年の 7 月 18 日、スマートフォン向け検索ページのリニューアルを行いました。このエントリーでは、その中身について少し紹介させていただきます。検索ページの課題一休.com レストランではスマートフォン向け検索ページに対して「遅い」という課題意識がありました。これは技術面で少しブレイクダウンすると; パーソナライズドを含む複雑な処理を行っているため、サーバーサイド処理が重い。 UI 上無駄な遅延処理を行っているため、クライアントサイドの描画が遅い。というサーバー側とクライアント側両方の課題がありました。クライアントサイドの「無駄な遅延処理」というのは; 検索結果取得が REST API 化されているにも関わず、再検索の度にページリロードを行い、サーバーサイドの描画からやり直している。という実装に問題がありました。下図がリニューアル前のページ描画の様子です

momochin44 2018/10/09

リンク

レガシーシステムの大規模リプレイスで分かった「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 とい

momochin44 2018/09/26

リンク

お天気アプリで学ぶVue.jsのAPI連携｜ Tips Note by TAM

Vue.js で気象情報を表示させてみたいなとふと思い立ったので実際に作りながらVue.jsのAPI連携についてもまとめてみました。今回実装するに当たってAPIからデータの取得が簡単に行えるaxiosを利用します。基本的なVue.jsの使い方は公式ドキュメントがあります。 Vue.js - 基本的な使い方 axiosに関してより詳しく知りたいという方は以下のリンク先でご確認ください。 GitHub - axios/axios: Promise based HTTP client for the browser and node.js ■以下のように特定地域の気象情報をVue.jsで描画させることを目指します。デモページ ■必要な準備 OpenWeatherMapでアカウント（無料）を作成し、APIキーを取得する OpenWeatherMapでは気象情報を取得できるAPIサービスが用意

momochin44 2018/09/19

Vue
Vue.js

リンク

Vuex でショッピングカートを実装できる無料コース「Vuex for Everyone」を受講した - kakakakakku blog

Vue School の無料コース「Vuex for Everyone」を受講した．Vue.js 初心者でも受講できるレベルになっているし，今まで Vue.js を書いたことはあるけど，Vuex はまだ使ったことがないという人にもオススメできる．進め方にもよるけど，写経するとしても2,3時間あれば終わる． Vuex for Everyone 今回受講した「Vuex for Everyone」の題材は「shopping-cart」で，ステップバイステップに実装を進めていく．動作確認をしながら，機能を追加したり，リファクタリングをしたりする． vueschool.io 動画を見るとわかるけど，とにかく実装スピードが早いので，写経する場合は何度も戻して見直す必要がある．ただ困ったときは Vue School の GitHub にセッションごとにコミットされているので，それを活用すればオッケー．

momochin44 2018/09/18

Vue
Vue.js

リンク

Vue Patterns

GitHub PatternsComponent DeclarationComponent CommunicationComponent Events HandlingComponent Conditional RenderingDynamic ComponentFunctional ComponentRenderless ComponentCompositionPassing Props & ListenersHigher Order Component (a.k.a. HOC)Provider / ConsumerDependency injectionHandling ErrorsProductivity TipsUseful LinksFullstack Vue BookTranslations

momochin44 2018/09/18

リンク

『jcb カジノ』オンラインパチンコ儲かる|vuejsradar.com

ベラジョンカジノ儲かる 2014年度のアニメーション・アートデザイン専攻の学生がゴミを持ち帰る実践活動を行いました！オンカジ儲かるライブカジノアイオーデポジットなしボーナスなしメディアコミュニケーションクラスのイメージデザインコンペティションはシンガポールスロットオンラインで無事終了しました。

momochin44 2018/07/12

リンク

Buefy: lightweight UI components for Vue.js based on Bulma

Buefy is a lightweight library of responsive UI components for Vue.js based on Bulma framework and design.

momochin44 2018/07/09

リンク

vueとfirebaseでブラウザチャット - Qiita

ブラウザのチャットを作ります。成果物デモ https://anywaychat.netlify.com コンセプト夏休みのプログラミング教室を想定してコマンド打たない開発環境の構築をしない多少「こんなん作れんだ！」感があるもの使うもの vue Bulma firebase realtime database 何かのオンラインエディタ(考え中) 実装 <html lang="ja"> <head> <meta charset="utf8" />  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://cd

momochin44 2018/07/09

Firebase
Vue

リンク

SEO、OGP……Vue.js製SPAの「困った」を解決できる「Nuxt.js」が便利だ！

Vue.jsでSPAを作ったものの、検索エンジンのクローラーやSNSのOGP取得といった問題で困ったことはありませんか？サーバーサイドレンダリングを簡単に構築できるNuxt.jsの活用方法を解説します。ユニバーサル（Isomorphic）JavaScriptはJavaScriptコミュニティで一般的な用語になりました。ユニバーサルJavaScriptとは、クライアントとサーバーの両方で実行できるJavaScriptコードのことです。 Vue.jsを含むモダンJavaScriptフレームワークの多くは、シングルページアプリケーション（Single Page Application : SPA）の構築を目的に作られています。シングルページアプリケーションはページがリアルタイムで更新されるので、アプリの動きが軽快でユーザーエクスペリエンスが向上します。さまざまな利点がありますが、欠点もありま

momochin44 2018/07/09

Vue
Nuxt.js

リンク

《WordPress》2017年末にWP REST API で取得してVue.jsで描画するまでのまとめ。 - Qiita

《WordPress》2017年末にWP REST API で取得してVue.jsで描画するまでのまとめ。JavaScript WordPress Vue.js WordPress では WP REST API で投稿/メタデータ/ユーザーなどを、jsonとしてまとめてくれるので、JavaScriptで取得して描画するところまでを簡単に実装することができます。はじめかた、jsonのカスタマイズ、Vue.js で非同期取得して描画、までに最低限必要なことのまとめです。ググると古い情報がたくさん出てきて困ったので、この記事を書きました。できれば、ここはメンテナンスしたいと思います🍟 WordPress 4.8.2 WP REST API 2.0-beta15 上記の環境での情報です。はじめる WordPress REST API (Version 2) APIリファレンス「WordPre

momochin44 2018/07/06

リンク

【v2対応】Nuxt.jsとFirebaseを組み合わせて爆速でWebアプリケーションを構築する - Qiita

Firebase Advent Calendar 2017 21日目の記事です。フリーランスでフロントエンドを中心にエンジニアをやっているpotato4dです。普段はVue.jsを中心に、案件を進めたりコミュニティに関わったりしていますが、今回はそんなVue界隈で今アツいフレームワークであるNuxt.jsとFirebaseを組み合わせて、SPA + SSRにAuthと Firestore を組み合わせたアプリケーションを高速で作る方法を、サンプルとあわせてご紹介します。 2019/10/16 追記このサンプルは Firestore が存在しない Nuxt v1.x + RTDB 時代のコードを愚直に移行しているので全体的に資料が古くなっています。インフラ構成については順次更新していますが、特にデータストア操作周りについてはできるだけ参考にしないでください。 2019/07/02

momochin44 2018/07/04

Vue
Nuxt.js

リンク

Nuxt.jsとFirebaseでSPA×SSR×PWA×サーバーレスを実現する - DMM inside

はじめまして。DMM.comラボエンターテインメント本部イベント開発部の上井（ウワイ）と申します。インフラからフロントエンドまで幅広く担当しております。今回は、業務で利用しているNuxt.jsとFirebaseを使って、SPA×SSR×PWA×サーバーレスのWebアプリケーションを構築する方法をご紹介いたします。