Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
LaravelとVue.jsのSPAな関係
Search
sai
January 26, 2019
Technology
480
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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
410
GCPUG Sendai Vol2 GKE 入門
saisai
1
400
ゼロから初めたGCP.pdf
saisai
0
520
Other Decks in Technology
See All in Technology
Railsのように考える: See through the Master
snoozer05
PRO
5
1.3k
登壇の自信を奪う3匹のオバケ / 3 Ghosts That Rob You of Your Confidence in Public Speaking
pauli
9
1.1k
「今盗んで、後で解く」に備える ― AWSのポスト量子暗号入門
yama3133
1
180
なぜ「決定性」が 決定的に重要なのか? Durable Execution 基盤の数理的理解 #serverlessjp / ServerlessDays Tokyo 2026
ytaka23
3
1.2k
「どのログを見ればいい?」 から始めた サーバーレス障害解析
y_waka1
1
140
Deployment の 先にある AI Agent 基盤 - kagent vNext、Agent Substrate、Hermes から読み解く Agent Runtime の現在地 / k8s-matsuri-2-ai-agent-platform-amsy810
masayaaoyama
5
710
Kiro Meetup #8 Kiro アップデート (2026/3/21〜2026/9/24)
katzueno
1
160
Oracle Cloud Network Path Analyzerを試してみた/I Tried Out Oracle Cloud Network Path Analyzer
masakiokuda
1
110
Genieを崇めよ
kameitomohiro
0
170
人にやさしく、AIにやさしく、書き手を選ばないIaCのガードレール再考 / Rethinking IaC Guardrails for Humans and AI Alike
kohbis
0
220
SREの視点で考えるSIEM活用術 〜AWS環境でのセキュリティ強化〜
cscengineer
PRO
0
310
LLMに渡さなかった仕事
nanaism
0
1.4k
Featured
See All Featured
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
510
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
580
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
710
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.2k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
3k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Optimising Largest Contentful Paint
csswizardry
37
4k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.2k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
410
Producing Creativity
orderedlist
PRO
348
41k
Navigating Team Friction
lara
192
16k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
390
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