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でサービスを作成&運営してみて
Search
dala00
December 21, 2018
Technology
1
530
Laravel + Vue.jsでサービスを作成&運営してみて
Laravel + Vue.jsでサービスを作成&運営してみて
dala00
December 21, 2018
Tweet
Share
More Decks by dala00
See All by dala00
Freelance Talk Session Kansai
dala00
0
47
A-FrameでWebVR
dala00
1
190
Nuxt.jsとExpressでWebサービスを作ってみた
dala00
0
1.7k
Laravelでサービスを作った時にやったこと
dala00
1
790
何でも書ける技術者向けコミュニティCrieit - 制作物天下一武道会
dala00
0
64
Other Decks in Technology
See All in Technology
これからSREになる人と、これからもSREをやっていく人へ
masayoshi
6
4.1k
個人開発から公式機能へ: PlaywrightとRailsをつなげた3年の軌跡
yusukeiwaki
11
2.7k
2.5Dモデルのすべて
yu4u
2
610
Classmethod AI Talks(CATs) #15 司会進行スライド(2025.02.06) / classmethod-ai-talks-aka-cats_moderator-slides_vol15_2025-02-06
shinyaa31
0
170
エンジニアのためのドキュメント力基礎講座〜構造化思考から始めよう〜(2025/02/15jbug広島#15発表資料)
yasuoyasuo
15
5.5k
AWSでRAGを実現する上で感じた3つの大事なこと
ymae
3
1k
High Performance PHP
cmuench
0
140
急成長する企業で作った、エンジニアが輝ける制度/ 20250214 Rinto Ikenoue
shift_evolve
2
880
まだ間に合う! エンジニアのための生成AIアプリ開発入門 on AWS
minorun365
PRO
4
580
5分で紹介する生成AIエージェントとAmazon Bedrock Agents / 5-minutes introduction to generative AI agents and Amazon Bedrock Agents
hideakiaoyagi
0
220
第13回 Data-Centric AI勉強会, 画像認識におけるData-centric AI
ksaito_osx
0
360
サーバーレスアーキテクチャと生成AIの融合 / Serverless Meets Generative AI
_kensh
12
3k
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
335
57k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Fireside Chat
paigeccino
34
3.2k
Building Your Own Lightsaber
phodgson
104
6.2k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
29
4.6k
Java REST API Framework Comparison - PWX 2021
mraible
28
8.4k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
BBQ
matthewcrist
86
9.5k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
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です。
ありがとうございました!