Vue Js 3 Drag And Drop Page Builder With Laravel Backend

wordpress like page builder, powered by vue 3

What you'll learn

Vue3 drag and drop page builder

Vue 3 components

Vue Conditional rendering

Vue List rendering

Vue reactivity

Form input bindings

Class bindings

Requirements

Basic understanding of vue

Description

In this course we will be building a  drag and drop page builder cms using vue 3 and Laravel (for the backend).  I won't be dwelling too much on Laravel, I'll focusing more on vue3 instead. I'll only be using laravel for the backend. So, if you're not familiar laravel, don't let the laravel part scare you away. You may buy the course and use your preferred backend language instead laravel, you can even use springboot and asp.net.  or any backend backend frame work.The skills and techniques taught in this course will boost your resume, and blow away hiring managers. This not just a basic vue course, we're building real stuff here using advances concepts of vue js and coding in general.  Please note that you do need a basic understand of the vue framework course to understand the concepts that are covered in this course.Want to level up your vue.js skills ? ever wanted to build your own drap and drop page builder like wordpress ? This course if for you. Whether you're a vue.js developer looking to sharpen your skills, or you just want to build a drap and drop page builder like wordpress, this course is for you.

Overview

Section 1: Introduction

Lecture 1 Introduction

Section 2: Let's get started

Lecture 2 Installing vue3

Lecture 3 Installing project dependencies and starting the dev server

Lecture 4 Server side routing with inertia

Lecture 5 The page manager

Lecture 6 The admin layout

Lecture 7 The admin layout part 2

Lecture 8 Installing bootstrap

Lecture 9 Installing font awesome

Lecture 10 Fixing icons alignment

Lecture 11 Importing font awesome

Section 3: The page manager in debt

Lecture 12 Introduction to the page manager

Lecture 13 The page selector part 1

Lecture 14 The page selector part 2

Lecture 15 Applying css styles

Lecture 16 The get pages function (skeleton version)

Lecture 17 The section manager

Lecture 18 Adding a plus icon to the section manager

Lecture 19 Renaming the 'Section' component to 'Section Manager'

Lecture 20 The Section Manager footer

Lecture 21 Toggling section manager

Lecture 22 Toggling the section manager part 2

Lecture 23 Page sections part 1

Lecture 24 Page sections part2

Lecture 25 Page sections part 3

Lecture 26 The slides manager

Lecture 27 The slides uploader component

Lecture 28 The slides uploader component part 2

Lecture 29 Changing uploader button color

Section 4: The live editor

Lecture 30 Introduction to the live editor

Lecture 31 The static section manager component

Lecture 32 The static section manager component part 2

Lecture 33 The live edit route

Lecture 34 The live editor component

Lecture 35 Initializing the live editor / page builder

Lecture 36 Initializing the live editor component part 2

Section 5: Stay tuned for more tutorial - currently re-recording the following sections

Lecture 37 Stay tuned for more tutorials

Vue js developers