【Laravel】【Vue.js3】で【CRM(顧客管理システム)】をつくってみよう【Breeze(Inertia)】
What you'll learn
- VueJs3 (CompositionAPI + script setup)の使い方
- VueJs3とLaravelの連携方法 (Laravel Breeze + Inertia)
- APIを使った非同期の情報取得・更新方法
- 実践的な分析にも使える複雑なクエリの作成方法
- 非同期で郵便番号入力し住所を取得する方法
Requirements
- インターネット接続可能なパソコン
- わからない事があったら遠慮なく質問する主体性
- 第1弾PHP/Laravel講座で扱ったくらいのPHP/Laravelの知識
- 第1弾VueJs講座で扱ったくらいのJavaScript/VueJsの知識 (講座内でフォローはしております)
Description
Laravel講座第4弾になります。
今回は事前に受講者の方へアンケートをお願いしまして、
一番投票数の多かった、
「顧客管理システム」「Vue.js3 (CompositionAPI + script setup)」
という内容で構成しております。
LaravelでVue.jsを扱う方法はいろいろありますが、
Laravel BreezeにInertiaを選択するのがもっとも扱いやすいという事で、
開発環境の構築の負担をできるだけ下げて構成しております。
・講座前半
環境構築、Inertia、Vue.js3 (CompositionAPI + script setup)の
仕様や動作の確認。
・講座後半
簡易的な顧客管理システム(CRM)を構築しております。
クエリスコープやAPI通信などさまざまな方法を織り交ぜながら、
顧客情報の登録・検索・分析ができるようになっています。
デシル分析やRFM分析など、
実践でもよく使われる分析手法を取り扱っています。
フロントエンド、バックエンド、データ分析と、
幅広い知識をまるっとまとめて吸収できる講座になっています。
■更新情報
2023/2 Inertia 1.0 に伴う追加ライブラリの案内、参考ページURL情報追加
■フロントエンド Vue.js3
CompositionAPI + script setup
defineProps, defineEmits, ref, reactive, computed, onMounted
v-show, v-if, v-on, v-bind, v-for,
■ バックエンド Laravel
LaravelBreeze, Inertia, Ziggy, Link,
Sanctum (API)、クエリスコープ(ローカル、グローバル)、リレーション(1対多、多対多, attach, sync)、ページネーション、トランザクション、Inertiaミドルウェア、フラッシュメッセージ、バリデーション、カスタムリクエスト、Seeder、Faker、Factory、Carbon
■データ分析
期間指定、日別分析、月別分析、デシル分析、RFM分析 など
■その他
yubinbango-core2, micromodal.js, axios, vue-charts-3
■動画収録時の環境
PHP 8.0.8
Laravel 9.3.0
composer 2.2.4
vue 3.2.0
Who this course is for:
- Laravelを使って顧客管理システム(CRM)をつくってみたい方
- 最新のVueJs3 (CompositionAPI + script setup)を使ってアプリを作りたい方
- 実践的なクエリの作成を知りたい方
- 本やネットで独学してもなかなか使いこなせないと思っている方
Instructor
生成AI術士/システムエンジニア/キュレーター/Webマーケッター/
(要はなんでも屋)
子ども向けSTEAM教育から、法人新人向け教育まで。
難しいことをわかりやすく伝える事が生きがいです。
次世代の教育に関心あり。
プログラミング講座の作成にあたり、
プログラミング初心者だった頃の自分に向けるよう、
できるだけ専門用語を減らし、
イメージ重視で少しでもわかりやすくなるよう
画像や図を使い、
抽象的な表現から具体的に落とし込むようにしています。
■生成AI
Dify, LLM全般(ChatGPT, Claude, Gemini...)
AI検索(Perplexity, GenSpark...)
画像生成(ImageFX, StableDiffusion, DALLE3...)
■フロントエンド
HTML/CSS/Tailwindcss
JavaScript/TypeScript
Vue.js/Nuxt.js
React.js
P5.js
■バックエンド
PHP/Laravel
Python/Django/Flask/FastAPI
■インフラ
Git/Docker/AWS
■オフィスワーク
GAS/ExcelVBA
■データサイエンス
基礎数学/統計学
などなど