chibivuechibivueStep by Step, from just one line of "Hello, World".powered by VitePress
Vue2のプロジェクトをVue3へマイグレーションする
Vue 3が正式リリースされてから約1年が経過しました。 Vuetifyのリリース目標である2021年Q3も近づく中でそろそろVue3へのアップデートを検討されている方もいらっしゃることでしょうか？ この記事ではVue 2からVue 3への移行手順を記述していきます。 参考用のプロジェクトとして以下レポジトリを用意しました。 Vue 2からの移行を体験してみたい場合には、vue2-todo-appのタグにチェックアウトしてください。 移行ビルドを使用する Vue 2からVue 3へ移行するためのツールとして、公式から@vue/compatが提供されています。 @vue/compatを使用すると、Vue 2モードで動作するため、Vue 3で削除や非推奨になったAPIも一部の例外を除いてそのまま使用することができます。Vue3 で削除で非推奨になった機能は実行時に警告が出力されるようになります
Lets start TypeScript ~Vue3 + Express で TypeScript 入門してみよう~
Vue3とExpressでToDoアプリを作ることで、TypeScriptに入門しようっていう内容です。 TypeScriptは何も怖くありません。一度使い始めたらもうJavaScriptには戻れなくなるだけです。TypeScriptに入門して快適なコーディングライフを送りましょう！
Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう (1) イントロダクション | Hypertext Candy
はじめに 対象者 JavaScript / Vue.js / PHP / Laravel の入門レベルの方、入門書を読んだあとに「何か作ってみたい」という方が、それぞれの知識を組み合わせて本格的なアプリケーションを開発できるようになることを目指しています。 上記のいずれかの知識がまったくない状態だとこのチュートリアルの内容は少し難しいかもしれません。チャレンジするのもいいですが、参考文献に挙げた市販の入門書か、関連記事のチュートリアルを先に読んでおくと理解しやすいと思います。 学べること Vue.js と Laravel を組み合わせて SPA を構築する方法 SPA におけるクッキー認証と CSRF 対策 Vue Router を使用した画面遷移 Vuex を使用した状態管理 Vue でのタブやローディング UI の表現 SPA におけるエラー処理 扱わないこと デザインと CSS コー
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
Storybook Tutorials
TutorialsFree in-depth guides with code samples. Made for professional frontend developers. Intro to StorybookLearn to create bulletproof UI components, along the way you'll build an app UI from scratch.10 Chapters Design Systems for DevelopersDiscover how to build and maintain design systems using Storybook.9 Chapters
A Vue.js App Using Axios With Vuex
Our website is made possible by displaying online advertisements to our visitors. Please consider supporting us by disabling your ad blocker. In this tutorial we will build a simple Vue.js application which will demonstrate the power of using Vuex as a central data store, where the data will be asynchronously retrieved using Axios for the API requests. A basic level of HTML, CSS and JavaScript wil
Replacing jQuery With Vue.js: No Build Step Necessary — Smashing Magazine
Did you know that you can incorporate Vue into your project the same way that you would incorporate jQuery — with no build step necessary? Let’s cover some common use cases in jQuery and how we can switch them over to Vue, and why we’d even want to do so. In this article Sarah Drasner shows you that Vue is also a pretty nice abstraction for small sites that don’t need a lot of overhead. Due to Vue
A Vue.js introduction for people who know just enough jQuery to get by
By Matt Rothenberg I’ve had a love-hate relationship with JavaScript for years. I got to know the language by way of the design and development community’s favorite whipping boy, jQuery. You see, at the time I began learning JavaScript, as a “Designer who codes,” working with jQuery was a magical experience. I could make modals fadeIn and fadeOut. With a third-party library, I could add parallax s
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
Vue + Vuex — Getting started
At some point when building applications you will need to begin thinking about how to manage state. Vue provides a simple way to work with local state inside a component. Below is an example of loading some data from an api and setting it on the local state variable projects: import axios from 'axios'export default { name: 'projects', data: function () { return { projects: [] } }, methods: { loadP
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Learn to code with Scrimba