8

I'm starting a new large-scale application and after hearing a lot about VueJS + Laravel combination i thought of using it. I followed Laracasts' Learn Vue 2: Step By Step series and some tutorials to understand how it works.

But have few questions in mind:

  1. Why do we even need to use Vue with Laravel. I understand that we can create component like <user-profile></user-profile> in Vue, and then use it in Laravel Blade. But it looks like over-complication things? Firstly we pass data from controller to blade, and then further pass it to vue. Why do we need to do that?

  2. Laravel and Vue both have their own routing system. Which one to use?

  3. How to structure an app using Laravel + Vue

PS. I'm making an application that will mostly be used on mobile devices.

Improve this question
1
  • Understood. But i'm still not getting the point that why do you even want to use Vue. In most of the examples they created a vue-compinent and used it in Laravel blade. But you can simply create Laravel's component for that: laravel.com/docs/5.4/blade#components-and-slots Commented Aug 22, 2017 at 14:43

1 Answer 1

Reset to default
8

moved from comment

Why do we even need to use Vue with Laravel.

Although you probably already knew, Vue is just one of many javascript frontend frameworks (libs?) You can consume the data send from the server any way you want. Vue is just the sister-framework of Laravel. The only thing you can probably say as to why they are mentioned together is that you can "talk" (interface) easily between them using json objects. Javascript is meant to make your page interactive, have behaviour. Use it when you need this.

Laravel and Vue both have their own routing system. Which one to use?

Whatever you want, do you want a "single page" (blade) that is rendered in 3 different pages by Vue, say like some kind of Wizard form. It really depends on where you want to put the load. I think you can think of use-cases where client side page rendering would be better, but most of the time server sided will be a great choice.

Single page applications are more snappy (faster) after initial load, but server side rendered applications are better for SEO in general. There are also ways to let a SPA render on the server to improve SEO however. And this we we can keep the discussion going for some while.

How to structure an app using Laravel + Vue

Laravel has already an example vue file under resources/assets/js/app.js. So it is safe to assume you can put everything there.

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

thanks Thomas for the wonderful explanation. The app i'm building will mostly be used on mobile device. DO you think it's a good idea not to merge Vue + Laravel, build everything on Vue and use Laravel for API only?
It really is up to you, but maybe you can consider this inside your head: 1) Is development going faster using Vue interaction wise? 2) Are there certain tasks you can ony do with Vue? 3) Do you want to load certain elements async over xhr (ajax)? 4) Do you need the website to work without javascript enabled? 5) Do you want to write certain validation 2 times, because you cannot rely on client-side validation? 6) ... And prioritize these conclusions.
Sure its a good idea ! Think about the web apps you use. The modern single page ones blow the server-rendered ones outta the water, in terms of reactivity, feel, sophistication, and, at least with vue, ease of development. This is the future.
@user1585345 You are right that you van build beautiful and fast web applications with Vue, but it's always good to consider if it is also the right tool for the job at hand.
Nice explanation and was in confusion on that topic. Thanks Thomas

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.