並び順

ブックマーク数

期間指定

  • から
  • まで

161 - 200 件 / 1057件

新着順 人気順

vueの検索結果161 - 200 件 / 1057件

  • Vue + TypeScript で 0 → 1サービス開発

    Reject Conference - Vue Fes Japan Online 2022 での発表資料です。 https://vuejs-meetup.connpass.com/event/259621/ 2022年に新規サービスを開発するときに考える技術選定について発表します。 フロントエンドは TypeScript で開発するのが主流になってきていますが、Vue を採用した場合ほかにはどういった技術を使うのが良さそうでしょうか? ## スライド内のリンク Frontend Weekly LT(社内勉強会)で「Vite」について LT しました https://devblog.thebase.in/entry/2021/07/29/113335 New Nuxt 3 Feature: Incremental Static Generation | Vue Mastery https:/

      Vue + TypeScript で 0 → 1サービス開発
    • クライアントワーク(受託)のJamstack開発でNuxt 3を提案・実装する / Reject Conference - Vue Fes Japan Online 2022

      Reject Conference - Vue Fes Japan Online 2022の登壇資料です。

        クライアントワーク(受託)のJamstack開発でNuxt 3を提案・実装する / Reject Conference - Vue Fes Japan Online 2022
      • 最近のフロントエンドフレームワークに対する認識とお気持ちの整理 - console.lealog();

        久しぶりに、いわゆるポエムを。 新規・運用ヘルプを問わず、受託や副業でよくフロントエンドをやってるWeb屋の見解、そして手札のお悩み。 この先、また技術選定する際なんかにも参考になるかと思ったので。 React 「いまフロントエンドやるなら最初に覚えるべき!」は、もう過去の話かなーと個人的には思ってる。 Reactは`UI = fn(state)`なのが良い!とか言われるけど、あなたが必要としてるのは`UI = Component(props)`かもよって。 一昔前までは、たしかにあらゆる面で頭一つ抜けてる印象はあったけど、今はそうでもないか、その差はだいぶ埋まってきてると思ってる。(もちろん先行者利益みたいなところで、エコシステムはまだまだ優位な差があるかもしれんけど、それもあまり実感できたことはないし、いまからはじめる人はそんなんで困らんやろうし) 原初の時代からReactな案件をそれ

          最近のフロントエンドフレームワークに対する認識とお気持ちの整理 - console.lealog();
        • Release v3.0.0 · vuetifyjs/vuetify

          v3.0.0 (Titan) Welcome to the v3.0.0 release of Vuetify! Supporting Vuetify Vuetify is an open source MIT project that has been made possible due to the generous contributions by sponsors and backers. If you are interested in supporting this project, please consider: Becoming a sponsor on Github John Leider Kael Watts-Deuchar Becoming a sponsor on Patreon Make a one-time payment with Paypal Suppor

            Release v3.0.0 · vuetifyjs/vuetify
          • BASEフロントエンド Monorepo 化の取り組み - BASEプロダクトチームブログ

            はじめに フロントエンドエンジニアの @mk0812 です。自分は普段BackOfficeというチームで新規機能開発を担当しています。 この記事ではBASEのフロントエンド周りの事例として「Monorepo」を紹介します。 エンジニアの皆さんなら1度は聞いたことあるかもしれませんが、BASEではここ最近Monorepoにしていきました。 具体的にどこをMonorepoにしてるかというとBASEの管理画面にある基本機能とBASE Appsです(下図)。 前者はBASE管理画面で使用する機能を指しており、後者はショップにより充実した設定を追加したり、新しい機能が必要となる時に追加できる機能で、数多く提供されていて、その機能単位もしくはApp単位でMonorepo化されています。 基本機能とBASE Apps Monorepo とは 「Monorepo」とは単一のリポジトリである特定のプロジェク

              BASEフロントエンド Monorepo 化の取り組み - BASEプロダクトチームブログ
            • Vue の Component はもう import しなくていい【Storybook 対応】 - Qiita

              はじめに ユニークビジョン株式会社 では Vue.js + Vite Storybook + Vite な環境でフロントエンドを開発しています。 開発していると、コンポーネントを手動で import する単純作業が何度も発生してしまいます。 面倒なので import しなくて済む方法を探しました。 unplugin-vue-components 有名な plugin です。 導入はドキュメント通りに

                Vue の Component はもう import しなくていい【Storybook 対応】 - Qiita
              • Next.js(React)に最軽量&高機能スライダープラグインSplideを導入してみる

                スライダープラグインは何を使うべきか フロントエンドエンジニアのおとのです🙆‍♂️ Webサイトに以下のようなスライダーを埋め込む際、Web制作のコーダーやマークアップエンジニア、フロントエンドエンジニアは外部プラグインを利用して実装することが多いかと思われます。 jQueryが全盛期だった時には、Slickが多く利用されていた印象です。あらゆるオプションが用意されており、さまざまなカスタマイズが可能で、私もよく使ってきました。 また、IEのサポートが終了してからSwiperが利用されるようになった印象があります。こちらも複数のオプションがあり、比較的モダンなCSS(flex等)が組み込まれていることから、slickよりもカスタマイズが容易であるように思えます。jQueryに依存していないのも大きなメリットですね。 今までのスライダープラグインの問題 ただ、スライダープラグインは決して容

                  Next.js(React)に最軽量&高機能スライダープラグインSplideを導入してみる
                • Vue Router Data Loaders の rfc を読む


                   VueRouter  rfc    UX VueRouter   
                    Vue Router Data Loaders の rfc を読む
                  • Guide to Lifecycle of Vue in VUE.js

                    Vue.js is a JavaScript library that helps you build web applications using the MVVM (Model-View-ViewModel) architectural pattern. Ex-Googler “Evan You” developed the project. It is a strong open-source project with high usage popularity and GitHub stars and forks. Why Use VUE.js? As we know, there are many frameworks in the market, and choosing the proper framework for the project becomes challeng

                      Guide to Lifecycle of Vue in VUE.js
                    • ReactとVueの比較 | 完全に同じアプリのコードの書き方の違い - Qiita

                      はじめに JavaScript フロンエンドフレームワークは 2014 年ごろから本格的に使用され始め、従来のサーバーサイドテンプレートに対し、現代では一般的な Web 技術としてすっかり定着し、シェアとしては React、Vue が 2 強状態になっています。本稿では、最初に過去から現在の状況を俯瞰した後、React と Vue の関数コンポーネントを使用して、同じ画面と機能を持つコードの書き方を比較していきます。 過去から現在の状況 フロントエンド MVC の衰退 10 年前、フロントエンド MVC を標榜していた Angular や Ember は低迷し、以降のフレームワークはもはや M とか V とか MV なんたらなどのレイヤーを言及しなくなり、ビュー + イベント + ステートを 1 つの責務としてまとめた直感的で分かりやすいコンポーネント指向となりました。以下は State

                        ReactとVueの比較 | 完全に同じアプリのコードの書き方の違い - Qiita
                      • 📝 Vue Fes Japan Online 2022 / 見たセッションメモ - memo_md


                        vuefes.jp   Keynote | The Evolution of Vue / Evan You https://vuefes.jp/2022/sessions/yyx990803 0.x Pre  ES5Feature 1.0Evangelion.. 2015-2016Vue Router Vuex SPA Vapor Mode Virtual DOM    Vue23 30% Vue3, 25% 2.7
                          📝 Vue Fes Japan Online 2022 / 見たセッションメモ - memo_md
                        • Vue2 Vue3 マイグレーション 令和最新 最強

                          Vue2 Vue3 マイグレーション 令和最新 最強

                            Vue2 Vue3 マイグレーション 令和最新 最強
                          • JSからTSへ移行した Vue.jsプロダクトの型チェックを 漸進的に強化する | ドクセル

                            Frontend engineer @lapras_inc / TypeScript / Vue.js / Firebase / 元消防士

                              JSからTSへ移行した Vue.jsプロダクトの型チェックを 漸進的に強化する | ドクセル
                            • Vue.js でアクセシブルなコンポーネントをつくるために

                              Vue.js で​アクセシブルな​コンポーネントを​つくる​ために 翻訳記事一覧 日本語ページ / English page はじめに 最初に自己紹介です。 やまのくと申します。Web デザイナーとして働き出して、マークアップエンジニアとして本格的に Web 技術に触れはじめ、アクセシビリティの分野に関心を高めていきました。 現在は事業会社に所属し、Web 標準の技術を活用してユーザー体験を向上させていきたいと考えている者です。 今回の Vue Fes Japan Online 2022 では Vue.js とアクセシビリティにまつわるテーマで発表させていただくのですが、はじめに、なぜこのテーマで発表するのかを説明します。 それは Vue.js での開発においてアクセシビリティを考慮する機会が少ないのではないかと思ったからです。 アクセシビリティについて簡単に説明すると、誰もが情報へアクセ

                              • Vue.js でアクセシブルなコンポーネントをつくるために / To make accessible components in Vue.js

                                Vue Fes Japan Online 2022 発表資料(Web 版) 昨今 Web 開発において、アクセシビリティを重視することはそれほど珍しくなくなってきました。 最新の Vue.js 公式ドキュメントでもアクセシビリティに関する項目が追加されました。 しかしながらアクセシビリティ対応に関しては、間違った知識のままはじめるとアクセシブルでなくなる可能性もあります。 この発表ではそうした間違いや疑問を解消し Vue.js でのアクセシビリティ向上に取り組みやすくするやり方を発表いたします。

                                  Vue.js でアクセシブルなコンポーネントをつくるために / To make accessible components in Vue.js
                                • レガシーなMPAアプリケーションをwebpackからviteに移行する話

                                  株式会社iCAREでは、Vue2.6(※2.7に移行中)+Composition APIで開発を行っており、vue2系では比較的モダンな構成です。一方、Ruby on RailsのView毎にVueインスタンスを生成するMPAであり、アプリケーション全体の構成としては、レガシーな構造になっています。 エントリーポイントが多いことによる弊害で、サービス拡大に伴いビルド時間は長くなり、最近では開発サーバーの立ち上げに約2分も掛かるようになりました。これを改善すべく、Vue2.7化と併せてビルドシステムのWebpackからViteへの移行を試みています。 SPAへのVite導入等に関しては記事がありますが、レガシーなMPAアプリケーションでのVite移行に関する記事はあまりなく、移行できるか?等の不安や疑問を抱きながら実装を進めています。本LTでは、この取り組みを通して得た知見を共有させて頂きま

                                    レガシーなMPAアプリケーションをwebpackからviteに移行する話
                                  • 共通コンポーネントのテスト実装方法にあえてVRTを選択した話 / why do we choose VRT for testing shared components

                                    Vue Fes Japan 2022 の発表内容です https://vuefes.jp/2022/sessions/KushibikiMashu ■ 概要 社内のコンポーネントライブラリに対してStorybookとChromaticでビジュアルリグレッションテストを導入して、見た目のデグレを防止している話をします。 ■ 詳細 Chromaticとは、Storybookのメンテナーが作成しているStorybook用のツールです。 ストーリーごとのスクリーンショットを撮影し、差分を画像で比較してくれる機能を備えています。 以下の課題を解決することを目的にして Chromatic を導入しました。 既存のコンポーネントを改修した際に発生する DOM、CSS に起因する表示崩れを自動で検知できないこと 依存モジュールのバージョンアップに時間がかかること その結果、両方の課題を解決できた上に作業が

                                      共通コンポーネントのテスト実装方法にあえてVRTを選択した話 / why do we choose VRT for testing shared components
                                    • Vue Macros

                                      Vue MacrosModern Way to Writing Vue App Explore more macros and syntax sugar to Vue.

                                        Vue Macros
                                      • GitHub - vue-macros/vue-macros: Explore and extend more macros and syntax sugar to Vue.

                                        You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                                          GitHub - vue-macros/vue-macros: Explore and extend more macros and syntax sugar to Vue.
                                        • ブラウザバックしたときに状態を復元する(Vue3, Nuxt3 そして Next.js) - Qiita

                                          ブラウザバックは Web アプリの鬼門 Vue に限らずですが、Web アプリにおいてブラウザでバックボタンやフォワードボタンの実行に対応するのはなかなかに難しい問題です。そのため、POST Back 型のフレームワークではブラウザバックの使用自体を禁止することも多かったと思います。 SPA全盛の今、この問題は解決されたのでしょうか。 いえ、状況はむしろ悪化しています。テンプレートエンジンを使った HTML 生成型の Web サイトであれば、ブラウザバックを行うことで、フォームの値とスクロール位置は復元されますが、JavaScript ベースで構築された画面ではフォームの値は保存されませんし、スクロール位置が復元できるかも条件次第です。 一般的な解決策 では、Twitter に代表されるSPAアプリではこの問題にどうやって対応しているのでしょうか。答えは「対応しない(あるいはスクロール位置

                                            ブラウザバックしたときに状態を復元する(Vue3, Nuxt3 そして Next.js) - Qiita
                                          • A Vue 3 UI Framework | Element Plus

                                            A Vue 3 based component library for designers and developers

                                            • 本気で考えるReactのベストプラクティス!bulletproof-react2022

                                              と言えば、zennで一番人気のあるの記事です。 Reactの堅牢な開発基盤を築きたいときに非常に参考になります。 @Meijin_gardenさんのこの記事が出たのは、ほぼ一年前。 今日までの間に、React v18.0のリリースというビッグなニュースもありました。 なので、2022年秋となると、一年前とは少し様子も変わってくるかもしれません。 「概ね賛成だけど、ここはこうしてみたい気もする」という部分もあります。 そんなわけで今回は、2022年秋バージョンのbulletproof-reactを一緒に考えていきたいです。 Reactベストプラクティスの宝庫!「bulletproof-react」が勉強になりすぎる件の内容を前提に書いていきますので、まだ読まれていない方は、先に本家の記事を読まれると良さそうです。 改めて考えるbulletproof-reactの良さ ディレクトリ構成 Rou

                                                本気で考えるReactのベストプラクティス!bulletproof-react2022
                                              • Volar 1.0 "Nika" Released! | The Vue Point

                                                We are happy to announce that we have released v1.0 of Volar, the official IDE/TS tooling support for Vue! 🎉 This major version ships with tons of improvements across the board. In addition to improving UX, performance, and package size, we also released Plugin API v1 and refactored the core code to be framework-agnostic. 注:結尾附有中文版本 (There is Chinese version of this post at the end)。 Earlier this

                                                  Volar 1.0 "Nika" Released! | The Vue Point
                                                • NiceGUI

                                                  NiceGUI is an easy-to-use, Python-based UI framework, which shows up in your web browser. You can create buttons, dialogs, Markdown, 3D scenes, plots and much more.

                                                  • TanStack Queryは神フレームワーク

                                                    株式会社パルケの手を動かすCTO、みつるです。 今年に入ってからリリースしたプロダクトでは、TanStack Query (旧React Query)を全面的に採用しました。 無料でずっと話せるミーティングアプリ パルケミート とにかく簡単につながる無料ビジネスチャット パルケトーク このツールを使い倒した結果、これはいちライブラリの枠に収まらない、開発の考え方そのものを変える神フレームワークだと思うようになりました。 今回はその神ってるところを紹介したいと思います。 TanStack Queryとは 公式のトップページより Powerful asynchronous state management for TS/JS, React, Solid, Vue and Svelte パワフルな非同期状態管理ツールという事です。 ただのデータ取得&キャッシュの便利ツールではない、という気持ちが

                                                      TanStack Queryは神フレームワーク
                                                    • Vue Fes Japan Online 2022 に BASE から2名のエンジニアが登壇及び協賛します - BASEプロダクトチームブログ

                                                      2022/10/16(日)に開催される Vue Fes Japan Online 2022 で BASE に所属する2名のエンジニアが登壇します。 vuefes.jp BASE では 2018年頃から Vue.js を使ったプロダクト開発を行ってきており、これまでいくつか Vue.js に関連するテックブログ記事やイベントへの参加を行ってきました。 そして今回は Vue Fes Japan Online 2022 のスポンサーとなり、またひとつ Vue.js コミュニティへの貢献ができて大変嬉しく思います。 BASE はゴールドスポンサーとして当カンファレンスに協賛しています。 セッションの内容について 共通コンポーネントのテスト実装方法にあえてVRTを選択した話 2022/10/16 17:15〜 メドピアトラック セッション(20分) 所属:BASE株式会社 Product Dev D

                                                        Vue Fes Japan Online 2022 に BASE から2名のエンジニアが登壇及び協賛します - BASEプロダクトチームブログ
                                                      • Vue.jsの日本最大級カンファレンス「Vue Fes Japan Online 2022」、10/16にYouTube Live上で開催 | gihyo.jp

                                                        Vue.jsの日本最大級カンファレンス「Vue Fes Japan Online 2022」、10/16にYouTube Live上で開催 日本最大級のVue.jsカンファレンスであるVue Fes Japan Online 2022が、10月16日(日)にオンラインにて開催されます。 本カンファレンスでは、セッションやライトニングトーク、さらには様々な企画が開催されます。今回はYouTube Liveでの開催なので、ぜひ気軽にご参加ください。 キーノート キーノート(基調講演)には、Vue.jsの開発者であるEvan Youがライブ配信にて登壇します。キーノート後には、Evan Youが質問に答えてくれる「Evan Youに聞こう」という企画も用意されています。直接質問できる貴重な機会ですので、Evan Youに質問してみたいことがある方は、ぜひ#vuefes_qaのハッシュタグをつけて

                                                          Vue.jsの日本最大級カンファレンス「Vue Fes Japan Online 2022」、10/16にYouTube Live上で開催 | gihyo.jp
                                                        • Vue3<script setup lang="ts">知見

                                                          はじめに 先日、仕事で参加させてもらっているプロジェクトでVueを3系にバージョンアップしました。 続いて、TypeScriptが入っていなかったので入れたのですが、なかなか<script setup lang="ts">の知見がネットになかったのでここに軽く共有できたらと思います。 前提 Vueは3.2系(<script setup>が使えるのは3.2系から) TypeScriptは4.5.5(vue-createするとこれが入る) webpacker... ts-loader 有用なドキュメント集 おそらく<script setup>自体は簡単に書けるようになってすぐ慣れると思うのですが、TypeScript対応が結構癖があって困ります。 なのでこれらの公式ドキュメントをよく読むようにしましょう。 SFC<script setup>TypeScript のみの機能 https://v3

                                                            Vue3<script setup lang="ts">知見
                                                          • 【必見】これから学ぶべきTypeScriptフレームワーク 4選

                                                            はじめに 今回の記事では、私の独断と偏見でこれから学ぶべきTypeScriptフレームワークを4つ徹底解説する。今回の記事を参考に、TypeScriptを深く学ぶことにつながれば幸いである。TypeScriptが使われているフレームワークは数多く存在するので、何から手を付ければいいのかわからない人も少なくないだろう。もしこの記事を読んでいるプログラマーがTypeScriptのフレームワークを選んでいるのに悩んでいたら、今回の記事は参考になるはずだ。 あくまで個人の一見解に過ぎないが、参考になれば幸いである。 これから学ぶべきTypeScriptフレームワーク Next.js Nuxt3 NestJS SolidJS それぞれ順番に解説する。 1.Next.js Next.jsはReactベースで開発されたTypeScriptフレームワークである。最大の特徴は、URLルーティングと呼ばれるリ

                                                              【必見】これから学ぶべきTypeScriptフレームワーク 4選
                                                            • jQuery、今までありがとう【移行すべき理由と代替案3選】

                                                              世界で一番初心者に優しいWeb制作のメディア。HTML/CSS/JavaScript、WordPress、Web制作の考え方を解説します。

                                                                jQuery、今までありがとう【移行すべき理由と代替案3選】
                                                              • 【Vue 3】Composition API の基本


                                                                 Vue 2  Composition API Vue<script> Vue 2Vue 3 Composition API  Composition APIVue 2 Options API 使 Options APIdatamethods <script> export default { data: () => ({ count: 0, }) methods: { increment() { this.count++; }, decr
                                                                  【Vue 3】Composition API の基本
                                                                • create-vue で学ぶ tsconfig.json

                                                                  概要 本記事は、 Vue.js の公式ツールである create-vue によって生成された tsconfig.json を元に、 Vue 3 + TypeScript における、 tsconfig のベストプラクティスを理解しようという内容です。 注意事項 筆者自身はまだまだ Vue 及び TypeScript の理解が不十分であり、誤った解釈を含んでいる可能性があるのでご注意ください。 なにか間違いなどにお気付きの場合は、コメントまたは GitHub での編集提案を頂けると幸いです。 create-vue について create-vue は、Vite ベースの Vue プロジェクトを CLI から構築できるツールです。 上記のようなコマンドから、対話形式の質問に解答することで、ビルド設定から周辺ライブラリの追加、テストやリンター、フォーマッターのセットアップまで行ってくれます。 本記事

                                                                    create-vue で学ぶ tsconfig.json
                                                                  • Vue.js Piniaを使って状態管理(データの共有)を行ってみよう | アールエフェクト

                                                                    Piniaとは PiniaはVue用のState Managementライブラリで複数のコンポーネントでデータを共有するために利用することができます。アプリケーションの中にStoreという場所を準備しその中にコンポーネント間で共有の必要があるデータを保存していきます。またデータを保存するだけではなくデータを更新する機能も備えています。 Piniaによるデータ管理のイメージ Vueプロジェクトの作成 Piniaを利用するためにVueのプロジェクトの作成を行います。本文書ではViteでプロジェクトを作成後にnpmコマンドでpiniaのインストールを行います。 viteではなくnpm init vue@latestコマンドを利用するとプロジェクトの作成と同時にpiniaをインストールすることもできます。 Viteによるインストール npm init viteコマンドを実行してVueのプロジェクト

                                                                      Vue.js Piniaを使って状態管理(データの共有)を行ってみよう | アールエフェクト
                                                                    • Vue3のUIフレームワーク/UIライブラリ紹介と比較 - Qiita

                                                                      *Nuxt.js 3で使う場合、一部のUIフレームワークは外部ライブラリが必要 結論 なんでもいい、早めに成果物をみたい:Quasar Element+ レスポンシブサイトを構築したい:Quasar 高度なカスタマイズができるUIフレームワークを使いたい:TailwindCSS PrimeVue スマートフォンサイトだけを構築したい:Vant IOS、Android、EXEアプリを作りたい:Quasar 補足 Vuetify 3はリリースしたばかりなので、結論に含まれていません クロスプラットフォームについて本記事は特に話しません SEOに気になれば、Nuxt.jsがおすすめです。SPAアプリは生まれた時からSEOに弱いです 🔰 学習の初心者へ: Vuetify 2がおすすめです。参考資料が多くて、Vuetify 2の場合は公式サイトで日本語のドキュメントもありますので、勉強しやすいと思

                                                                        Vue3のUIフレームワーク/UIライブラリ紹介と比較 - Qiita
                                                                      • Vue Routerを使ってURLを動的に制御する方法

                                                                        Vue Routerは、Vue.jsの公式ルータで、ルーティング制御をするためのさまざまな機能を利用することができます。

                                                                          Vue Routerを使ってURLを動的に制御する方法
                                                                        • [Twitter] React ユーザーが Vue を選ばない理由

                                                                          概要 本記事は、 Vue.js コアチームメンバーである @antfu7 氏の以下ツイートに対する回答を個人的にまとめたものです。 React ユーザーの皆さん、 好奇心で聞くのですが、Vue を使ったり試したりするのを妨げているブロッカーや欠点は何ですか? 注意事項 対立煽りっぽいタイトルにはなっていますが、個人的な好奇心がモチベーションとなっており、特定の技術を贔屓、批判する意図はありません。 私自身は長らく Vue を愛用しており、業務でも大規模 Vue アプリのメンテに携わっている一方で、React は小規模プロジェクトや個人開発でしか利用していません。そのため、理解度に差がある状態であるため、改めて Vue と React の対比やそれぞれの良さを実感したいと思い、一通りのツイートに目を通した次第です。 また、 Vue.js の生みの親である Evan You氏が以下のようにツイ

                                                                            [Twitter] React ユーザーが Vue を選ばない理由
                                                                          • ウェブ制作で React(Next) や Vue(Nuxt)、jQuery が最近どれぐらい使われているのか調べてみた - feb19

                                                                            ウェブ制作で React(Next) や Vue(Nuxt)、jQuery が最近どれぐらい使われているのか調べてみたdate2022.9.4(Sun.)tagsweb developmentFrontendJavaScript ウェブアプリケーション開発で React や Vue を使うのはよくある話かなと思うのですが、マーケティングや広報活動など広告クリエイティブ系のウェブサイト制作ではどれぐらい使われているのかなと思い、暇つぶしにリサーチしてみました。 調査方法母集団ウェブギャラリーサイトをいくつか見て比較的国内系のセレクトが多そうな https://io3000.com/ さんから 2022 年に紹介されている 175 件と、ウェブサイトのアワードサイトとして有名な https://www.awwwards.com/websites/ さんで 2022.8 以降に Winner と

                                                                              ウェブ制作で React(Next) や Vue(Nuxt)、jQuery が最近どれぐらい使われているのか調べてみた - feb19
                                                                            • Vue, Vitest, Testing Library, MSWを使ってテスト駆動開発するチュートリアル - Qiita

                                                                              Vue, Vitest, Testing Library, MSWを使ってテスト駆動開発するチュートリアルテストVue.jsテスト駆動開発TestingLibraryVitest 今回は以下のライブラリを中心にVueにおけるテスト駆動開発(TDD)の進め方を説明します。 Vue3 Vitest Testing Library Mock Service Worker Options APIで書きますが、テストコードはComposition APIでも動くので、 Composition APIの実装に多少慣れてる人はぜひとも挑戦してください。 今回の記事の中で作ったコードは以下のリポジトリに収めました。 テスト駆動開発(TDD)ってなに? TDDとはTest Driven Development(テスト駆動開発)の略であり、その文字通り、 テストを先に書いてその後にそのテストを満たすコードを書

                                                                                Vue, Vitest, Testing Library, MSWを使ってテスト駆動開発するチュートリアル - Qiita
                                                                              • Vue.js

                                                                                スタイルガイド ​このドキュメントは、 Vue 固有の記法についての公式なスタイルガイドです。もしあなたがプロジェクトにおいて Vue を使用する場合は、エラーや有益でない議論、アンチパターンを避けるための素晴らしい参考資料となります。しかし、どんなスタイルガイドもすべてのチームやプロジェクトにとって理想的であるとは考えていません。そのため、過去の経験、周囲の技術スタック、および個人的な価値観に基づいて、注意深い逸脱が奨励されます。 ほとんどの場合、一般的な JavaScript や HTML に関する提案も避けています。セミコロンや末尾のカンマの使用は気にしません。 HTML の属性値がシングルクオートで囲まれているかダブルクオートで囲まれているかも気にしません。しかし、特定のパターンにおいて Vue のコンテキストが役立つと判明した場合については、その限りではありません。 最後に、私達

                                                                                  Vue.js
                                                                                • VueをReactにリプレイスしてEasyからSimpleにした話

                                                                                  はじめに こんにちは、株式会社マイベストでフロントエンドのテックリードをしているteppeitaです。 弊社が運営している mybest の技術スタックをVueからReactに移行したので、その時の話を共有したいと思います💪 mybestのフロントエンド紹介 まずはイメージしやすくするために、簡単にmybestのフロントエンドについてご紹介します。 フロントエンドの技術構成 - TypeScript - React - ApolloClient(APIがGraphQLです) - Storybook(VRTやinteraction testsを実行しています) - Jest - Cypress ↑少し前まで、ReactのところがVueでしたが、リプレイスしました。今回はその話です。 画面構成 mybestには、大きく分けて、フロント画面(一般ユーザーが見る画面)と管理画面が有ります。 その

                                                                                    VueをReactにリプレイスしてEasyからSimpleにした話