Vuejs.org: Large applications style guide

[vinicius73]

VueJS is awesome. I think amazing how simple it is to create applications with it.
But, large applications need bigger planning.
It would be great if the documents provide more tips for people who are not yet accustomed to component-based applications.

Obviously there must be only tips, not rules.
VueJS is beautiful by the flexibility it provides, giving freedom in the development of applications.

Well, I think it would be great that this initiative came from the core VueJS.

Thanks.

[posva]

Is there something wrong with the existing page http://vuejs.org/guide/application.html ?
Is there one or more specific problems you're facing that are not listed there?

[vinicius73]

I have not had any serious problems. To me it has been very intuitive and quiet.
I'm not following other communities, but in Brazil many developers are moving to VueJS.
Many of them are coming from AngularJS, others never created a SPA project before.

The community is moving hard to help these new developers. http://www.vuejs-brasil.com.br/
But our recommendation is to always follow the documentation.

http://vuejs.org/guide/application.html is perfect for those who already have good sense of how to organize your components and services.

But when you need to create more complex projects, with components grouped by modules, even vuex, it does not have all the help that these new developers need.

I believe that a good practice guide would be helpful for these developers, and something from the documentation would be great.

I understand that is not the nature of VueJS determine how applications should be made (love that about him).

[vinicius73]

• folder organization.
• nomenclature.
• modularization.
• how best to use events.
• how to integrate with third-party libraries.
• how centralize logics services.

Are some interesting topics to be addressed

[chrisvfritz]

@vinicius73 A few things you may be interested in:

• For 2.0, we're rewriting and expanding the guide to ensure that it's even more clear and thorough, and includes more examples. We're addressing everything you've listed above, apart from folder organization - you can see a discussion on that here. We're also open to contributions to similarly improve the 1.0 guide.
• @blake-newman is thinking of developing an ESLint plugin that might help in some of the following ways (Blake, feel free to edit this comment if I've misrepresented anything!):
  
  
  
  • catch mistakes such as:
  
  
  • invalid properties in Vue instance/component options (could be especially useful in catching typos, such as compute instead of computed)
  
  
  • assigning a new value to a prop
  
  
  • assigning data in ways that will bypass Vue's reactivity system
  
  
  • better enforce a consistent style within a team, including:
  
  
  • your desired order of Vue options (e.g. components, then props, then data, etc)
    
    
  
  
• @LinusBorg and I have discussed developing a "cookbook", similar to CoffeeScript's. The beginning of their cookbook is very similar in structure to our guide, but later on they walk through common scenarios and show how various features can be combined.
• I've personally been trying to develop more community resources, such as:
  
  
  
  • An open source workshop curriculum and app, which I'll eventually be expanding and making 2.0-only (maybe in the RC stage)
  
  
  • Examples of barebones routing without vue-router in 2.0, partially to help people understand how routing really works in a Vue application
  
  
  • Examples of backend server integrations
  
  

Are these initiatives in line with the kinds of resources you're hoping for?

[vinicius73]

Awesome!
I already knew the rewriting of documentation, but know that already are intended to approach these concepts makes me immensely happy.

All this content will be great for anyone who is starting with component-based applications and VueJS.

As I said before, our community is growing rapidly. We hope to contribute to these guides and documentation.
The first meetups are already starting!

[blake-newman]

@chrisvfritz Mostly will be mostly community driven, but will be working on this in about a months time.

[zoomclub]

I'm new to VueJS and delighted about how it brings a lot of complexity and diverse SPA requirements into a beautiful solution. It's great to see such executive spirit in action to bring about the much needed stability the frontend space needs.

The the list of "some interesting topics to be addressed" covers all the things I'm presently hashing through in refactoring my project with VueJS. I'm especially interested in "how to integrate with third-party libraries". For instance, using RxJS observables in action, mutation and render functions.

Presently, I'm working through this and would just like to point out that the existing vue-rx mixin severely curtails RxJS usage. It does this by simply subscribing any observables it finds, however typically multiple observables and observers need to work together first, before they finally produce the end data for a component data object or a Vuex store. VueJS and RxJS are a awesome combination, even when the role of RxJS is to only be a powerful utility in the larger scheme of an app.

[divmgl]

I think this should be taken with a grain of salt. One of the best things about Vue is that it doesn't hold your hand regarding how to structure your app or what design patterns to use. I think the copy for the new documentation should reflect that.

[zoomclub]

True, that is one of the best things about Vue. For instance, Vuex is an option just as RxJS is an option. In the final analysis one must use the best tool for the problem at hand. Glad to encounter a framework that allows for such a practical approach 💯

[chrisvfritz]

I think we're all on the same page here and efforts are indeed being made in this direction, so I'll close this for now, which doesn't mean conversation has to stop. 😃

[tyaramis]

A style guide like John Papa did for Angular would be great for VueJs.

[divmgl]

@tyaramis there are too many ways to architect an application in Angular, thus why the style guide was created. I still don't believe this would be practical for Vue.js.