CF

Learn Laravel Vuejs from scratch - Build a TESLA web app

6h 48m 12s
English
Paid

Embark on a journey to master the Laravel and Vuejs frameworks from scratch with this comprehensive course. You will learn by building practical projects, guiding you through the essential concepts and techniques required to develop robust web applications.

Course Overview

Introduction to Laravel and Vuejs

Begin with a foundational project that introduces you to the key concepts and architecture of Laravel and Vuejs. In our initial "Todos" project, you will gain a solid understanding of how these frameworks interact and function together to build dynamic web applications.

Advanced Project: Building a Tesla Web Application

Once you have grasped the basics, we will advance to creating a sophisticated web application modeled after the Tesla website. This challenging project will cover all aspects of web development from designing a visually appealing homepage to programming a comprehensive web application complete with:

  • Backend Management: Develop an admin panel for content management and application control.
  • User Interface: Craft a user-friendly frontend for an immersive user experience.

Tools and Libraries

Throughout the course, you'll leverage a range of tools to enhance your development process:

  • Vuetify: Utilize this library to create stunning, responsive designs without the hassle of custom CSS.
  • Vuex: Implement a global state management system that facilitates data sharing across components.
  • Event Bus: Enable seamless communication between Vuejs components.
  • Additional Tools: Employ CSS, Bootstrap, and other libraries to round out your web application toolkit.

Join us in this course to build, learn, and innovate with the powerful combination of Laravel and Vuejs.

About the Author: Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

Watch Online 48 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 48 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: 1-Tools required
All Course Lessons (48)
#Lesson TitleDurationAccess
1
1-Tools required Demo
00:59
2
2-Downloading required tools
01:09
3
3-Setting up project
04:20
4
4-Connecting blade with vue
02:25
5
5-Todos CRUD
13:49
6
6-Creating components
08:39
7
7-Setting up fontawesome
03:32
8
8-Adding todo items
05:45
9
9-Displaying todo items
13:45
10
10-Marking todos as completed
03:44
11
11-Deleting todos
02:48
12
1-Installing vue-cli and creating the project
03:08
13
2-Designing the navbar component
05:01
14
3-Designing the promo component
04:19
15
4-Designing the Specifications component
11:08
16
5-Designing the interior and Car core features component
06:10
17
6-Designing the order now component
02:40
18
7- Project Summary
00:54
19
1-Creating and setting up the project
05:50
20
2-Setting up vue router
06:41
21
3-Setting up vuetify
01:51
22
4-Designing the navbar component
03:00
23
5-Implementing the Model, View and Controller for categories
18:58
24
6-Add category route and button
01:37
25
7- Designing the category form
05:52
26
8- Connecting the category form with the state of the component
01:11
27
9- Implementing the store category function for submitting the form
13:42
28
10- Implementing the delete category function
04:24
29
11- Designing the edit category component and implementing the edit category fun
08:10
30
12- Implementing the products model and controller
03:20
31
13- Designing the Add Product component
05:42
32
14- Submitting the product form
08:49
33
15- Implementing the Products browse page
10:05
34
16 - Deleting Products
03:42
35
17- Editing products
14:39
36
18- Designing the client AppNavigator and HomePage component
11:40
37
19- Configuring things in web php file
01:20
38
20- Designing the Login component
07:41
39
21- Setting up laravel sanctum and submitting the login form
12:21
40
22- Implementing the logout button
03:07
41
23- Switching the AppNavigator based on authentication
11:01
42
24- Setting a relationship between the products and categories
04:44
43
25- Adding products to a specific category and setting a base url for axios
21:47
44
26- Designing the shop component
42:25
45
27- Designing Product Details Component
24:04
46
28- Designing the Category products component
24:57
47
29-Designing the Cart component and setting up vuex for the cart
29:38
48
30- Summarizing the project
01:39
Unlock unlimited learning

Get instant access to all 47 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Course content

48 lessons · 6h 48m 12s
Show all 48 lessons
  1. 1 1-Tools required 00:59
  2. 2 2-Downloading required tools 01:09
  3. 3 3-Setting up project 04:20
  4. 4 4-Connecting blade with vue 02:25
  5. 5 5-Todos CRUD 13:49
  6. 6 6-Creating components 08:39
  7. 7 7-Setting up fontawesome 03:32
  8. 8 8-Adding todo items 05:45
  9. 9 9-Displaying todo items 13:45
  10. 10 10-Marking todos as completed 03:44
  11. 11 11-Deleting todos 02:48
  12. 12 1-Installing vue-cli and creating the project 03:08
  13. 13 2-Designing the navbar component 05:01
  14. 14 3-Designing the promo component 04:19
  15. 15 4-Designing the Specifications component 11:08
  16. 16 5-Designing the interior and Car core features component 06:10
  17. 17 6-Designing the order now component 02:40
  18. 18 7- Project Summary 00:54
  19. 19 1-Creating and setting up the project 05:50
  20. 20 2-Setting up vue router 06:41
  21. 21 3-Setting up vuetify 01:51
  22. 22 4-Designing the navbar component 03:00
  23. 23 5-Implementing the Model, View and Controller for categories 18:58
  24. 24 6-Add category route and button 01:37
  25. 25 7- Designing the category form 05:52
  26. 26 8- Connecting the category form with the state of the component 01:11
  27. 27 9- Implementing the store category function for submitting the form 13:42
  28. 28 10- Implementing the delete category function 04:24
  29. 29 11- Designing the edit category component and implementing the edit category fun 08:10
  30. 30 12- Implementing the products model and controller 03:20
  31. 31 13- Designing the Add Product component 05:42
  32. 32 14- Submitting the product form 08:49
  33. 33 15- Implementing the Products browse page 10:05
  34. 34 16 - Deleting Products 03:42
  35. 35 17- Editing products 14:39
  36. 36 18- Designing the client AppNavigator and HomePage component 11:40
  37. 37 19- Configuring things in web php file 01:20
  38. 38 20- Designing the Login component 07:41
  39. 39 21- Setting up laravel sanctum and submitting the login form 12:21
  40. 40 22- Implementing the logout button 03:07
  41. 41 23- Switching the AppNavigator based on authentication 11:01
  42. 42 24- Setting a relationship between the products and categories 04:44
  43. 43 25- Adding products to a specific category and setting a base url for axios 21:47
  44. 44 26- Designing the shop component 42:25
  45. 45 27- Designing Product Details Component 24:04
  46. 46 28- Designing the Category products component 24:57
  47. 47 29-Designing the Cart component and setting up vuex for the cart 29:38
  48. 48 30- Summarizing the project 01:39

Related courses

Frequently asked questions

What is Learn Laravel Vuejs from scratch - Build a TESLA web app about?
Embark on a journey to master the Laravel and Vuejs frameworks from scratch with this comprehensive course. You will learn by building practical projects, guiding you through the essential concepts and techniques required to develop robust…
Who teaches Learn Laravel Vuejs from scratch - Build a TESLA web app?
Learn Laravel Vuejs from scratch - Build a TESLA web app is taught by Udemy. You can find more courses by this instructor on the corresponding source page.
How long is Learn Laravel Vuejs from scratch - Build a TESLA web app?
Learn Laravel Vuejs from scratch - Build a TESLA web app contains 48 lessons with a total runtime of 6 hours 48 minutes. All lessons are available to watch online at your own pace.
Is Learn Laravel Vuejs from scratch - Build a TESLA web app free to watch?
Learn Laravel Vuejs from scratch - Build a TESLA web app is part of CourseFlix's premium catalog. A CourseFlix subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch Learn Laravel Vuejs from scratch - Build a TESLA web app online?
Learn Laravel Vuejs from scratch - Build a TESLA web app is available to watch online on CourseFlix at https://courseflix.net/course/learn-laravel-vuejs-from-scratch-build-a-tesla-web-app. The page hosts every lesson with the integrated video player; no download is required.