Laravel and Vue.js - Fullstack Web Development (2019)

28h 14s
English
Paid

Course description

Welcome to Laravel and Vue.js - Fullstack Web Development  course, the best online resource for learning how to build full stack web app with Laravel, Vue.js and other technologies. You will learn basic and advance Laravel features, integrating Bootstrap 4 to create beautiful and responsive website, Integrating Fontawesome 5, utilizing Laravel mix to write and compile Sass code and Javascript code and much more.

Read more about the course

All of my courses are project-driven learning, in this course we will build real world project, that will make you proud of yourself and make you confident to build complex web applications that you can imagine.

Here's exactly what you will learn:

  • Basic Laravel features: database migration, database seeds, model factories, accessor & mutattors, form validation, authentication and authorization.

  • Advance Eloquent Relationship: Many to many and Many to Many polymorphic relationship.

  • Integrating Fontawesome 5 via Laravel mix.

  • Integrating Bootstrap 4 for UI Styling.

  • Implementing DRY principle.

  • Using Git for version control and Github as code repository.

  • Introduction to Vue js: Directive, list rendering, conditional rendering, class binding, style binding, components, mixins and much more.

  • Integrating Vue js & Ajax to make our application more interactive.

  • RESTfull API Development

  • Deploy Laravel applications in Heroku and Digital Ocean Virtual Private Server.

  • Upgrade Laravel application to the newer version to make our app up to date.

  • And much more

So what you're waiting for? Join today and learn how to build full stack web apps from scratch with Laravel & Vue.js.

Requirements:
  • You should have a basic understanding of HTML, PHP, OOP, CSS & Javascript
  • A Mac, Windows, or Linux computer with Local Development Environement installed (xampp, wamp or Laravel homestead, etc)
  • A Mac, Windows, or Linux computer with Nodejs installed
Who this course is for:
  • Anyone who wants to learn how to combine Laravel with Vue js and other web technologies to build full stack web application
  • This course is meant for students already familiar with the basics of Laravel and wants to level up their development skills by building real life project

What you'll learn:

  • Build real world Vue js & Laravel applications
  • Build RESTful API
  • Build Single Page Application (SPA) from scratch
  • Deploy Laravel application both in Heroku and Digital Ocean Virtual Private Server
  • Understand how Vue js works and how it interacts with Laravel Backend API
  • Use Laravel Mix for asset compilation

Watch Online

This is a demo lesson (10:00 remaining)

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

View Pricing

Watch Online Laravel and Vue.js - Fullstack Web Development (2019)

0:00
/
#1: Welcome to the course

All Course Lessons (186)

#Lesson TitleDurationAccess
1
Welcome to the course Demo
05:45
2
Installing Local Development on Windows
15:19
3
Installing Local Development on Mac
15:57
4
Intro to Vue.js
07:13
5
Setup Vue.js locally
05:31
6
List Rendering - Part 1 of 3
03:55
7
List Rendering - Part 2 of 3
05:01
8
List Rendering - Part 3 of 3
04:59
9
Conditional Rendering - Part 1 of 3
04:41
10
Conditional Rendering - Part 2 of 3
04:23
11
Conditional Rendering - Part 3 of 3
03:57
12
Event Handling - Part 1 of 4
04:12
13
Event Handling - Part 2 of 4
02:49
14
Event Handling - Part 3 of 4
04:09
15
Event Handling - Part 4 of 4
04:49
16
Class Binding - Part 1 of 2
04:12
17
Class Binding - Part 2 of 2
08:29
18
Style Binding - Part 1 of 2
03:11
19
Style Binding - Part 2 of 2
06:24
20
Computed Property - Part 1 of 3
03:01
21
Computed Property - Part 2 of 3
06:32
22
Computed Property - Part 3 of 3
13:15
23
Project Overview
01:15
24
Creating basic sorting functionality
07:36
25
Styling the sortable columns
05:31
26
Refactoring
04:54
27
Implementing sortable column to product name & category
06:27
28
Fixing sortable column indicator issue
03:14
29
Adding basic searching functionality
06:09
30
Realtime searching
09:27
31
Another approach in presenting search results
08:44
32
Adding Pagination
11:06
33
Adding Form Modal
08:38
34
Getting list of categories
05:01
35
Updating existing data
13:42
36
Deleting data
02:44
37
Routing
08:06
38
Request & Response
05:13
39
Views
09:17
40
Working with Artisan CLI & Tinker
06:59
41
Setting up our Database connection
03:57
42
Database Migration
10:05
43
Working with Foreign key column
13:01
44
Populating database table with Seeder
10:22
45
Working with Faker Library
05:52
46
Eloquent
14:29
47
Eloquent Relationship
08:39
48
Eloquent Relationship - Inserting Related Models
05:42
49
Model Factories
10:44
50
API Resources
10:41
51
Controllers
14:30
52
Validation
08:09
53
Project Setup
12:35
54
Designing Question Schema - Part 1 of 2
08:34
55
Designing Question Schema - Part 2 of 2
08:28
56
Generating Fake data via Model Factories - Part 1 of 2
09:52
57
Generating Fake data via Model Factories - Part 2 of 2
09:05
58
Displaying all questions
15:47
59
Adding Author info and Question creation date on Question item - Part 1 of 2
10:32
60
Adding Author info and Question creation date on Question item - Part 2 of 2
09:14
61
Adding votes, answers and views counter on Question item - Part 1 of 2
12:40
62
Adding votes, answers and views counter on Question item - Part 2 of 2
12:15
63
Buiding Question Form - Part 1 of 2
12:53
64
Buiding Question Form - Part 2 of 2
06:19
65
Validating and Saving the Question - Part 1 of 2
10:55
66
Validating and Saving the Question - Part 2 of 2
12:02
67
Updating The Question - Part 1 of 2
09:45
68
Updating The Question - Part 2 of 2
09:50
69
Deleting The Question
09:39
70
Showing The Question detail
13:20
71
Authorizing The Question - Using Gates
12:38
72
Authorizing The Question - Using Policies
15:52
73
Designing Answer Schema
15:20
74
Generating Fake Answers - Part 1 of 2
09:24
75
Generating Fake Answers - Part 2 of 2
08:26
76
Displaying answers for question
17:55
77
Adding Vote Controls on Question and Answer - Part 1 of 3
08:10
78
Adding Vote Controls on Question and Answer - Part 2 of 3
11:58
79
Adding Vote Controls on Question and Answer - Part 3 of 3
13:41
80
Saving The Answer - Part 1 of 3
04:11
81
Saving The Answer - Part 2 of 3
10:32
82
Saving The Answer - Part 3 of 3
05:56
83
Updating The Answer - Part 1 of 2
10:42
84
Updating The Answer - Part 2 of 2
05:01
85
Deleting The Answer - Part 1 of 3
04:12
86
Deleting The Answer - Part 2 of 3
09:27
87
Deleting The Answer - Part 3 of 3
09:36
88
Accepting the answer as best answer - Part 1 of 2
12:03
89
Accepting the answer as best answer - Part 2 of 2
08:24
90
Favoriting The Question - Part 1 of 4
10:56
91
Favoriting The Question - Part 2 of 4
10:47
92
Favoriting The Question - Part 3 of 4
10:48
93
Favoriting The Question - Part 4 of 4
10:45
94
Voting The Question & Answer - Part 1 of 6
09:41
95
Voting The Question & Answer - Part 2 of 6
10:53
96
Voting The Question & Answer - Part 3 of 6
08:07
97
Voting The Question & Answer - Part 4 of 6
06:45
98
Voting The Question & Answer - Part 5 of 6
10:20
99
Voting The Question & Answer - Part 6 of 6
12:44
100
Refactoring The Models
09:58
101
Refactoring The Views - Part 1 of 2
06:30
102
Refactoring The Views - Part 2 of 2
14:47
103
Preventing The Application from XSS Attack - Part 1 of 2
13:41
104
Preventing The Application from XSS Attack - Part 2 of 2
10:31
105
Miscellaneous
13:37
106
Tidying up our views
12:20
107
Creating our first Vue.js Component - Part 1 of 2 (Building The Component)
14:05
108
Creating our first Vue.js Component - Part 2 of 2 (Using The Component)
13:21
109
Creating Vue Answer Component - Part 1 of 5 (Using Vue.js Inline Template)
05:12
110
Creating Vue Answer Component - Part 2 of 5 (Ajaxifying The Edit button)
07:25
111
Creating Vue Answer Component - Part 3 of 5 (Build Answer Inline Form)
16:58
112
Creating Vue Answer Component - Part 4 of 5 (Undoing changes)
06:41
113
Creating Vue Answer Component - Part 5 of 5 (Validation)
08:20
114
Ajaxifying the Delete answer button
06:37
115
Beautifying The Flash & Confirm messages
10:34
116
Creating Favorite Component - Part 1 of 3 (From button to Vue.js Component)
07:47
117
Creating Favorite Component - Part 2 of 3 (Event Handler)
09:57
118
Creating Favorite Component - Part 3 of 3 (Authenticating the button)
08:24
119
Creating Accept Answer Component - Part 1 of 2 (from button into Vue component)
10:32
120
Creating Accept Answer Component - Part 2 of 2 (event handler)
09:06
121
Rewriting The Authorization Logic - Part 1 of 2 (Core authorization)
08:33
122
Rewriting The Authorization Logic - Part 2 of 2 (Refactoring)
06:48
123
Creating Vote Component - Part 1 of 3 (From blade to Vue Component)
13:24
124
Creating Vote Component - Part 2 of 3 (Event Handling)
08:52
125
Creating Vote Component - Part 3 of 3 (Fixing issues)
07:39
126
Creating Vue Answers Component
12:48
127
Building Load more answers Feature - Part 1 of 2
11:09
128
Building Load more answers Feature - Part 2 of 2
08:57
129
Implementing Vue.js Custom Events
09:12
130
Implementing Global Event Bus
09:02
131
Creating New Answer Component - Part 1 of 2 (From blade to Vue.js component)
07:56
132
Creating New Answer Component - Part 2 of 2 (Event Handling)
12:38
133
Creating Question Component - Part 1 of 3 (from blade to vue.js component)
06:41
134
Creating Question Component - Part 2 of 3 (Build inline Form)
17:25
135
Creating Question Component - Part 3 of 3 (Misc)
11:16
136
Working With Vue.js Mixins
17:19
137
Section Intro
01:51
138
Composing Editor Component
13:36
139
Enable Markdown Preview
05:44
140
Autosizing The Editor
07:38
141
Syntax Highlight Integration
07:34
142
Fixing Syntax Highlight issue on the first load
04:00
143
Fixing Syntax Highlight issue when cancel editing
10:14
144
Creating Highlight Mixin
07:16
145
Integrating Markdown Editor in Answer Component
12:11
146
Integrating Markdown Editor in New Answer Component
05:45
147
Fixing Syntax Highlight issue after new answer added
06:35
148
Fixing Syntax Highlight in Answers Component
05:31
149
Installing Laravel Passport
06:39
150
Requesting a Passport Token
12:31
151
Creating API Endpoint for displaying all questions
06:37
152
Transforming Data using Eloquent API Resources
08:12
153
Creating Answer Endpoints
13:43
154
Current User's Posts Endpoint
17:52
155
Updating npm packages
00:00
156
Getting started with SPA - Setting up Backend Route Fallback
03:35
157
Getting started with SPA - Installing and configuring Vue Router
13:56
158
Getting started with SPA - Using Vue router RouterLink component
09:02
159
Getting started with SPA - Vue Router Navigation Guards
05:59
160
Getting started with SPA - Handling 404 error page
06:35
161
The QuestionsPage Component - Setting up API baseURL
05:09
162
The QuestionsPage Component - Building User Interface
13:08
163
The QuestionsPage Component - Consuming API Endpoint
02:30
164
The QuestionsPage Component - Fixing Authorization issue
02:33
165
Creating Question Form Component - From Blade file to Vue.js component
13:18
166
Creating Question Form Component - Handling Form Data
10:56
167
The Question Page Component - Showing question details
09:43
168
The Question Page Component - Displaying related answers
06:27
169
Displaying current user's post - Building User Interface
10:52
170
Displaying current user's post - Consuming Backend API
10:17
171
Polishing up our app - Adding Transition effect
03:40
172
Polishing up our app - Adding AJAX Spinner on All questions page
10:03
173
Polishing up our app - Using Axios interceptor to control the Spinner globally
08:35
174
Introduction
03:17
175
Upgrading to Laravel 5.7 - Update Dependencies & Core Application
23:32
176
Upgrading to Laravel 5.7 - Syncing Application's structure
15:53
177
Upgrading to Laravel 5.7 - Testing
13:33
178
Upgrading to Laravel 5.8 - Update Dependencies & Core Application
12:52
179
Upgrading to Laravel 5.8 - Syncing Application's structure
16:26
180
Upgrading to Laravel 5.8 - Testing
06:43
181
Upgrading to Laravel 6.0
12:07
182
Introducing Heroku
03:05
183
Creating Heroku App
04:39
184
Creating a Database
02:56
185
Setting Heroku Config Variables
06:50
186
Fixing Insecure Assets Error
05:35

Unlock unlimited learning

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

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Self-Made SaaS Course

Self-Made SaaS Course

Sources: Andrew Schmelyun
Move from idea to a finished application with the video course "Building SaaS Yourself"! You will learn to create a fully functional SaaS application from...
5 hours 19 minutes 41 seconds
How to Structure Laravel Project

How to Structure Laravel Project

Sources: laraveldaily.com
Basic Laravel is an MVC framework, it’s clear what should be in Model, View and Controller. But what if you have custom logic for processing data before passing it to the view? ...
4 hours 51 minutes 17 seconds
Master System Design with Laravel

Master System Design with Laravel

Sources: Martin Joo
"Art of System Design with Laravel" is a practical guide spanning 267 pages that will take you from simple single-server configurations to...
React Js A-Z With Laravel - For Beginner to Advanced Level

React Js A-Z With Laravel - For Beginner to Advanced Level

Sources: udemy
This React Js A-Z With Laravel Course will help you to become a Full Stack Web Developer. React has rapidly become one of the most powerful tools for building W
68 hours 1 minute 33 seconds
PHP with Laravel for beginners - Become a Master in Laravel

PHP with Laravel for beginners - Become a Master in Laravel

Sources: udemy
Laravel has become one of the most popular if not the most popular PHP framework. Employers are asking for this skill for all web programming jobs and in this course we have put...
42 hours 35 minutes 23 seconds