Traversy Media | Vue 3 & Composition API - Full Project @TraversyMedia | Uploaded 9 months ago | Updated 3 hours ago
Build an expense tracker application from scratch using Vue.js 3 and the composition API with the latest syntax from version 3.2.
Final Code:
https://github.com/bradtraversy/vue-expense-tracker
Vanilla JS Project Repo:
https://github.com/bradtraversy/vanillawebprojects
Blog Post:
https://www.traversymedia.com/blog/vue-expense-tracker
Check Out My Courses:
https://traversymedia.com
Timestamps:
0:00 - Intro & Demo
3:21 - Vue.js Setup
4:57 - File Structure
7:44 - Boilerplate Clean Up
9:06 - Create Component Files & Templates
12:30 - Create and import Components
18:50 - TransactionList Display
28:37 - Transactions in Global State
30:12 - Pass & Recieve Props (defineProps)
32:30 - Balance Component & computed()
37:21 - Income & Expenses Component
42:34 - AddTransaction Form Component
44:58 - Binding Form Inputs
46:41 - Validation & Toasts
52:05 - Emit Custom Events (defineEmits)
54:45 - Add Transaction to State
59:30 - Deleting Transactions
1:03:30 - Fetch From Local Storage & OnMounted()
1:06:09 - Save to Local Storage
Build an expense tracker application from scratch using Vue.js 3 and the composition API with the latest syntax from version 3.2.
Final Code:
https://github.com/bradtraversy/vue-expense-tracker
Vanilla JS Project Repo:
https://github.com/bradtraversy/vanillawebprojects
Blog Post:
https://www.traversymedia.com/blog/vue-expense-tracker
Check Out My Courses:
https://traversymedia.com
Timestamps:
0:00 - Intro & Demo
3:21 - Vue.js Setup
4:57 - File Structure
7:44 - Boilerplate Clean Up
9:06 - Create Component Files & Templates
12:30 - Create and import Components
18:50 - TransactionList Display
28:37 - Transactions in Global State
30:12 - Pass & Recieve Props (defineProps)
32:30 - Balance Component & computed()
37:21 - Income & Expenses Component
42:34 - AddTransaction Form Component
44:58 - Binding Form Inputs
46:41 - Validation & Toasts
52:05 - Emit Custom Events (defineEmits)
54:45 - Add Transaction to State
59:30 - Deleting Transactions
1:03:30 - Fetch From Local Storage & OnMounted()
1:06:09 - Save to Local Storage
![JavaScript Under The Hood [5] - JavaScript Engine Overview](https://i.ytimg.com/vi/oc6faXVc54E/hqdefault.jpg "JavaScript Under The Hood [5] - JavaScript Engine Overview
In this final video of the series, we will talk about JS engines and look at how JavaScript code is turned into machine code that runs on the CPU.
💻 My Courses & More
https://traversymedia.com
💖 Show Support
Patreon: https://www.patreon.com/traversymedia
PayPal: https://paypal.me/traversymedia
👇 Follow Me On Social Media:
Twitter: https://twitter.com/traversymedia
Instagram: https://www.instagram.com/traversymedia
Linkedin: https://www.linkedin.com/in/bradtraversy
Timestamps:
0:00 - Intro
0:42 - What is a JS Engine?
1:31 - Specific Browser Engines
3:30 - Compiled vs Interpreted Languages
6:11 - JS Engine Process Overview
7:25 - Abstract Syntax Tree (AST)
10:01 - Interpreter & Bytecode
10:58 - JIT Compilation")
