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
この前出たハッカソンでVue.jsを使った話
Search
azurata
December 16, 2019
Programming
1
290
この前出たハッカソンでVue.jsを使った話
v-okinawa meetup #3で話した内容に個人情報を特定できるような項目を削除したものです
azurata
December 16, 2019
Tweet
Share
More Decks by azurata
See All by azurata
この夏始めたい 「TOPPERS/ASP3」
azurata09
0
51
誰でもわかる!React入門
azurata09
0
160
SPAJAM2022
azurata09
0
120
etrobo2022 Shiokara-z Model
azurata09
0
1.1k
SuggIt!
azurata09
0
110
Other Decks in Programming
See All in Programming
Combinatorial Interview Problems with Backtracking Solutions - From Imperative Procedural Programming to Declarative Functional Programming - Part 2
philipschwarz
PRO
0
130
.NET Conf 2025 の興味のあるセッ ションを復習した / dotnet conf 2025 quick recap for backend engineer
tomohisa
0
110
perlをWebAssembly上で動かすと何が嬉しいの??? / Where does Perl-on-Wasm actually make sense?
mackee
0
290
[AtCoder Conference 2025] LLMを使った業務AHCの上⼿な解き⽅
terryu16
6
1k
LLMで複雑な検索条件アセットから脱却する!! 生成的検索インタフェースの設計論
po3rin
4
1.1k
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
nrslib
1
1k
Vibe codingでおすすめの言語と開発手法
uyuki234
0
160
副作用をどこに置くか問題:オブジェクト指向で整理する設計判断ツリー
koxya
1
260
JETLS.jl ─ A New Language Server for Julia
abap34
2
470
ZJIT: The Ruby 4 JIT Compiler / Ruby Release 30th Anniversary Party
k0kubun
1
310
はじめてのカスタムエージェント【GitHub Copilot Agent Mode編】
satoshi256kbyte
0
140
組み合わせ爆発にのまれない - 責務分割 x テスト
halhorn
1
180
Featured
See All Featured
Everyday Curiosity
cassininazir
0
120
We Are The Robots
honzajavorek
0
130
jQuery: Nuts, Bolts and Bling
dougneiner
65
8.3k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Into the Great Unknown - MozCon
thekraken
40
2.2k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
34k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
KATA
mclloyd
PRO
33
15k
The Pragmatic Product Professional
lauravandoore
37
7.1k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
210
エンジニアに許された特別な時間の終わり
watany
106
220k
Transcript
slide master NORMAL この前出たハッカソンで Vue.jsを使った話 あずらた(@azurata45) 1
slide master NORMAL 自己紹介 あずらた • Twitter ⇒ @azurata45 •
情報科高校2年生 • 最近iPhone 11に変えた • 見ての通りVimmer • 普段はインフラ(Cisco) 2
slide master NORMAL 多分懇親会出れません (18歳未満なので) 3
slide master NORMAL 参加したハッカソン PARADISE JAM 2019 • 出場者は学生が多い •
提出作品はゲームが多い 今年のテーマは「首里城」 4
slide master NORMAL 作ったもの 首里城を守るために! • ノベルゲーム • Vue.jsを使用 •
シナリオライター(ほぼ)4人 プログラマー1人 • ソースコード ⇒ azurata45/pjam2019 5
slide master NORMAL やったこと一覧 • セリフの表示 • セリフ表示部のコンポーネント化 • JSONで記述したセリフ読み込み
⇒ JSONが読めなかったので変数として定義 • 選択肢の表示 • 選択肢によるストーリー切り替え • 背景の動的変更 • PWAの設定 6
slide master NORMAL 得られた知見 コンポーネントに状態をつけると面倒 全てこの記事で説明された↓ https://qiita.com/Yametaro/items/38420265011ee8bc42a0 7
slide master NORMAL 要約 • コンポーネント間の 親子関係を崩すな • 子コンポーネントは ディスプレイとして使え
• それがVueの利点だ 8
slide master NORMAL 僕の行動 1. セリフのコンポーネント化に成功 2. 調子に乗ってコンポーネントに 状態を持たせようと試みる 3.
できない 9
slide master NORMAL 当時の僕の知識 • Computedわからん • v-bindって何? 10
slide master NORMAL 当時の僕 こんな覚え方 しちゃ 駄目だな 11
slide master NORMAL 感想 • Vue使いやすかったなぁ~ • プログラマ1人はキツいなぁ • その場のノリで作るプロダクトを決めてはいけない(戒め)
• きちんとVue勉強しなきゃなぁ ⇐ 1年間言い続けている 12
slide master NORMAL この前出たハッカソンで Vue.jsを使った話 あずらた(@azurata45) おしまい 13