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でサービスを作成&運営してみて
Search
dala00
December 21, 2018
Technology
570
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Laravel + Vue.jsでサービスを作成&運営してみて
Laravel + Vue.jsでサービスを作成&運営してみて
dala00
December 21, 2018
More Decks by dala00
See All by dala00
Freelance Talk Session Kansai
dala00
0
62
A-FrameでWebVR
dala00
1
230
Nuxt.jsとExpressでWebサービスを作ってみた
dala00
0
1.8k
Laravelでサービスを作った時にやったこと
dala00
1
830
何でも書ける技術者向けコミュニティCrieit - 制作物天下一武道会
dala00
0
83
Other Decks in Technology
See All in Technology
銀行勘定系システムにおける開発プロセス刷新×AIによる環境モダナイゼーション / Development Process Transformation and AI-Driven Environment Modernization
muit
1
2.6k
Von-Neumann Machines, Dreams & The Futures of IT
ufried
0
120
AI de Idea
kawaguti
PRO
2
130
AIに任せた品質は、誰が見立てるのか - AI時代のテストマネジメント
nakanao
3
2.8k
絵ではじめるKubernetesセキュリティ
aoi1
4
700
10Xに技術的負債をもたらした「2つの境界の歪み」その構造と解消への営み
10xinc
0
2.3k
AI coding 整合正規方法
philipz
0
490
白金鉱業Meetup Vol.25 アウトカムが二値のデータに対するCausal Impact
brainpadpr
0
280
30座EKS, 180次升級淬煉的EKS Upgrade Skill 的歷程
eric8230
0
210
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
12k
ADKで始める業務改善 - AIエージェント開発時の考えと設計
harappa80
2
260
バイブコーディング時代のWebアプリ開発入門~Cloud Runで学ぶセキュアなビルドとデプロイ
waiwai2111
1
140
Featured
See All Featured
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.8k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
280
Joys of Absence: A Defence of Solitary Play
codingconduct
1
530
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
430
[SF Ruby Conf 2025] Rails X
palkan
3
1.4k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
3
1.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
3k
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9.2k
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
2
2.9k
Marketing to machines
jonoalderson
1
5.8k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
550
Transcript
Laravel + Vue.jsでサービスを作 成&運営してみて
自己紹介 Twitter: dala00 個人で色々とサービスを作っている(今年は5つ+ α) PHPメインだけどNode.js、Elixir、Firebase等何でも使ってリリースしたりする 普段人と話さないので、思いがけず普段脳内で言っているようにヌクストと言ってしまうかもしれません。ごめん なさい
作ってみた構成例 • Laravel + Vue.js (JS) ← 今回はこれの話 • Elixir
+ Phoenix (JS) • Laravel + Vue.js (TS) • Nuxt.js + Express (TS) • Nuxt.js + Firebase (TS)
作ったもの CrieitというQiitaのようだけど ポエムでも何でも書ける記事投稿サービス • Laravel • Vue.js • Bootstrap Material
Design (jQuery)
なぜVue.jsを選択したのか • 何度か使ったことがあって使いやすいと思った(コンポーネントの配置が簡単なのが良い) • React + Reduxは個人開発では重いと感じていた • Laravelにデフォルトで入っているから結構世界的にも人気がある? と感じた(実際には一時期流行って 主にReactの方が人気がある?)
• ネットを見てもかなり流行っていたため( 2017年のQiitaのAdvent Calendarのカレンダー数が#4まで あった) • 当時はNuxt.jsを使ったことがなかったため、選択しなかった。今だったら Nuxt.jsを使うと思う。
実際に使った箇所
None
None
None
使ってみてどうだったか
インストール後すぐ使えすぐ開発を進められる • Laravelに最初からpackage.jsonとサンプルコンポーネントが入っている • yarn run hotでホットリローディング • とにかくなんの準備もなくすぐ簡単に開発開始できて良い
Laravel Mixが楽 • 何も設定しなくても動くので簡単 • mix.webpackConfigでWebpackの設定も拡張できる • tsにすればTypeScriptを使える • mix.version()でバージョニング
使ってみてどうだったか • インストール後すぐ使えるしすぐ開発を進められて良い • Laravel Mixで設定も簡単 ◦ いちいちWebpackの設定を一からやる必要がない ◦ バージョニング
◦ TypeScriptに変更 • サーバーサイドレンダリングが不要なアプリケーションであればこれで十分
• サーバーサイドレンダリングができない ◦ JavaScriptのMarkdownエディタとセットの Viewerを使っているので本当は SSRしたい ▪ SSR用にPHP側でも同じ様なロジックを入れていて辛い。 JS側に統一したい ▪
Nuxt.jsに変えたいけど工数かかって辛そう。最初から Nuxt.jsにすべきだった • TypeScriptにすべきだった ◦ たくさんカンマ入れなきゃいけないのが辛い ◦ @Prop使いたい 使ってみて辛かったところ
普段の運用 • yarn run prodでリリースビルド • commitしちゃう • 本番で不具合があった時一瞬で戻せる(ビルド不要) •
本番でNode動かす必要がない 個人開発だったらこれで十分 これはNuxt.jsでなくVue.jsを使っている場合のみのメリット
まとめ • SSR不要ならLaravel + Vue.jsは良い選択肢 • SSR必要ならNuxt.jsを最初から使ったほうが良さそう • TypeScriptは最初から使っておいたほうが良さそう
宣伝 Advent Calendar企画をやっています。 (クリスマス&イブ空いてます) 技術関連連のことならポエムでも 何でもOKです。
ありがとうございました!