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
100
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
260
Getting Started With Data Structures
adoranwodo
1
420
StereoKit: The Open Source SDK for VR/MR
adoranwodo
0
130
Accessibility in the context of Mixed Reality
adoranwodo
0
41
Skills to Excel in Cloud Engineering
adoranwodo
0
400
The Opportunities In The Decade Of Mixed Realities
adoranwodo
0
52
7 Habits of Highly Effective Engineering Teams
adoranwodo
0
130
Designing secure cloud applications
adoranwodo
0
150
Building a sustainable personal brand
adoranwodo
0
98
Other Decks in Technology
See All in Technology
テストコード品質を高めるためにMutation Testingライブラリ・Strykerを実戦導入してみた話
ysknsid25
7
2.7k
これまでの計測・開発・デプロイ方法全部見せます! / Findy ISUCON 2024-11-14
tohutohu
3
370
プロダクト活用度で見えた真実 ホリゾンタルSaaSでの顧客解像度の高め方
tadaken3
0
200
誰も全体を知らない ~ ロールの垣根を超えて引き上げる開発生産性 / Boosting Development Productivity Across Roles
kakehashi
2
230
CysharpのOSS群から見るModern C#の現在地
neuecc
2
3.5k
[CV勉強会@関東 ECCV2024 読み会] オンラインマッピング x トラッキング MapTracker: Tracking with Strided Memory Fusion for Consistent Vector HD Mapping (Chen+, ECCV24)
abemii
0
230
OCI Security サービス 概要
oracle4engineer
PRO
0
6.5k
Amazon CloudWatch Network Monitor のススメ
yuki_ink
1
210
20241120_JAWS_東京_ランチタイムLT#17_AWS認定全冠の先へ
tsumita
2
300
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
2
3.2k
Oracle Cloud Infrastructureデータベース・クラウド:各バージョンのサポート期間
oracle4engineer
PRO
29
13k
IBC 2024 動画技術関連レポート / IBC 2024 Report
cyberagentdevelopers
PRO
1
120
Featured
See All Featured
Automating Front-end Workflow
addyosmani
1366
200k
Visualization
eitanlees
145
15k
Building Your Own Lightsaber
phodgson
103
6.1k
Music & Morning Musume
bryan
46
6.2k
10 Git Anti Patterns You Should be Aware of
lemiorhan
655
59k
4 Signs Your Business is Dying
shpigford
180
21k
Git: the NoSQL Database
bkeepers
PRO
427
64k
Writing Fast Ruby
sferik
627
61k
Art, The Web, and Tiny UX
lynnandtonic
297
20k
Docker and Python
trallard
40
3.1k
BBQ
matthewcrist
85
9.3k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
16k
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