Nuxt: The Intuitive Vue FrameworkNuxt is an open source framework that makes web development intuitive and powerful. Create performant and production-grade full-stack web apps and websites with confidence.
Release v4.0.0 · vuejs/vuex
This is the official Vuex 4 release. The focus for Vuex 4 is compatibility. Vuex 4 supports Vue 3, and it provides the exact same API as Vuex 3, so users can reuse their existing Vuex code with Vue 3. There are a few breaking changes described in a later section, so please check them out. You can find basic usage with both Option and Composition API in the example directory. It's still released un
Vue.js 3.0 の新機能を試す。 〜 Teleport 編〜 - Qiita
2020/05/04 追記 portal は teleport にリネームされたようです。 記事内容も修正しました。 -- 2020年Q1リリース予定のVue.js 3.0の新機能 Teleport を試してみたのでまとめます。 （参考） 以下でVue 3.0（vue-next）の環境構築、他の新機能についてもまとめています。 vue-next（Vue.js 3.0 wip）+ TypeScript + webpackでの開発環境を構築する Vue.js 3.0 の新機能を試す。 〜 Suspense 編〜 Teleportとは？ 定義したコンポーネントが属するDOMツリーとは別の場所に、まるでテレポートしたかのようにコンポーネントを移動できる機能です。 直接指定の位置に表示できるので、 Modal、Tooltipなど要素の上部レイヤーに表示したいコンテンツでもz-indexでのCSSハッ
【Vue.js】Composition API時代の便利ライブラリ「VueUse」を使ってみた - Qiita
Vue Composition API によって Vue.js にも React Hooks のようなロジックの再利用性の高い開発体験がもたらされようとしています。 しかし、まだ「Composition API の良さをわかっていない」という方や「Composition API をうまく利用した書き方がわからない」という方も多いかと思います。 本記事では Composition API 時代の便利ライブラリ VueUse を用いた実装例や、 VueUse 自体の実装がどのようなものか紹介します。 Composition API の良さや雰囲気もキャッチアップしていただければ幸いです。 VueUse とは？ VueUse は Anthony Fu さん1が中心に開発しているライブラリで、Composition API を用いた便利系関数を数多く集めたライブラリです。 例えば、ブラウザ上のマウ
Vue.js 3 のベータ版がリリースされたので予習してみる - SMARTCAMP Engineer Blog
こんにちは！スマートキャンプでエンジニアをしている中川です。 いきなりですが、つい先日待望の Vue.js 3.0.0 beta がリリースされました！ We just released Vue 3.0.0-beta.1! Here's an overview from @youyuxi on the status of 3.0 core and official tools & libraries: https://t.co/7TP5ZMtjK4— Vue.js (@vuejs) April 16, 2020 ステータスは beta なのでいま2系からアップグレードすることに抵抗はありつつも、待望の新バージョンなので内容が気になる・試してみたい方も多いのではないでしょうか。（かくいう私自身がそうです） そこで今回の記事ではVue.jsの今後のロードマップを紹介して、何がいつリリースされる
Vue Composition API を使ったストアパターンと TypeScript の組み合わせはどのくらいスケールするか？ - Qiita
Vue Composition API を使ったストアパターンと TypeScript の組み合わせはどのくらいスケールするか？TypeScriptVue.jsvue-composition-api Vue.js の公式ドキュメントには「状態管理」という章があり、そこでは単純なストアパターンと、より大規模向けという Vuex ライブラリを使う 2 つの手法が紹介されています。 ですが、それぞれどこに長所・短所がありどのような基準で選択すれば良いのかは「大規模」というあやふやな基準でしか示されていません。実際その境界はどこにあるのでしょうか？ さて、TypeScript も同様に大規模アプリケーション向けと言われます。型安全性の有用さは他言語の世界で実証されています。ところが残念なことに Vuex の API 設計とは極めて相性が悪いというのはよく言われます。現時点で両者を両立させるのは大変
CompositionAPIを使ってcomposition functionを分離した状態でテストする - Qiita
10/27 Vue-next版をこちらに書きました！この記事はVue 2.0用の記事です。 最初に ついにComposition APIがrfc上でmergeされました rfc上でmergeされたこともあって、本格的に触っていく人も増えていくのではないか、と思います。 Composition APIを使うことで型推論がよくなる、IDEの恩恵を受けやすいだけでなく、 少し工夫するだけでなんちゃってSingle Store patternなどができたりします。 しかしながら、Composition API自体が新しい、ということもあってテストに関する情報がほとんどありません。 そこで、今回はComposition Functionを分離した状態でのテストの書き方について説明します。 Composition Functionを分離するって? 公式DocumentだとLogic reuse cod
Vue composition-api の テスタビリティを考える - Qiita
はじめに Vue composition-api を触っている人も多くいると思うが、これの利用方法についてテスト容易性の観点から考える。 View と ロジックを分離するからテストしやすい 単一ファイルコンポーネント (SFC) には、コンポーネントの表示に関するTemplete (HTML) と CSS そして、ロジックに関する Script (Javascript) が含まれている。 これは、興味を1ファイルに閉じ込めることができるため、直感的にわかりやすく、好きな人が多いと思う。 その一方で、ロジック部分をテストするだけでも vue-test-utils でコンポーネントをマウントするか、this コンテキストを明示して method をコールする必要があった。 import options from "./test-target.vue" /** * this.count++ する
Vue.js 3.0 の新機能を試す。 〜 Suspense 編〜 - Qiita
2020年Q1リリース予定のVue.js 3.0の新機能 Suspense を試してみたのでまとめます。 かなり使い勝手が良さそうです。 （参考） 以下でVue 3.0（vue-next）の環境構築、他の新機能についてもまとめています。 vue-next（Vue.js 3.0 wip）+ TypeScript + webpackでの開発環境を構築する Vue.js 3.0 の新機能を試す。 〜 Teleport 編〜 Suspenseとは？ 非同期処理が解決されるまでフォールバックコンテンツ（例えばLoading中アイコン）を表示してくれる特別なコンポーネントです。 いままで、v-if="loading === true"などの状態変数を使って制御していたものを、状態変数を使わずに簡潔に書くことができます。 ※ Reactには既にあるようです。https://reactjs.org/doc
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - beizhedenglong/vue-hooks-form: Building forms with vue composition API.
Vue.js + デザインパターンによるコンポーネント実装
複雑なv-ifに負けないために.pdf
Fat ComponentにしないためのWebフロントエンド設計 / Web Front-End design to avoid being a Fat Component
Setting Up Tailwind CSS in a Vue.js Project [Live Demo]![Setting Up Tailwind CSS in a Vue.js Project [Live Demo]](https://cdn-ak-scissors.b.st-hatena.com/image/square/96557adb1ad178d10699e99f2cee41838799de35/height=288;version=1;width=512/https%3A%2F%2Fwww.datocms-assets.com%2F48401%2F1628644787-tailwind-vue.png%3Fauto%3Dformat%26fit%3Dmax%26w%3D1200)
[Abandoned] Class API proposal by yyx990803 · Pull Request #17 · vuejs/rfcs![[Abandoned] Class API proposal by yyx990803 · Pull Request #17 · vuejs/rfcs](https://cdn-ak-scissors.b.st-hatena.com/image/square/11aa2eb4fbce7e3715e16787206de23389b84c9e/height=288;version=1;width=512/https%3A%2F%2Fopengraph.githubassets.com%2F417da32005dd8d027500037b4e2ffeb6d567aa96d6e2a43809b1848ff2448a3a%2Fvuejs%2Frfcs%2Fpull%2F17)
Heroicons for Vue.js - Free, Open source icons
GitHub - andrewcourtice/ocula: The free and open-source progressive weather app
Tailwind Starter Kit by Creative Tim | Free & Open Source Design System
GitHub - thanhchungbtc/vue-shopping-clean-architecture: Shopping cart app demonstrate clean architecture
https://vuetifyjs.com/ja/customization/presets/