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
110
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
280
Getting Started With Data Structures
adoranwodo
1
440
StereoKit: The Open Source SDK for VR/MR
adoranwodo
0
150
Accessibility in the context of Mixed Reality
adoranwodo
0
53
Skills to Excel in Cloud Engineering
adoranwodo
0
420
The Opportunities In The Decade Of Mixed Realities
adoranwodo
0
76
7 Habits of Highly Effective Engineering Teams
adoranwodo
0
160
Designing secure cloud applications
adoranwodo
0
180
Building a sustainable personal brand
adoranwodo
0
120
Other Decks in Technology
See All in Technology
今からでも間に合う! 生成AI「RAG」再入門 / Re-introduction to RAG in Generative AI
hideakiaoyagi
1
150
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.2k
Devin(Deep) Wiki/Searchの活用で変わる開発の世界観/devin-wiki-search-impact
tomoki10
0
260
Whats_new_in_Podman_and_CRI-O_2025-06
orimanabu
3
170
生成AIをテストプロセスに活用し"よう"としている話 #jasstnano
makky_tyuyan
0
120
Introduction to Bill One Development Engineer
sansan33
PRO
0
250
堅牢な認証基盤の実現 TypeScriptで代数的データ型を活用する
kakehashi
PRO
1
200
vLLM meetup Tokyo
jpishikawa
1
190
「規約、知識、オペレーション」から考える中規模以上の開発組織のCursorルールの 考え方・育て方 / Cursor Rules for Coding Styles, Domain Knowledges and Operations
yuitosato
5
1.4k
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
7.2k
大失敗しないための Web API 開発レシピ / A recipe for not making a big failure on WebAPI development
yokawasa
1
260
AIコーディング新時代を生き残るための試行錯誤 / AI Coding Survival Guide
tomohisa
9
12k
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
430
65k
Become a Pro
speakerdeck
PRO
28
5.4k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
Practical Orchestrator
shlominoach
188
11k
Unsuck your backbone
ammeep
671
58k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
14
1.5k
Building a Modern Day E-commerce SEO Strategy
aleyda
41
7.3k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3k
The World Runs on Bad Software
bkeepers
PRO
68
11k
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