完全に独断と偏見だけどReact vs Vue してみた - Qiita比較内容 大まかに以下の点で比較検討をしました。私個人はVueよりもReactに慣れているので、偏った意見かもしれないけど参考になれば。 React Vue
React VS Vue ～ どっちを使うべきか問題に終止符を打つ(2021年 ver)【Agent Grow Advent Calendar 2020：21日目】
React VS Vue ～ どっちを使うべきか問題に終止符を打つ(2021年 ver)【Agent Grow Advent Calendar 2020：21日目】 この記事は Agent Grow Advent Calendar 2020 21 日目の記事です。 React VS Vue の戦いにそろそろ決着をつけようじゃないか みなさん、Webフロントエンドで JavaScript 書いてますか？書いてますよね？ 以前は Web開発といえば、サーバー側で HTML を作ってそのままブラウザで表示、 というパターンが多かったですが、 最近ではサーバーは API 化して、表示まわりは JavaScript で制御、 というスタイルも結構多くなってきましたよね。 そのため、フロントエンドにも何かしらライブラリを入れることも、 当たり前になってきました。 2020 年だと、主流は React
新規機能はどんどんコンポーネント化 Vue.js + TypeScriptで開発してよかったこと・つらかったこと
株式会社ラクスが開催するエンジニア向けのイベント「RAKUS Meetup」。今回は「Vue.js、React、TypeScript、E2Eテスト」をテーマに、「楽楽勤怠」の機能開発を担当する北嶋初音氏が登壇し、「Vue.js + TypeScriptによる新規サービス開発の振り返り」という内容で話をしました。関連資料はこちら。 会社初のフロントエンドエンジニア 北嶋初音氏（以下、北嶋）：では、「Vue.js + TypeScriptによる新規サービス開発の振り返り」と題して、UI開発課の北嶋初音が発表を始めたいと思います。 まず軽く自己紹介します。名前は北嶋初音と言います。経歴ですが、2016年の4月からWeb系のITベンチャーに新卒入社しまして、Webエンジニアとしての経験を積みました。次は自社サービスを作っている会社で働きたいという気持ちがあったので、転職活動を始めて、今年の1月から
【個人開発】日常用のメモ帳アプリ（PWAアプリ）をリリースしてみた - Qiita
はじめに カレンダーとメモが、「ガッチリ結びついた」メモ帳が欲しいなぁ。 というコンセプトで作りました。 無料です。 ※ 2022/02/10 追記 アプリのURLを上記に変更。 ※ 2022/10/04 追記 2023/03/31にGoogleの旧ログイン方法が廃止されます。 アプリのアップデートは行われませんので、新規登録やログインはお控えください。 見栄え感 アプリ名の通り、時間に紐付いたメモが出来るのが特徴です！ 技術スタック 言語 TypeScript フレームワーク Vue.js + CompositionAPI データ保存 GoogleDriveAPI IndexedDB + CacheAPI ホスティング FirebaseHosting アプリ機能 ServiceWorker（PWA） FirebaseRemoteConfig （アップデート管理） 使い勝手のポイント Go
2020年後半版Vue.jsを使ってる人には必ず知っていてほしいVue.jsの武器とドキュメントに書かれていないコンポーネントやメンテナンスの際に役立つTips - Qiita
2020年後半版Vue.jsを使ってる人には必ず知っていてほしいVue.jsの武器とドキュメントに書かれていないコンポーネントやメンテナンスの際に役立つTipsJavaScriptTypeScriptVue.jsフロントエンドvue-cli はじめに 最近iCAREさんの所でVue.jsを一緒にやらせていただいているのですが、フロントの技術スタックがGraphQL + Vue.js + TypeScriptで開発しており、そこでのVue.jsの開発体験がかなり良く、iCareさんの詳細なノウハウを公開しても良いと言っていただけたので、言語化し、整理して、共有出来たらと思います. ※ いつも通り記事の内容に意見がありましたら直接編集リクエストをください 前置き 今回のサンプルは@vue/cliを利用し、プリセットはTypeScriptだけいれときました. versionは2020年7月16日
エラーは出ないけど…何か変？？Vue.jsでやりがちな「サイレント・ミス」（ロジック編） - ICS MEDIA
Vue.jsは初学者にもとても手厚いサポートを提供してくれるフレームワークです。 たとえば、以下のコードで「リセット」ボタンを押すと「propsのcountは子コンポーネントから変更すべきではない」とわかりやすくエラーを表示してくれます。 <template> <div class="CountViewComponent"> カウント={{count}} <button @click="reset">リセット</button> </div> </template> <script> export default { props: { // 表示するカウント値 count: { type: Number, default: 3 } }, methods: { // カウントをリセットします reset() { this.count = 0 } } } </script> それでも時として、
実際のサービスをRails＋Vue.js(Single File Components)を用いてSPAへリファクタリングした話
エンジニアの西辻です。 今回の記事では、Railsプロジェクトで一部の画面のみをVue.jsを用いてSPA化するにあたって、その際に得た知見などを共有できたらと思います。 Overview 大きく以下の流れで書いていきます。 Motivation RailsとVue.jsの連携方法について調査、部分的なSPAが実現可能かの検証 実装を進めていく中での気づき スマホ対応の方針決め 最後に Motivation まず、なぜRailsプロジェクトで一部の画面のみをSPA化する必要があったかの背景を説明したいと思います。 今年の5月からtoB向けの管理ツールを新規開発したのですが、その際にjQueryだとコードの見通しが悪いのでVue.jsを積極的に利用していこうという話があり、チームメンバーでVue.jsを学習しながら開発を進めていました。 管理ツール自体は無事リリースでき、稼働はしているのです
2019年版Vue.jsを使ってる人には必ず知っていてほしいVue.jsの武器とドキュメントに書かれていないコンポーネントやメンテナンスの際に役立つTips - Qiita
2019年版Vue.jsを使ってる人には必ず知っていてほしいVue.jsの武器とドキュメントに書かれていないコンポーネントやメンテナンスの際に役立つTipsアーキテクチャVue.jsElmReactAngular2 はじめに 私はVue.js with Vuexを使った業務で1画面30APIを叩く必要のある画面から、たったの数APIしか叩かないけれど、代わりにUIがとても機能的で複雑な画面まで設計し、構築しました。 もちろん、Vue.jsのコンポーネントシステムをフル活用し、Vuexを入れていないプロジェクトの経験もあります。 現在は構築したシステムを保守・運用しています。 また、勉強の為にReact、 Angular、 最近はElm等にも少し触れています。 その際に得られたノウハウ、Vue.jsが他のライバルフレームワークと比べた際に現時点で本当に勝っている利点やノウハウを言語化し、共有
レガシーシステムの大規模リプレイスで分かった「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 とい
今からVue.jsを始める人のための「知るのを後回しにしてよい」n個のこと - Qiita
＊この記事は2020年3月頭に書かれている記事です どうも、Vueはいいぞおねーさん(自称)です。 Vue.jsは私に言わせるととてもよいフロントエンドフレームワークであり、その理由の一つにプログレッシブフレームワークである(段階的に利用する機能を増やしていくスタイルにマッチしている)ものとして、フロントエンド初学者の皆さんにもおすすめしたい代物です。 しかし、現在までに様々なプラクティスが考案されたがゆえに、「最初からベストな方法で始めたい」という思いから一度にたくさんのことに挑戦してしまいたくなりがちです。 そしてそれはプログレッシブという思想に反するもので、結果として挫折を生んでしまっているのではないかと思いました。 そこで今回は「知るのを後回ししてよいこと」として、Vue.jsへの入門する方へのアドバイスを独断と偏見で不要度という指標でまとめてみました。 不要度というネガティブな指
Vue開発者のためのVue.jsベストプラクティス集15選 - Qiita
はじめに みなさん、Vue使ってますかー！・・・・・・・（へんじがない。ただのしかばねのようだ。） 私は毎日使ってます。が、正しい使い方というのがいまいちわかっていません。ということで、ネットで拾ってきた情報を元にVueで開発する上でのベストプラクティス集15選をまとめてみました。 「ふんふんそうだよね〜」といったものから「えー！？そうなのー！？」となるものまで集めています。皆さんの開発の手助けになる情報が入っていると幸いです。 また、間違っている内容やさらに良い方法等あれば、コメント欄にて（優しく）ご指摘いただけるととても嬉しいです。 1. v-for内では必ず:keyを使う v-forディレクティブでkey属性を使うと、データを操作するのに役立ちます。さらに、Vueがコンポーネントの状態を追跡し、それぞれのエレメントに対し継続的に参照ができるようになります。 特に、アニメーションやVu
真のフロントエンドエンジニアになるために、まずはNuxt.js + Firebaseを使って簡易メモ帳を作ってみた - LiBz Tech Blog
目次 目次 はじめに 前提条件 Nuxtってなに？ Nuxtの主な機能 Nuxt.jsやってみる Nuxt.jsのインストール Nuxt.jsでアプリ作成 nuxt.config.jsによる設定いろいろ Nuxtの構成 Nuxtでアプリ実行 ポート(3000の部分)を変更したい場合 アプリの説明/解説 レイアウト・コンポーネントの作成 レイアウト(layouts) ページ(pages) コンポーネント(components) データの扱い/保存 firebase firebaseでdatabase作成 firebaseで認証設定 store(Vuex) デバッグ ビルド herokuにデプロイ やってみて はじめに こんにちは! 11月にLiBに入社したアベと申します。 アラサー子持ちのエンジニア(エンジニアと名乗るのは憚れる...)です。 社会人3年目からWebの世界へ転身し、webデザ
何故Vue.js/Nuxt.jsなのか、SSRや仮想DOMなどのメリットについてもまとめる – Simple IT Life
何故Vue.js/Nuxt.jsなのか、SSRや仮想DOMなどのメリットについてもまとめる Published: 2018年9月1日 by tomsato 概要 Vue.jsやNuxt.jsで開発をすることが多くなってきたが 改めて「なんでVue.jsにしたの？」「仮想DOMって？」「SSRって何がいいの？」 などメリットを聞かれた時にサラサラと答えられなかったり用語についての説明が言えなかったりしたので自分なりにまとめる フロントエンドの歴史について 何故フロントエンドエンジニアが必要になってきたのか 昨今フロントエンドエンジニアの需要が高まってきた、何故高まってきたのかはWebの歴史を見ていく必要がある 1990年代にWebが誕生しCSSやJavaScriptがWebブラウザに搭載されるようになったが 当初はJavaScriptは貧弱でCSSと共にページの装飾に用いられることが主だった
NuxtでRailsに勝つ方法 - Qiita
12月も中盤、皆様いかがお過ごしでしょうか 僕は24~25日の予定がホワイトクリスマスですが、スマブラがあるので寂しくありません ところでみなさんは突然娘をさらわれて、誘拐犯に「ぱぱっとWebアプリを作れ」と要求されたら何の技術を使いますか？ うんうん、なるほどなるほど やっぱRailsですよね！ 今回はそんなあなた達を倒したいと思います Nuxtのよいところ NuxtとRailsの組み合わせといえば、よく @potato4d 氏が「Nuxtは次のRails」と言っているのが印象的です 周知の事実ですが、もう一度NuxtとRailsの良いところを考えてみてます これらを全て完封して、自信を持って「NuxtがRailsに勝った」と言いたい 1. Vueのコミュニティに乗れる Nuxtの理解度の7割くらいはVueで占めているので必然的にVueを勉強することになるんですが、ドキュメントがマジで親
RailsにVue.jsを小さく導入する - count0.org
先月開催されたフロントエンドもくもく会 - 新年LT大会というイベントで 「RailsにVue.jsを小さく導入する」というLTを発表したが、あえなく時間切れになってしまった。 LTはTurbolinksはどんなもので、敬遠されがちという説明で終わってしまったので、 続きをブログに書くことにした。 前提 どんなRailsアプリケーションにVue.jsを導入したかというと Rails 5.0で作られ、現在Rails 5.1を使っている Turbolinksを使っている jQueryに依存している APIやjbuilderでJSONを返してはくれない RailsをAPIに専念させ、フロントエンドをSPAで実装するには時既に遅しである。 Vue.jsのインストール まずはWebpackerでVue.jsを導入することにする。導入方法はwebpackerのREADMEを参照すればよいので割愛する。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue.js & Nuxt.js から React & Next.js へ移行した理由 | fwywd（フュード）powered by キカガク
A collection of projects made with Vue.js – Websites, UI Components, Frameworks, Apps and more!
Nuxt.js + Ruby on Rails + AWS Fargate の開発・デプロイチュートリアル
ゼロからVue向けのウェブパック設定 - Qiita
20190131_2