Course Information
Registration period
Year-round Recruitment
Course Level
Study Mode
Duration
18 Hour(s) 14 Minute(s)
Language
English
Taught by
belasri imad
Rating
1 views
Course Overview
Build a dynamic e-commerce website with Laravel (v11–13), Vue 3 Composition API, Pinia, MySQL and Bootstrap 5
This course is not for beginners. It is designed for students who already have a good understanding of Laravel and Vue, including how to work with routes, components, APIs, and basic project structures.
If you are new to Laravel or Vue, please do not enroll in this course. We strongly recommend completing beginner-level tutorials or courses before joining, to ensure you can follow along and get the most out of the content.
Welcome to Build Vue 3 & Laravel (v11–13) E-commerce Website. This comprehensive course guides intermediate developers through building a fully functional, modern e-commerce website using Vue.js for the front end and Laravel for the back end.
Whether you're looking to add e-commerce functionality to a client project or start your online store, this course covers key aspects of web development, including user authentication, product management, shopping carts, payments, and order management.
By the end of the course, students will be able to create scalable, performant, and secure e-commerce websites that integrate modern JavaScript frameworks with robust backend technologies.
Technologies We Use
Laravel (v11–13) – Powerful PHP framework for building modern web applications.
Vue.js 3 – Modern JavaScript framework for building reactive frontend components.
Bootstrap 5 – For responsive layouts and styling.
MySQL – Database for app data.
Visual Studio Code (VS Code) – Code editor we will use throughout the course.
XAMPP – Local development environment (Apache, MySQL, PHP).
The course is project-based, and students will build an e-commerce website from scratch, learn how to implement complex features like shopping carts, user authentication, and payment processing, and build RESTful APIs with Laravel.
They’ll gain hands-on experience integrating Laravel with Vue to create a seamless, dynamic front end and a solid, scalable back end.
This course is perfect for developers looking to enhance their full-stack skills and gain hands-on experience with two of the most popular technologies in modern web development today.
This course assumes a good knowledge of JavaScript, Vue.js, Laravel, and basic web development concepts.
Course Content
- 27 section(s)
- 55 lecture(s)
- Section 1 Demo of the project
- Section 2 Backend - Database
- Section 3 Backend - Admin Dashboard
- Section 4 Backend - Manage Categories
- Section 5 Backend - Manage Brands
- Section 6 Backend - Manage Colors
- Section 7 Backend - Manage Sizes
- Section 8 Backend - Manage Products
- Section 9 Backend API - Manage Products
- Section 10 Frontend - Products
- Section 11 Frontend - Cart
- Section 12 Backend API - Manage Users
- Section 13 Frontend - Users
- Section 14 Frontend - Checkout
- Section 15 Backend - Manage Coupons
- Section 16 Backend API - Manage Coupons
- Section 17 Frontend - Coupons
- Section 18 Backend API - Manage Orders
- Section 19 Frontend - Orders
- Section 20 Backend - Manage Orders
- Section 21 Backend API - Manage Reviews
- Section 22 Frontend - Reviews
- Section 23 Backend - Reviews
- Section 24 Backend - Users
- Section 25 Frontend - Favorites
- Section 26 Frontend - 404 Page
- Section 27 Backend - Edit Input Fields
What You’ll Learn
- Create dynamic, responsive user interface for e-commerce website using Vue.js 3., Explore Vue.js 3 component system, life cycle hooks, state management (via Pinia)., Build out key features like product listings, shopping carts, customer accounts, checkout, implement secure payment using stripe., Explore advanced Laravel features such as implementing authentication, authorization, and robust API endpoints., Build a real-world project with Vue frontend, Laravel API backend, and Blade for the admin dashboard — all without using Laravel starter kits.
Skills covered in this course
Reviews
-
GGrzegorz Sokolowski
Very good project. Why not 5 starts? Somtimes he is rushing and not explaining clearly what he is about to build or how is he going to aproach the problem and why. One mistake. User is sellecting product with size and color but then in orders we olny have the product no size and no color. I fixed that isse and you can downnload it from my github if yiou want. I also added database seeding which is always a good way of building project. Factory and seeders. Also Cart and Wishlists should be stored in DB otherwise if you login with diffrenet user you will have items in the cart and wishlist from previouse user. So i fixed that as well Overall very good project and you will learn a lot Here is Github link to my version of this project if you interested https://github.com/gsokolowski/theshop
-
AAdeel Goraya
best
-
OOgunleye Peter
Excelent course
-
ssakda jatuporn
ในหน้า Product.vue //code error xxxxxxxxx //onMounted(() => productDetailsStore.fetchProduct(route.params.slug)) //use code watch( () => route.params.slug, // 1. สิ่งที่ต้องการเฝ้าดู (newSlug) => { // 2. ฟังก์ชันที่จะทำงานเมื่อ slug เปลี่ยน if (newSlug) { productDetailsStore .fetchProduct(newSlug) } }, { immediate: true } // 3. สั่งให้ทำงานทันทีเมื่อคอมโพเนนต์ถูกสร้าง (แทน onMounted) )
