LaravelとVue.jsのSPAな関係

LaravelとVue.jsの SPAな関係 2019/1/26 PHPカンファレンス仙台株式会社ビデオマーケット齋洋行 1

2 About Me 齋洋行・37歳仙台在住・Server Side Enginner
(PHP/Go/AWS/GCP) ・株式会社ビデオマーケット ※エンジニア募集中！　　主にLaravel使ってます・PHP歴7年くらい、最近はGoもやってます・趣味＝釣り（船もってます）※釣り仲間募集中！

3 ビデオマーケット映画・ドラマ・アニメ etc 配信作品は21万本中身はほぼPHP

4 フロント知識ゼロでVue.jsを導入した話今日話すこと

5 導入のキッカケ

6 導入のキッカケ新規案件の要件・ビジネスロジックはWebAPI、Viewはコンポーネント化は必須・エンジニアのリソースは自分一人・限られた検証期間・作るのは社内で使う管理画面

7 技術選定

8 自分の技術スタック・PHP（Laravel4〜5.2）、Java、C#、Go、AWS etc... フロントの知識がほぼゼロ

9 ・検証はViewのみにフォーカス・WebAPIは使い慣れたLaravel Laravel + Vue.jsで検証

10 試してみた

11 フロントの開発環境

12 80%くらいのユースケースで使えるエレガントなWebpackのラッパー・webpackの設定をいい感じでやってくれて最速で構築 Laravel Mix

13 デザイン

14 Element UI ・十分すぎるコンポーネント

15 検証結果

16 検証結果 • 可読性 ◦ 単一ファイルコンポーネントなので、完全に処理が分離 ◦ DSLが楽。smartyとかbladeを使っていたので入りやすい

17 検証結果 • 保守性 ◦ 日本語マニュアルが豊富、最近は導入事例も増えてきている ◦ コミュニティが活発 ◦
Laravel mixがかなり楽 ▪ sassとか正直わかんないのでいい感じにやってくれる

18 導入したらこうなった

19 導入したらこうなった画面数:30 API:15本 JWT認証 2ヶ月弱で作成

20 まとめ

21 まとめ・Vue.jsの学習コストは予想以上に低い・vue-router、vuexなどの標準ライブラリが強力大事なのは・取捨選択しながら身近なものから少しずつやっていくと色々スムーズ・地方にいると幅広いスキルセットが必要になるので、枠を超えて動く

22 Thank you

LaravelとVue.jsのSPAな関係

LaravelとVue.jsのSPAな関係

saisai

More Decks by saisai

Other Decks in Technology

Featured

Transcript