Udemy - Vuetify: Create an App with Vue JS & Vuex – in 5 Hours!

  • CategoryOther
  • TypeTutorials
  • LanguageEnglish
  • Total size4.6 GB
  • Uploaded Bytutsnode
  • Downloads140
  • Last checkedDec. 10th '20
  • Date uploadedDec. 07th '20
  • Seeders 20
  • Leechers28

Infohash : 7BA7EDE3E1F3AB309882626AE555C31C67E76FBC


Description

In this course you’ll learn how to use Vuetify, along with Vue JS & Vuex to create a gorgeous Todo app from scratch.

Vuetify is a hugely popular Vue UI Framework offering 100s of Material Design Components that can be used to create almost ANY website or app.

However, it can be difficult to get started, so in this course you’ll learn how to create a beautiful, responsive app from scratch that looks great on both desktop & mobile.

You’re gonna use tons of Vuetify Components such as Lists, Text Fields, Menus, Dialogs, Date Pickers, Snackbars & much more.

You’ll also use Vuex to centralise the app’s core data & logic, setting up State, Mutations, Actions & Getters.

You’ll split your app up into Child Components, to make the project easier to manage.

In our course app, Vuetify Todo we can display a list of tasks, add tasks & mark tasks as done by tapping on them.

Each task has a Menu, with options to edit the name of a task, add due date to a task, delete a task and even an option to reorder our tasks using drag & drop.

We can even filter our tasks using an expanding search field.

You’ll use Vue Router to setup Pages & Routes which can be navigated by links in the Navigation Drawer.

You’re gonna store all the data in the user’s browser using IndexedDB & Localbase. So even if the user closes the browser or refreshes it – all their data is maintained.

You’ll test, debug & fix the app on real iOS & Android devices.

And when you’re done, you’ll deploy your finished app to Netlify!
Who this course is for:

Anyone who wants to get started quickly with Vuetify, Vuex & Vue JS

Requirements

Basic HTML, CSS & JavaScript knowledge is required
Basic VueJS knowledge is beneficial but not required

Last Updated 11/2020

Files:

Vuetify Create an App with Vue JS & Vuex - in 5 Hours! [TutsNode.com] - Vuetify Create an App with Vue JS & Vuex - in 5 Hours! 18. Mobile, Testing & Fixing
  • 3. Fix the Add Task Field.mp4 (127.1 MB)
  • 1. Testing on iOS.mp4 (79.7 MB)
  • 1. Testing on iOS.srt (5.8 KB)
  • 2. Testing on Android.mp4 (63.7 MB)
  • 2. Testing on Android.srt (5.9 KB)
  • 3. Fix the Add Task Field.srt (10.7 KB)
  • 4. Hide Add Task Field on About Page.mp4 (42.3 MB)
  • 4. Hide Add Task Field on About Page.srt (3.6 KB)
  • 5. Fix Scrolling Issues.mp4 (100.7 MB)
  • 5. Fix Scrolling Issues.srt (8.6 KB)
  • 6. Fix the Snackbars.mp4 (26.2 MB)
  • 6. Fix the Snackbars.srt (2.1 KB)
  • 7. Disable Sorting when Searching.mp4 (46.9 MB)
  • 7. Disable Sorting when Searching.srt (3.9 KB)
  • 8. Finished App Code.html (0.3 KB)
  • 8.1 vuetify-todo-18.zip (333.7 KB)
1. Introduction
  • 1. Introduction.mp4 (93.6 MB)
  • 1. Introduction.srt (7.1 KB)
  • 2. What is Vuetify.mp4 (20.3 MB)
  • 2. What is Vuetify.srt (1.6 KB)
  • 3. Editor & Software Setup.mp4 (78.5 MB)
  • 3. Editor & Software Setup.srt (7.0 KB)
2. Getting Started
  • 1. Install Node.js & Vue CLI.mp4 (14.1 MB)
  • 1. Install Node.js & Vue CLI.srt (1.2 KB)
  • 2. Create a Vue Project & Add Vuetify.mp4 (36.5 MB)
  • 2. Create a Vue Project & Add Vuetify.srt (3.7 KB)
  • 3. Folder & File Structure.mp4 (58.1 MB)
  • 3. Folder & File Structure.srt (5.8 KB)
  • 4. Install Vue Devtools on Chrome.mp4 (18.8 MB)
  • 4. Install Vue Devtools on Chrome.srt (1.5 KB)
  • 5. Vue.js Basics.mp4 (36.4 MB)
  • 5. Vue.js Basics.srt (3.3 KB)
  • 5.1 Vue.js Basics (45 min).html (0.1 KB)
  • 5.2 Vue.js Lists & Components (17 min).html (0.1 KB)
  • 6. Clean up the Project.mp4 (7.4 MB)
  • 6. Clean up the Project.srt (0.6 KB)
3. Layout, Pages & Routes
  • 1. Start with a Wireframe.mp4 (14.9 MB)
  • 1. Start with a Wireframe.srt (1.8 KB)
  • 2. Setup the Drawer.mp4 (47.6 MB)
  • 2. Setup the Drawer.srt (4.0 KB)
  • 3. Setup Pages & Routes.mp4 (58.1 MB)
  • 3. Setup Pages & Routes.srt (4.9 KB)
  • 4. Get Pages Ready.mp4 (40.0 MB)
  • 4. Get Pages Ready.srt (3.8 KB)
  • 5. Header Styles.mp4 (40.5 MB)
  • 5. Header Styles.srt (3.2 KB)
  • 6. Replace Image & Title.mp4 (32.8 MB)
  • 6. Replace Image & Title.srt (2.4 KB)
  • 7. Finished Module Code.html (0.3 KB)
  • 7.1 vuetify-todo-3.zip (314.4 KB)
4. Todo Page
  • 1. Create a List of Tasks.mp4 (35.8 MB)
  • 1. Create a List of Tasks.srt (2.9 KB)
  • 2. Add a Data Property for the Tasks.mp4 (53.0 MB)
  • 2. Add a Data Property for the Tasks.srt (4.2 KB)
  • 3. Mark Task as Done.mp4 (96.6 MB)
  • 3. Mark Task as Done.srt (9.0 KB)
  • 4. Delete Task.mp4 (42.6 MB)
  • 4. Delete Task.srt (4.0 KB)
  • 5. Add Task.mp4 (99.4 MB)
  • 5. Add Task.srt (8.7 KB)
  • 6. No Tasks Fallback.mp4 (74.5 MB)
  • 6. No Tasks Fallback.srt (6.3 KB)
  • 7. Finished Module Code.html (0.3 KB)
  • 7.1 vuetify-todo-4.zip (315.2 KB)
5. Vuex
  • 1. What is Vuex.mp4 (95.0 MB)
  • 1. What is Vuex.srt (8.9 KB)
  • 2. Move Tasks into Vuex Store.mp4 (21.6 MB)
  • 2. Move Tasks into Vuex Store.srt (2.0 KB)
  • 3. Move addTask() Method into Vuex Store.mp4 (72.0 MB)
  • 3. Move addTask() Method into Vuex Store.srt (6.4 KB)
  • 4. Move doneTask() Method into Vuex Store.mp4 (19.8 MB)
  • 4. Move doneTask() Method into Vuex Store.srt (1.6 KB)
  • 5. Move deleteTask() Method into Vuex Store.mp4 (23.6 MB)
  • 5. Move deleteTask() Method into Vuex Store.srt (1.8 KB)
  • 6. Finished Module Code.html (0.3 KB)
  • 6.1 vuetify-todo-5.zip (315.3 KB)
6. Child Components
  • 1. Why Use Child Components.mp4 (13.3 MB)
  • 1. Why Use Child Components.srt (1.5 KB)
  • 2. Create Add Task Field Child Component.mp4 (59.4 MB)
  • 2. Create Add Task Field Child Component.srt (5.6 KB)
  • 3. Create Task List Child Component.mp4 (23.3 MB)
  • 3. Create Task List Child Component.srt (2.2 KB)
  • 4. Create Task Child Component.mp4 (47.1 MB)
  • 4. Create Task Child Component.srt (4.3 KB)
  • 5. Create “No Tasks” Child Component.mp4 (36.5 MB)
  • 5. Create “No Tasks” Child Component.srt (3.0 KB)
  • 6. Finished Module Code.html (0.3 KB)
  • 6.1 vuetify-todo-6.zip (319.7 KB)
7. Snackbars
  • 1. Create a Snackbar Component.mp4 (61.2 MB)
  • 1. Create a Snackbar Component.srt (5.5 KB)
  • 2. Show Snackbar when Task Added.mp4 (54.3 MB)
  • 2. Show Snackbar when Task Added.srt (4.5 KB)
  • 3. Show Snackbar when Task Deleted.mp4 (24.5 MB)
  • 3. Show Snackbar when Task Deleted.srt (2.1 KB)
  • 4. Make the Snackbar Text Dynamic.mp4 (29.6 MB)
  • 4. Make the Snackbar Text Dynamic.srt (2.5 KB)
  • 5. Allow Snackbars to be Shown in Quick Succession.mp4 (43.9 MB)
  • 5. Allow Snackbars to be Shown in Quick Succession.srt (3.9 KB)
  • 6. Allow Snackbar to be Dismissed.mp4 (25.6 MB)
  • 6. Allow Snackbar to be Dismissed.srt (2.6 KB)
  • 7. Finished Module Code.html (0.3 KB)
  • 7.1 vuetify-todo-7.zip (321.5 KB)
8. Dialogs
  • 1. Show a “Prompt to Delete” Dialog.mp4 (56.5 MB)
  • 1. Show a “Prompt to Delete” Dialog.srt (5.0 KB)
  • 2. Customize Dialog and Show on Delete Click.mp4 (38.2 MB)
  • 2. Customize Dialog and Show on Delete Click.srt (3.4 KB)
  • 3. Delete the Task when “Yes” Button Clicked.mp4 (30.7 MB)
  • 3. Delete the Task when “Yes” Button Clicked

Code:

  • udp://inferno.demonoid.pw:3391/announce
  • udp://tracker.openbittorrent.com:80/announce
  • udp://tracker.opentrackr.org:1337/announce
  • udp://torrent.gresille.org:80/announce
  • udp://glotorrents.pw:6969/announce
  • udp://tracker.leechers-paradise.org:6969/announce
  • udp://tracker.pirateparty.gr:6969/announce
  • udp://tracker.coppersurfer.tk:6969/announce
  • udp://ipv4.tracker.harry.lu:80/announce
  • udp://9.rarbg.to:2710/announce
  • udp://shadowshq.yi.org:6969/announce
  • udp://tracker.zer0day.to:1337/announce