LaravelとVue.jsのSPAな関係

PHPカンファレンス仙台2019のLT資料です
https://phpcon-sendai.net/2019/

Transcript

1. LaravelとVue.jsの SPAな関係 2019/1/26 PHPカンファレンス仙台 株式会社ビデオマーケット 齋 洋行 1
2. 2 About Me 齋 洋行 ・37歳 仙台在住 ・Server Side Enginner (PHP/Go/AWS/GCP) ・株式会社ビデオマーケット ※エンジニア募集中！ 　　主にLaravel使ってます ・PHP歴7年くらい、最近はGoもやってます ・趣味＝釣り（船もってます）※釣り仲間募集中！
3. 3 ビデオマーケット 映画・ドラマ・アニメ etc 配信作品は21万本 中身はほぼPHP
4. 4 フロント知識ゼロでVue.jsを 導入した話 今日話すこと
5. 5 導入のキッカケ
6. 6 導入のキッカケ 新規案件の要件 ・ビジネスロジックはWebAPI、Viewはコンポーネント化 は必須 ・エンジニアのリソースは自分一人 ・限られた検証期間 ・作るのは社内で使う管理画面
7. 7 技術選定
8. 8 自分の技術スタック ・PHP（Laravel4〜5.2）、Java、C#、Go、AWS etc... フロントの知識がほぼゼロ
9. 9 ・検証はViewのみにフォーカス ・WebAPIは使い慣れたLaravel Laravel + Vue.jsで検証
10. 10 試してみた
11. 11 フロントの開発環境
12. 12 80%くらいのユースケースで使えるエレガントなWebpackのラッ パー ・webpackの設定をいい感じでやってくれて最速で構築 Laravel Mix
13. 13 デザイン
14. 14 Element UI ・十分すぎるコンポーネント
15. 15 検証結果
16. 16 検証結果 • 可読性 ◦ 単一ファイルコンポーネントなので、完全に処理が 分離 ◦ DSLが楽。smartyとかbladeを使っていたので入り やすい
17. 17 検証結果 • 保守性 ◦ 日本語マニュアルが豊富、最近は導入事例も増え てきている ◦ コミュニティが活発 ◦ Laravel mixがかなり楽 ▪ sassとか正直わかんないのでいい感じにやっ てくれる
18. 18 導入したらこうなった
19. 19 導入したらこうなった 画面数:30 API:15本 JWT認証 2ヶ月弱で作成
20. 20 まとめ
21. 21 まとめ ・Vue.jsの学習コストは予想以上に低い ・vue-router、vuexなどの標準ライブラリが強力 大事なのは ・取捨選択しながら身近なものから少しずつやってい くと色々スムーズ ・地方にいると幅広いスキルセットが必要になるの で、枠を超えて動く
22. 22 Thank you