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
Let's build a Vuejs web app
Search
Adora Nwodo
March 23, 2019
Technology
1
120
Let's build a Vuejs web app
Codelab for Vue vixens meetup. Introductory slides to show what would be covered in the codelab.
Adora Nwodo
March 23, 2019
Tweet
Share
More Decks by Adora Nwodo
See All by Adora Nwodo
Harnessing the Power of AI in Open-Source Cloud Engineering
adoranwodo
2
300
Getting Started With Data Structures
adoranwodo
1
450
StereoKit: The Open Source SDK for VR/MR
adoranwodo
0
160
Accessibility in the context of Mixed Reality
adoranwodo
0
60
Skills to Excel in Cloud Engineering
adoranwodo
0
440
The Opportunities In The Decade Of Mixed Realities
adoranwodo
0
90
7 Habits of Highly Effective Engineering Teams
adoranwodo
0
170
Designing secure cloud applications
adoranwodo
0
190
Building a sustainable personal brand
adoranwodo
0
130
Other Decks in Technology
See All in Technology
Introdução a Service Mesh usando o Istio
aeciopires
1
280
Okta Identity Governanceで実現する最小権限の原則 / Implementing the Principle of Least Privilege with Okta Identity Governance
tatsumin39
0
170
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
2.8k
OpenTelemetry が拡げる Gemini CLI の可観測性
phaya72
2
2.2k
難しいセキュリティ用語をわかりやすくしてみた
yuta3110
0
380
まだ間に合う! 2025年のhono/ssg事情
watany
3
630
CNCFの視点で捉えるPlatform Engineering - 最新動向と展望 / Platform Engineering from the CNCF Perspective
hhiroshell
0
140
SCONE - 動画配信の帯域を最適化する新プロトコル
kazuho
1
320
FinOps について (ちょっと) 本気出して考えてみた
skmkzyk
0
210
Observability — Extending Into Incident Response
nari_ex
1
130
AI時代、“平均値”ではいられない
uhyo
8
2.5k
AI AgentをLangflowでサクッと作って、1日働かせてみた!
yano13
1
150
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.2k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
116
20k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
14k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
253
22k
Gamification - CAS2011
davidbonilla
81
5.5k
Leading Effective Engineering Teams in the AI Era
addyosmani
7
600
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
How to Ace a Technical Interview
jacobian
280
24k
Facilitating Awesome Meetings
lara
57
6.6k
Building an army of robots
kneath
305
46k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Transcript
Let’s build a VueJS web app Vue Vixens. 23rd March,
2019
Hi, I’m Adora! Multidisciplinary software engineer GDG Ajah Co-organizer Women
Techmakers Ambassador Blogger, adorahack.com Twitter @theadoranwodo GitHub @adoranwodo 2
An open-source JavaScript framework for building user interfaces and single
page applications. 3
What we’d cover • Setting up your VueJS app •
CSS Grid • Styling in Vue • Code structure in preparation for moving forward 4
Tools you need • The WiFi (Connect if you haven’t)
• A modern browser (e.g. Chrome, Microsoft Edge) • A text editor (e.g. VSCode, Sublime Text) • NPM 5
Lets get started. 6
Install Vue and Dependencies • Install Vue CLI - npm
install -g @vue/cli -@vue/cli • Create a Vue Project - vue create pet-shop • Install Vuetify - npm i vuetify OR Clone the starter repo git clone https://github.com/AdoraNwodo/vue-vixens-starter.git 7
8 What we’d be building https://github.com/AdoraNwodo/vue-vixens-petshop
Shared Links • App.vue - bit.ly/vue-template • Styles - bit.ly/vue-style
• GitHub gist - gist.github.com/AdoraNwodo/ • Vue Documentation - https://vuejs.org/ 9
Lets start coding! 10