プログラミング Vue 3を体系的に学ぶロードマップ｜初心者がリアクティブ・REST API・Swagger連携・Vuetifyまで理解する手順
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。Vue 3 を学び始めたとき、私がいちばん困ったのは「何から手をつければいいのか分からない」ことでした。リアクティブ、Composition API、Vue Router、...
フロントエンド開発
プログラミング 
プログラミング VuetifyをVue 3に導入する｜なぜ最後に入れるのか・最小セットアップ
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。Vuetify は Vue 用の UI コンポーネントフレームワークです。ボタン・入力欄・テーブル・ダイアログなどが最初から用意されていて、自分で CSS を書かなくても整...
プログラミング Vue 3でREST APIを呼び出す方法｜fetch・axiosとJSON表示の基本
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。Vue でボタンや一覧を作れるようになると、次に出てくる壁が「サーバーのデータをどう表示するか」です。私も最初、Vue の中にデータを直接書いていて、「これ、どうやって本物...
プログラミング Vueのprops・emits・slotsの使い分け｜親子コンポーネント連携
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。コンポーネントを部品に分けると、次は「部品どうしをどうつなぐか」が問題になります。親から子へデータを渡したい、子で起きたクリックを親で受け取りたい、子の中身を親から差し替え...
プログラミング Vueコンポーネント設計の基本｜画面を部品に分ける考え方
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。Vue に慣れてくると、次にぶつかるのが「1つの .vue ファイルがどんどん長くなって読めなくなる」問題でした。一覧・検索フォーム・削除ダイアログ…全部を1ファイルに書い...
プログラミング 【Vue 3】script setupで書く理由｜Options APIとの違いと書き方
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。Vue 3 を調べ始めると、同じ「カウンター」のサンプルでも書き方が2種類出てきて戸惑いました。export default { data() {...} } と書くもの（...
プログラミング VueのSFCとは何か｜.vueファイルの読み方（template/script/style）
※ 当ブログ「日々是事始め（コレコト）」はプロモーションを含みます。Vue を学び始めて最初に「これは何だ？」と止まったのが .vue という見慣れない拡張子のファイルでした。開いてみると <template> と <script> と <...
プログラミング 【Vue 3入門】リアクティブの基礎を徹底解説！ref・reactive・computed・watchの使い方
Vue.js リアクティブの基礎を徹底解説リアクティブの基礎、ある意味でここが本丸だと思います。Vue.jsの核となる仕組みが リアクティブシステム です。リアクティブを理解すれば、Vueが「なぜ直感的に使えるのか」が腑に落ち、実務での活用...
プログラミング 【Vue 3入門】Vueの全体像を徹底解説！初心者が押さえるべき特徴と基本概念
Vue.jsの全体像を徹底解説JavaScriptやTypeScriptを理解している方が次に学ぶべきフロントエンド技術として人気なのが Vue.js です。ReactやAngularと並ぶ主要なフレームワークでありながら、Vueはシンプル...