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
280
この前出たハッカソンでVue.jsを使った話
v-okinawa meetup #3で話した内容に個人情報を特定できるような項目を削除したものです
azurata
December 16, 2019
Tweet
Share
More Decks by azurata
See All by azurata
この夏始めたい 「TOPPERS/ASP3」
azurata09
0
47
誰でもわかる!React入門
azurata09
0
150
SPAJAM2022
azurata09
0
110
etrobo2022 Shiokara-z Model
azurata09
0
940
SuggIt!
azurata09
0
96
Other Decks in Programming
See All in Programming
Go1.25からのGOMAXPROCS
kuro_kurorrr
1
740
KotlinConf 2025 現地参加の土産話
n_takehata
0
100
KotlinConf 2025 現地で感じたServer-Side Kotlin
n_takehata
1
220
エラーって何種類あるの?
kajitack
5
160
C++20 射影変換
faithandbrave
0
490
try-catchを使わないエラーハンドリング!? PHPでResult型の考え方を取り入れてみよう
kajitack
3
510
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
110
統一感のある Go コードを生成 AI の力で手にいれる
otakakot
0
3k
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
knakagawa
1
110
複数アプリケーションを育てていくための共通化戦略
irof
10
3.9k
Go Modules: From Basics to Beyond / Go Modulesの基本とその先へ
kuro_kurorrr
0
120
レガシーシステムの機能調査・開発におけるAI利活用
takuya_ohtonari
0
600
Featured
See All Featured
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
910
Thoughts on Productivity
jonyablonski
69
4.7k
Become a Pro
speakerdeck
PRO
28
5.4k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Making Projects Easy
brettharned
116
6.2k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
The Pragmatic Product Professional
lauravandoore
35
6.7k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.8k
Unsuck your backbone
ammeep
671
58k
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