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
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
80
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
160
私が好きなポートアンドアダプターを紹介する/I-like-hexagonal-architecture.pdf
hirotokirimaru
1
1.3k
名付けのためにクラス図を元に会話しよう/Let's-use-class-diagram-to-communicate-with-client
hirotokirimaru
0
650
Code Smellsの Primitive Obsession に気を付けて設計する/Designing-with-Code-Smells-Primitive-Obsession
hirotokirimaru
1
3.6k
FCCを推す/My favorite software architecture is FCC
hirotokirimaru
0
260
Other Decks in Technology
See All in Technology
Snowflake導入から1年、LayerXのデータ活用の現在 / One Year into Snowflake: How LayerX Uses Data Today
civitaspo
0
2.6k
小さく、早く、可能性を多産する。生成AIプロジェクト / prAIrie-dog
visional_engineering_and_design
0
150
Authlete で実装する MCP OAuth 認可サーバー #CIMD の実装を添えて
watahani
0
240
Oracle Database@Azure:サービス概要のご紹介
oracle4engineer
PRO
3
200
Keynoteから見るAWSの頭の中
nrinetcom
PRO
1
110
フィッシュボウルのやり方 / How to do a fishbowl
pauli
2
430
Agentic AIが変革するAWSの開発・運用・セキュリティ ~Frontier Agentsを試してみた~ / Agentic AI transforms AWS development, operations, and security I tried Frontier Agents
yuj1osm
0
110
アラフォーおじさん、はじめてre:Inventに行く / A 40-Something Guy’s First re:Invent Adventure
kaminashi
0
180
Autonomous Database - Dedicated 技術詳細 / adb-d_technical_detail_jp
oracle4engineer
PRO
5
11k
LayerX QA Night#1
koyaman2
0
280
Building Serverless AI Memory with Mastra × AWS
vvatanabe
1
740
業務の煩悩を祓うAI活用術108選 / AI 108 Usages
smartbank
9
17k
Featured
See All Featured
Designing Powerful Visuals for Engaging Learning
tmiket
0
190
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
350
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
120
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
97
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.6k
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
115
95k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
200
HDC tutorial
michielstock
1
280
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.9k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
74
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
98
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/