FULL STACK WEB DEVELOPMENT WITH LARAVEL AND VUE.

JS
COURSE OVERVIEW
Full Stack Web Development is nothing but complete designing of both websites and applications where the
developers need to work from front-end to back-end development. The perfect combination of full stack
development is Vuejs as front-end and Laravel as back-end development. This combination improves the
application's performance and development workflow.
In this 5-day course, students will learn how to build and deploy Full stack web application with Laravel and
VueJS. After completing this course, students will be able to optimize the code, send basic AJAX requests with
Axios, use WebSockets in Vue, integrate with the other framework such as Firebase, Feathers, and Horizon,
set up model & seed data, integrate the Fractal Response Service. start the web API using Laravel Lumen,
manage API resource, and design database scheme for API.
Duration: 5 days
WHO SHOULD ATTEND PREREQUISITES
Web Apps Developer or Front-End Developer who want  Have foundational knowledge in HTML,
to learn and build actractive web applications CSS and JavaScript experience would be
helpful.

COURSE CONTENT
PART I – FRONT END DEVELOPMENT
GETTING STARTED WITH VUE.JS
Creating the workspace • Initializing Vue and displaying
the first message • Computed values
DISPLAYING, LOOPING, SEARCHING, AND FILTERING
DATA
HTML declarations • Conditional rendering • v-for and
displaying our data • Filtering our data
OPTIMIZING YOUR APP AND USING COMPONENTS TO
DISPLAY DATA
Optimizing the code • Creating Vue components •
Creating a repeatable component • Making the filters a
component
GETTING A LIST OF FILES USING THE DROPBOX API
Creating a Dropbox app and initializing the SDK •
Displaying your data and using Vue to get it
NAVIGATING THROUGH THE FILE TREE AND LOADING
FOLDERS FROM THE URL
Separating out files and folders • Making file and folder
components
BUILDING AN E-COMMERCE STORE - BROWSING
PRODUCTS
Creating pagination • Displaying products in a category •
Updating the URL on checkbox filter change
BUILDING AN E-COMMERCE STORE - ADDING A
CHECKOUT
Creating the basket array placeholder • Adding product
information to the store
VUE COMMUNICATES WITH THE INTERNET
Sending basic AJAX requests with Axios • Validating user
data before sending it • Creating a form and sending data
to your server
ORGANIZE + AUTOMATE + DEPLOY = WEBPACK
Bundling your component with Webpack • Organizing
your dependencies with Webpack •
ADVANCED VUE.JS - DIRECTIVES, PLUGINS, AND
RENDER FUNCTIONS
Using WebSockets in Vue • Rendering a simple
component manually
INTEGRATING WITH OTHER FRAMEWORKS
Using Vue wwwith Firebase • Creating a real-time app
with Feathers • Creating a reactive app with Horizon
PART II – BACK - END DEVELOPMENT
AN INTRODUCTION TO LARAVEL
The need for frameworks • A new approach to
developing PHP applications • Laravel's main features
SETTING UP A DEVELOPMENT
Meeting Composer • Working with the command line •
Meet Homestead • Creating a new Laravel application
YOUR FIRST APPLICATION
Starting the application • Writing the first routes •
Preparing the database • Mastering Blade
ELOQUENT ORM
Retrieving data • Saving data • Deleting data • Query
scopes • Relationships Model events • Collections
CREATING THE BOOK APPLICATION
Building Something Amazing • Environment Setup
STARTING THE BOOKS API
Setting Up Models and Seed Data • Eloquent Books
CREATING, READING, UPDATING, & DELETING BOOKS
Creating a New Book • Updating an Existing Book

SUGGESTED NEXT COURSE

 Web Application Development Associate
 Web Application Development Using Laravel
 Content Management System (CMS) Course