Danh mục
Development
Web Development Data Storage Git Automation Database Design Web Scraping
Business
Business Analysis Communication Project Management Sales Forecasting Business Strategy Operations Management Human Resources Oil and Gas Industry
Finance & Accounting
IT & Software
Office Productivity
SAP Word Excel PowerPoint Excel VBA SharePoint
Personal Development
Persuasion Notion Workspace Mind Mapping
Design
Design Sketching Typography Game Design Digital Art zBrush 3D Animation
Marketing
SEO Marketing Strategy YouTube Marketing Digital Marketing Facebook Marketing Growth Hacking Twitter Marketing Instagram Marketing
Lifestyle
Beer Brewing Beauty Home Repair Energy Healing Bartending Leather Crafting Makeup Artistry Hypnotherapy
Music
Piano Guitar Singing Music Production Acoustic Guitar Fingerstyle Guitar Music Theory Bass Guitar
Duocmmo Tedu Tin học văn phòng Khoá học miễn phí Tất cả khoá học
Get link khoá học
Trang chủ
Development
Web Development
Laravel Ecommerce Website with Vue.js Admin Panel

Laravel Ecommerce Website with Vue.js Admin Panel

Loại khoá học: Development

Building Full Stack Applications with Laravel, Tailwind.css, Vue.js and Alpine.js and Deploy on Custom Domain

image
50.000 VND
65 VND
Đầy Đủ Bài Giảng
Học Online Tiện Lợi
Kích Hoạt Nhanh 2-5 Phút
Thanh toán tự động
Được phép tải xuống

Tổng quan

Nội dung khoá học

Đánh giá

Mô tả

Welcome to the world of E-commerce development with our comprehensive course on building and deploying Laravel E-commerce websites! Whether you're just starting out or looking to expand your skills, this course is designed to guide you through every step of the process, from setting up your development environment to deploying your project on a custom domain.

Throughout this course, you'll learn how to build full stack applications using the latest technologies including Laravel, Vue.js, Tailwind.css, and Alpine.js. With over 33 hours of video content and 200+ videos, you'll dive deep into every aspect of E-commerce development, including building a responsive landing page, managing cart items, implementing online payments with Stripe, creating an admin dashboard with analytics, and much more.

One of the highlights of this course is the hands-on project-based approach. You'll follow along as we build a fully functional E-commerce website, tackling real-world challenges such as debugging, problem-solving, and refactoring along the way. By the end of the course, you'll not only have a deep understanding of Laravel and Vue.js but also the skills to deploy your own projects and even connect to third-party APIs.

Here's a glimpse of what you'll learn:

  • Creating scalable Laravel projects

  • Integrating Tailwind.css themes into Laravel

  • Implementing Stripe online payments checkout

  • Handling Stripe Webhooks and email sending in Laravel

  • Developing responsive admin panels with Tailwind.css and Vue.js

  • Connecting Vue.js apps to Laravel REST APIs for CRUD operations

  • Deploying Laravel projects on custom domains and configuring business email addresses

  • And much more!

Whether you're a beginner looking to build your first project or an experienced developer seeking to enhance your skills, this course is tailored for you. With lifetime access to course materials and a private Discord group for support, you'll have everything you need to succeed.

So, if you're ready to take your E-commerce development skills to the next level, enroll today and join me on this exciting journey!

Bạn sẽ học được gì

Build full stack apps with Laravel, Vue JS and Tailwind CSS from start to finish

Create Tailwind CSS + Vue JS responsive admin panel

How to build Laravel REST API and connect it to Vue JS Admin Panel

Deploy Laravel and Vue JS apps on custom domain

How to integrate Stripe online payments in your Laravel applications

Yêu cầu

  • Good knowledge of Object Oriented Programming
  • Basic knowledge of Laravel
  • Basic knowledge of Vue JS

Nội dung khoá học

22 sections

Introduction

2 lectures
Project Full Demo
08:49
Prerequisites
00:59

Project Setup

6 lectures
Setup Working Environment
08:33
Understanding Database Schema
03:22
Generate Models and Empty Migrations
02:58
Write Migrations
06:28
Project Source Code
00:10
Discord Server
00:00

Building Vue.js Admin Panel

17 lectures
Section Overview
00:46
Tailwind.css Crash Course
13:33
Generate Vue.js project with Vite
04:01
Add Tailwindcss to Vue.js Project
03:27
Install vuex and create store
03:42
Install vue-router and create routes
05:11
Create Login form page
06:03
Create request password reset and reset password pages
12:09
Create Layout for guest users
10:27
Create Empty Layout for Authorized Users
05:25
Create Admin Panel Sidebar
16:52
Create Admin Panel Navbar
13:21
Create and Implement Sidebar toggle button
09:10
Make Layout Responsive
05:37
Handle Unauthorized Users to Redirect to Login Page
04:59
Create Not Found Page
12:33
Project Source Code
00:10

Connect Vue.js Admin Panel to Laravel API

8 lectures
Section Overview
00:22
Create Admin User Seeder in Laravel
04:07
Implement Login and Logout for Admin Panel in Laravel
10:00
Install and Configure axios in Vue.js
05:26
Implement Login/Logout Full Process
15:10
Show Validation Error Messages in Login Form
12:37
Add Splash Screen and Output User in Navbar
14:44
Project Source Code
00:10

Products CRUD in Vue.js Admin with Laravel API

18 lectures
Section Overview
00:39
Implement Product CRUD in Laravel API
14:00
Create Vue.js Spinner Component
03:32
Create Products Table in Vue.js
03:35
Connect Products Table Vue.js Component to API
11:22
Implement Pagination
13:26
Implement Per Page and Search in Products
05:19
Products sorting
19:53
Refactor Product Component
03:34
Create Empty Product Modal
07:33
Implement Product Creation Modal Component
21:29
Connect Product Create Modal to Laravel API
12:50
Product Delete
06:50
Product update
11:01
Add Animation to Products Table
03:34
Move API Controllers into Api Folder
01:10
Testing products CRUD
01:54
Project Source Code
00:10

Start Working on Website Frontend

14 lectures
Section Overview
00:29
Download the Frontend Theme
02:11
Install Laravel Breeze
03:57
Integrate E-commerce Theme into Laravel
20:55
Create Login Form with Theme Design
15:04
Create Password Reset Form
04:30
Create Signup Form
08:55
Render Products on Website Part 1
10:02
Render Products on Website Part 2
02:42
Send Email on Customer Registration
07:14
Customize Email Templates
10:42
Create Empty Product Page
07:36
Display Product Details Page
08:34
Project Source Code
00:12

Shopping Cart Functionality

12 lectures
Section Overview
01:18
Create Cart Helper with reusable methods
12:50
Create CartController
10:50
Prepare API Routes for Cart Management
03:51
Create middleware guestOrVerified
02:27
Prepare JavaScript for Add to Cart
10:50
Implement Adding Items into Cart
07:33
Create Cart Page Part 1
16:15
Create Cart Page Part 2
05:30
Show Cart Subtotal and Checkout Button
04:40
Implement Add to Cart from Product inner Page
05:31
Project Source Code
00:10

Customer Profile Management

11 lectures
Section Overview
00:13
Rename customer id into user_id
03:04
Insert Customer in DB on Cegistration
02:28
Change Countries States Column into JSON
02:56
Setup Eloquent Model Relations from Customer to Addresses and to User
06:07
Create Profile Controller
04:01
Create ProfileRequest
12:28
Create Customer Details Form
16:44
Implement Customer Details Update
10:44
Implement Password update
06:16
Project Source Code
00:10

Stripe Checkout & Orders

11 lectures
Section Overview
01:30
Stripe Online Payments Checkout Part 1
28:23
Stripe Online Payments Checkout Part 2
11:27
Stripe Online Payments Checkout Part 3
21:43
Stripe Online Payments Checkout Part 4
13:04
Create Order List Page for Customers
19:46
Implement Payment of Unpaid Orders
16:31
Stripe Webhooks Part 1
28:23
Stripe Webhooks Part 2
19:37
Create Order Details Page
20:00
Project Source Code
00:10

Output all Orders in Vue.js Admin Panel

11 lectures
Section Overview
00:44
Create Orders Table Component
08:38
Load Data into Orders Table
19:14
Prepare API for Order Details Page
11:50
Create Final version of OrderResource
15:37
Create Order Details Page
20:08
Implement Order Status Update from Admin
21:50
Display Notification on Order Status Update
15:52
Create Mail classes for new order and order status update
12:43
Final Test of Sending Emails
23:20
Project Source Code
00:10

User Management in Admin Panel

4 lectures
Section Overview
00:19
Prepare UserController in Laravel API
12:34
Display Admin Users in Vue.js Admin Panel
09:42
Implement User Update and Delete
13:54

Customer CRUD in Vue.js Admin Panel

13 lectures
Section Overview
00:33
Create Customer Table Component
11:49
Prepare Laravel API Controller for Customers
13:19
Create Customer Edit Form with Addresses
17:10
Update CustomInput Component add Checkbox Support
07:56
Implement Customer Update Part 1
14:40
Update CustomInput Component add Select Support
05:50
Implement Country State Cascading dropdown
23:44
Implement Customer Update Part 2
09:18
Implement Customer Search, by Name, Email, Phone
05:05
Debugging Laravel Error
14:36
Restrict Disabled Customer Login
05:25
Project Source Code
00:10

Create Dashboard

15 lectures
Section Overview
00:41
Create Overall Information Cards
12:41
Install vue-chartjs and Create Doughnut Chart
08:00
Create Products and Customers Empty Cards
05:10
Load Data From Backend for Dashboard Summary Cards
09:31
Format Number as Currency
03:19
Get Orders by Country and Load into Doughnut Chart
21:24
Implement Loading Latest 5 Customers
14:13
Display Latest 10 Orders
26:57
Create Currency Formatting Filter
08:27
Change Customer Modal into page and Link From Dashboard
15:07
Add Animation to Dashboard Cards
03:05
Implement Date Period Change
11:16
Update Report Data by Chosen Date
10:26
Project Source Code
00:10

Create Reports

11 lectures
Section Overview
00:41
Add Published column to Products Table
11:58
Create Report Routes in Vue.js
08:07
Create Reports Tab Components
02:51
Apply Styles to Active Report Tab
01:47
Create Reusable Trait
03:36
Create Backend API Endpoint to Get Orders Data
09:56
Process Orders Data for Charts
21:20
Create Customers Report
07:33
Implement Date Range Picker in Reports
19:00
Project Source Code
00:10

Deploy on production

17 lectures
Section Overview
00:39
Register on Hostinger.com for domain and hosting
04:24
Choose your domain
02:24
Setup web hosting & SSL
02:47
Setup subdomain for admin panel
02:16
Understand how we are going to deploy
04:03
Connect to hosting server using SSH
04:39
SSH basic commands
04:49
Connect to server with public, private keys
09:43
Installing Laravel using SSH
08:46
Create MySQL database
07:38
Deploy Vue.js admin panel
07:47
Create and use business email address for email sending
07:00
Configure stripe API keys
00:52
Fix bug about creating new product
08:02
Fix Laravel storage issue
03:57
Configure Stripe Webhooks
05:02

Bug Fixing and Optimization

13 lectures
Section Overview
01:07
Install Debug bar and optimize queries
09:49
Upgrade to Laravel 10
10:43
Install Laravel Telescope, debug and optimize API queries
19:37
Add DB Transactions Part 1
08:52
Add DB Transactions Part 2
07:35
Write critical logs when an exception occures
03:47
Update to latest version of Stripe PHP
07:31
Fix customer editing if the customer does not have addresses
06:41
Show validation errors on customer update from admin
12:21
Don't allow to make the order if customer address information is not provided
06:30
Update Vite and change the default port
03:56
Fix customer delete bug
03:15

Product Improvements

6 lectures
Section Overview
00:25
Change product modal into a product dedicated page
18:35
Show Notifications on product create, update and delete
02:26
Add Two buttons on product page and redirect user to products table
06:48
Add CKEditor for product description
14:51
Output CKEditor content correctly on frontend
04:01

Stock Management

6 lectures
Section Overview
00:39
Add quantity column to products table
09:04
Add quantity column to products table
06:21
Show error messages when adding item into the cart if it is out of stock
17:03
Check product quantity during checkout and restrict checkout process
07:21
Increase product quantity when order is cancelled
05:15

Multiple Images on Products

17 lectures
Section Overview
00:58
Define product_images migration and move image data into there
19:19
Add relations to Product and ProductImage models
01:41
Define image attribute on Product model
01:44
Add noimage image in admin and in frontend side as well
04:38
Create Image Preview component for image uploading
14:53
Implement image remove before file is uploaded
11:36
Implement image delete
14:50
Preview existing images
06:10
Implement saving multiple images
16:39
Fix bug of showing correct list of images on product update
02:17
Output multiple images on the website
07:15
Implement deleted image revert
06:00
Save images with random names on file system
06:05
Implement image ordering in Vue.js
30:37
Implement Image ordering in backend
05:52
Fix bug when images were not uploaded during product creation
03:39

Add Product Categories

15 lectures
Section Overview
01:13
Generate Category model, migration, controller, resources and requests
06:08
Implement category CRUD on backend side
08:55
Category CRUD on frontend Part 1
16:21
Category CRUD on frontend Part 2
25:41
Assign categories to product part 1 - Create product_categories table
06:02
Assign categories to product part 2 - Install Vue treeselect component
06:06
Assign categories to product part 3 - Save Categories on product
07:40
Assign categories to product part 3 - Implement get categories as tree
21:05
Remove ProductModal component and cleanup Products and ProductsTable components
04:02
Output categories as tree on home page
17:26
Implement filtering products by category on website
03:57
Implement filtering products by sub category on website
10:28
Implement sorting of categories by name in category dropdown in admin panel
04:49
Restrict choosing child category as parent during category update
16:07

More Product Improvements

6 lectures
Section Overview
00:23
Show proper validation errors in product form on product create/udpate
06:13
Pass images to stripe during checkout
06:03
Implement searching for products by keyword on website
11:25
Implement sorting of products Part 1
19:56
Implement sorting of products Part 2
03:21

Upgrade to Laravel 11

3 lectures
Upgrade to Laravel 11
12:55
Upgrade Application Structure to Laravel 11
21:14
Update vite packages
05:18

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

Khoá học liên quan

Flutter Bloc cho Mobile, Web, PC - Tôi chọn bạn

Flutter Bloc cho Mobile, Web, PC - Tôi chọn bạn

65 VND
50.000 VND
Bootstrap - Create 4 Real World Projects

Bootstrap - Create 4 Real World Projects

25 VND
50.000 VND
Build REST APIs with Python, Django REST Framework: Web API

Build REST APIs with Python, Django REST Framework: Web API

25 VND
50.000 VND
Complete Android Development with Kotlin Masterclass

Complete Android Development with Kotlin Masterclass

40 VND
50.000 VND
Lập trình react js chuyên sâu với React Hooks and Bootstrap

Lập trình react js chuyên sâu với React Hooks and Bootstrap

25 VND
50.000 VND
Vue - The Complete Guide (incl. Router & Composition API)

Vue - The Complete Guide (incl. Router & Composition API)

120 VND
50.000 VND
Python Django - The Practical Guide

Python Django - The Practical Guide

105 VND
50.000 VND
Ethereum and Solidity: The Complete Developer's Guide

Ethereum and Solidity: The Complete Developer's Guide

100 VND
50.000 VND
NestJS Zero to Hero - Modern TypeScript Back-end Development

NestJS Zero to Hero - Modern TypeScript Back-end Development

80 VND
50.000 VND
The Complete 2024 Web Development Bootcamp

The Complete 2024 Web Development Bootcamp

185 VND
50.000 VND
Java Servlet, JSP and Hibernate: Build eCommerce Website

Java Servlet, JSP and Hibernate: Build eCommerce Website

25 VND
50.000 VND
Backend Master Class [Golang + Postgres + Kubernetes + gRPC]

Backend Master Class [Golang + Postgres + Kubernetes + gRPC]

100 VND
50.000 VND
Unity 2D Dungeon Gunner Roguelike Development Course

Unity 2D Dungeon Gunner Roguelike Development Course

120 VND
50.000 VND
Java 17 Masterclass: Start Coding in 2024

Java 17 Masterclass: Start Coding in 2024

140 VND
50.000 VND
Angular - The Complete Guide (2024 Edition)

Angular - The Complete Guide (2024 Edition)

120 VND
50.000 VND
Learn how to create a 2D RPG game with Unity

Learn how to create a 2D RPG game with Unity

80 VND
50.000 VND
image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.

Get khoá học cho tôi