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初心者はVuetifyで遊んでみよう
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
kirimaru
June 24, 2019
Technology
1
1.2k
Vue初心者はVuetifyで遊んでみよう
kirimaru
June 24, 2019
Tweet
Share
More Decks by kirimaru
See All by kirimaru
早くAPI作るならFastAPI がオススメ
hirotokirimaru
1
87
DDD(ドメイン駆動設計)を知らない人に知ったつもりさせる/Introduce_DDD_to_unfamiliar_individuals
hirotokirimaru
0
360
例示! Spring Bootで作られた REST APIのテストコード/ Testing-Example-for-a-REST-API-created-with-Spring-Boot
hirotokirimaru
2
2.1k
一緒に使うことが多い値は別クラスにしよう(Data Clumps)/data_clumps_is_useful
hirotokirimaru
0
770
Backlogが好きな話。/i_like_backlog
hirotokirimaru
0
170
私が好きなポートアンドアダプターを紹介する/I-like-hexagonal-architecture.pdf
hirotokirimaru
1
1.3k
名付けのためにクラス図を元に会話しよう/Let's-use-class-diagram-to-communicate-with-client
hirotokirimaru
0
670
Code Smellsの Primitive Obsession に気を付けて設計する/Designing-with-Code-Smells-Primitive-Obsession
hirotokirimaru
1
3.7k
FCCを推す/My favorite software architecture is FCC
hirotokirimaru
0
260
Other Decks in Technology
See All in Technology
猫でもわかるKiro CLI(セキュリティ編)
kentapapa
0
120
マネージャー視点で考えるプロダクトエンジニアの評価 / Evaluating Product Engineers from a Manager's Perspective
hiro_torii
0
190
マーケットプレイス版Oracle WebCenter Content For OCI
oracle4engineer
PRO
5
1.6k
AWS DevOps Agent x ECS on Fargate検証 / AWS DevOps Agent x ECS on Fargate
kinunori
2
210
Oracle AI Database移行・アップグレード勉強会 - RAT活用編
oracle4engineer
PRO
0
110
[CV勉強会@関東 World Model 読み会] Orbis: Overcoming Challenges of Long-Horizon Prediction in Driving World Models (Mousakhan+, NeurIPS 2025)
abemii
0
150
Cosmos World Foundation Model Platform for Physical AI
takmin
0
980
Oracle Cloud Observability and Management Platform - OCI 運用監視サービス概要 -
oracle4engineer
PRO
2
14k
外部キー制約の知っておいて欲しいこと - RDBMSを正しく使うために必要なこと / FOREIGN KEY Night
soudai
PRO
12
5.6k
Greatest Disaster Hits in Web Performance
guaca
0
290
10Xにおける品質保証活動の全体像と改善 #no_more_wait_for_test
nihonbuson
PRO
2
340
Amazon Bedrock Knowledge Basesチャンキング解説!
aoinoguchi
0
170
Featured
See All Featured
Site-Speed That Sticks
csswizardry
13
1.1k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
79
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
62
50k
Speed Design
sergeychernyshev
33
1.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
196
71k
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
140
Accessibility Awareness
sabderemane
0
57
Building Flexible Design Systems
yeseniaperezcruz
330
40k
WENDY [Excerpt]
tessaabrams
9
36k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
740
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.4k
Transcript
Vue初心者は Vuetifyで 遊んでみよう Ginza.js#2 きり丸
きり丸(水上 皓登) twitter:@nainaistar Github:@hirotoKirimaru 通信会社所属 社内SE Webアプリエンジニア jQuery 3年 Vue.js 4カ月 2
対象者 非対象者 非対象者 • vueを使わない/ 使う予定のない人 • vuetifyを熟知した人 対象者 •
Vueの初心者 (tutorialやった人) • Vuetifyを 知らない人 • Bootstrap以外の CSSフレームワーク を知りたかった人 3
伝えたいこと 伝えないこと 伝えないこと • Vuetifyの セットアップ • bootstrapとの比較 • マテリアルデザイン
• atomic Design • Vuetifyを使った 仕事でのノウハウ 伝えたいこと • Vuetify について 4
Vuetifyを 使ったことある人 ✋
Bootstrapを 使ったことある人 ✋
Vuetify について ◦ Vue.js に対応している マテリアルデザインを ベースとした CSS フレームワーク ◦
Vue CLI 3との親和性あり ◦ IE11も対応 7
8
9
ところで 10
なんでvue初心者に vuetifyをオススメしてるの? 11
vuetifyの公式サンプルページが非常に優秀だから 12
https://vuetifyjs.com/ja/components/calendars 13
14
https://vuetifyjs.com/ja/themes/premium 15
16
まとめ 17
• マテリアルデザインの コンポーネントを提供してくれる • 楽しんで遊びながら、 マテリアルデザインと、 vueの挙動も把握できる 18
Vue初心者は Vuetifyで 遊んでみよう Ginza.js#2 きり丸
None
大田区産業プラザ 小展示ホール(京急蒲田) ★ 技術書オンリーの同人誌即売会 ★ 70サークル参加 / 10,000冊頒布予定 ★ 15:00以前の来場は無料チケット予約が必要です
★ 詳細は公式Webサイトをチェックしてください 2019-07-27 (土) 11:00-17:00 一般来場参加受付中 https://gishohaku.dev/