Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
LaravelとVue.jsのSPAな関係
Search
sai
January 26, 2019
Technology
460
0
Share
LaravelとVue.jsのSPAな関係
PHPカンファレンス仙台2019のLT資料です
https://phpcon-sendai.net/2019/
sai
January 26, 2019
More Decks by sai
See All by sai
GDG Cloud Cloud Run
saisai
0
390
GCPUG Sendai Vol2 GKE 入門
saisai
1
390
ゼロから初めたGCP.pdf
saisai
0
510
Other Decks in Technology
See All in Technology
小さいVue.jsを30分で作る
hal_spidernight
0
130
ボトムアップの改善の火を灯し続けろ!〜支援現場で学んだ、消えないための3つの打ち手〜 / 20260509 Kazuki Mori
shift_evolve
PRO
2
300
雑談は、センサーだった
bitkey
PRO
2
150
AIが盛んな時代に 技術記事を書き始めて起きた私の中での小さな変化
peintangos
0
340
AIでAIをテストする - 音声AIエージェントの品質保証戦略
morix1500
1
160
フロントエンドの相手が変わった - AIが加わったWebの新しいインターフェース設計
azukiazusa1
24
6.6k
「誰一人取り残されない」 AIエージェント時代のプロダクト設計思想 Product Management Summit 2026
mizushimac
1
2.5k
UIライブラリに依存しすぎないReact Native設計を目指して
grandbig
0
180
20260428_Product Management Summit_tadokoroyoshiro
tadokoro_yoshiro
15
17k
多角的な視点から見たAGI
terisuke
0
110
AgentCore×VPCでの設計パターンn選と勘所
har1101
4
360
巨大プラットフォームを進化させる「第3のROI」
recruitengineers
PRO
2
2.1k
Featured
See All Featured
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
530
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
199
73k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
550
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
Practical Orchestrator
shlominoach
191
11k
Crafting Experiences
bethany
1
130
Optimizing for Happiness
mojombo
378
71k
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
190
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.4k
Exploring anti-patterns in Rails
aemeredith
3
340
Navigating Weather and Climate Data
rabernat
0
180
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.9k
Transcript
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