7 ms·

Using Vue.js and Rails

109 points by whitefang 9y ago

buttminer 9y ago
"Vue.js is awesome. I’m telling this after having used React for more than a year in production software". I wish the author gave some mentions as to why that's the case (and why he's even using Ruby here). I've been using React with MobX and Typescript for the past year in production and it's been treating me and my team very well. The framework feels quite invisible at this point.
- yaseer 9y ago
  It's probably opening a can of worms to begin the JavaScript Framework comparison in that blog post. I'd imagine it would detract from their central aim of an integration guide. I also imagine this HN thread will quickly turn into a thread dominated by framework comparisons (it's the main reason I clicked through...)
  - whitefang 9y ago
    Maybe it was not right to start on that note and I should have given some background. But trust me my intentions were not bad. Here is a post I've written on my experience using React https://www.classandobjects.com/tutorial/problems_with_react_single_page_app/ https://www.classandobjects.com/tutorial/problems_with_react... I would update the article to include this.
    - heartbreak 9y ago
      I’ve been clicking through your blog for the last 20 minutes or so, and I’ve been really impressed. I’m itching to get home from work today and try out Vue with a Rails side project I’ve been working on. Thank you!
      - whitefang 9y ago
        I'm so happy. I'll keep writing. :)
- vec 9y ago
  I'm not the author, but that quote lines up almost exactly with our experience. First, Vue shares most of the things that actually make React exciting. Component oriented, one-way databinding, virtual DOM, a first party Flux-inspired state management plugin. We didn't feel that we lost anything moving from React to Vue, and most of our existing components were trivial to port. What we gained, on the other hand, is a whole lot of developer comfort. Vue's template syntax can be read and manipulated by people who aren't primarily Javascript developers. Directives and filters eliminate quite a bit of boilerplate. Opt-in two way binding eliminates noisy setter functions without any loss of clarity. Getters enable the use of computed values as though they were raw data. There's no single killer feature, but taken together Vue just feels much more pleasant to use than React. React has the correct fundamental abstraction, but the actual API mistakes "small" for "simple". JSX, in particular, is trivial to explain and understand in theory, but in practice is often quite verbose and complex to use, as everyone who has asked themselves "how do I actually write an if/else block" has discovered to their dismay. Vue plux Vuex keeps the same conceptual simplicity and cleanliness as React, but it pairs it with a much larger, much more opinionated API that doesn't force us to reinvent every wheel we need.
  - hashkb 9y ago
    You don't mention mobx. If you haven't used it, you ought want to give it a look and reconsider your opinion
    - rpeden 9y ago
      I enjoy mobx a lot, but I don't think it really address most of the points vec raised. The way I look at it, it's not a contest. If Vue is better for some developers and some teams than React, that's great! It's nice to have multiple good tools to choose from.
    - nlperguiy 9y ago
      According to https://vuejs.org/v2/guide/comparison.html https://vuejs.org/v2/guide/comparison.html , vuejs is less verbose React + Mobx.
  - 9y ago
- boubiyeah 9y ago
  Yeah, depends what you value. vue is "easier" with probably less boilerplate at the cost of more magic and less type safety due to magic string templates (if using typescript like I love to) Definitely not a good tradeoff for me, but it is for some.
  - k__ 9y ago
    Never understood this. How is Vue easier if we only consider components? How can it offer something simpler than functions as components?
    - vec 9y ago
      Because "simple" and "easy" are not synonyms. For example, Backbone is much simpler than React. React keeps a full virtual copy of the DOM in runtime and uses complex diffing algorithms to decide when and how to actually update the DOM in a manner which is entirely opaque to the developer. Backbone just does the DOM updates you tell it to, when and how you tell it to. And since Backbone is so much simpler, it logically follows that building an application in Backbone much be much easier than building the same application in React, right? Right? In Vue, a component generally consists of a raw JS object, an (almost) HTML template, and a block of raw CSS. The framework does some opaque but straighforward work to bind these three together into a single conceptual entity. This is indeed more complex, but the added complexity follows the grain of my preexisting intuitions. The end result, in practice, is components which have a clean internal structure and much less boilerplate. Slightly more complex, but easier.
- chmln 9y ago
  We've used React and the ecosystem quite extensively at a company I worked at, and the main gripe we had were forms. Yes, there is redux-form but the fact that it exists seems like a drawback for React and Redux. Its APIs can be very clunky and not straightforward at all. setState(...) is not a good solution either as things can get more complicated with nested objects and such. In Vue, you don't even think about this problem. There's v-model which makes forms a breeze.
  - whitefang 9y ago
    Yes, form validation is a huge mess. I would say this would be one of the major reason, I even tried Vue for the first time.
- kendallpark 9y ago
  > "Vue.js is awesome. I’m telling this after having used React for more than a year in production software" Had the exact same experience. After Angular 1, Ember, and React, Vue is the first JS framework that I'm actually excited to use. My three biggest gripes with React are solved with Vue 1) better out-of-the-box experience (CRA is still not ideal), 2) single file components that strike a great balance between templating, logic, and styling, 3) Vuex is a slick Flux architecture with much less boilerplate than something like Redux. Vue is opinionated enough to give you a sane structure and guidance, but not so opinionated that you feel trapped in their domain and get lost in domain-specfic magic. You might say it's the goldilocks of frameworks. Doesn't introduce any radical new ideas, but MAN does it strike the right balance.
duiker101 9y ago
Slightly off but is it just me or Ruby and Rails pretty much disappeared in a puff of smoke after being all over HN for a while?
- serg_chernata 9y ago
  I have to agree. I remember several years back RoR was in every third headline.
  - deleted 9y ago
    [deleted]
  - petepete 9y ago
    Rails has simply become dull, and that's not a bad thing. It's a solid choice for most web applications, once you know the framework it's very easy to write complex software quickly in a sensible manner.
- mrtksn 9y ago
  These days, everything is about JavaScript as lot's of exciting stuff keep happening in the area. What's the latest exciting thing that happened with RoR?
  - hashkb 9y ago
    Some of us see stability as a positive. You don't have to make headlines every week to be reliable and useful!
    - mrtksn 9y ago
      I'm not saying that it's bad, the thing is that you don't talk too much about a mature tech with established ways of doing things.
- kirillseva 9y ago
  There pretty much aren't that many new problems to solve that RoR ecosystem hasn't solved already, hence hard to generate hype. RoR developers are busy building things and don't spend much time on forums anyway. And those that do, they are on forums to learn about new exciting shiny frameworks/languages, like Elixir
stevebmark 9y ago
<el-form :model="user" :rules="rules" I would still rather write lintable, composable Javascript (JSX) than an embedded mini string language in HTML attributes. This is a strange post, it's even less information than a Vue 101 post?
- warent 9y ago
  It is not an embedded mini string language. It is JavaScript and interpreted as such. When an attribute is prefixed with a colon (:), then those quotations are homologous to JSX curlies. Your IDE should be able to syntax highlight and even lint it.
  - Kiro 9y ago
    The comment was clearly not about colons alone. I've built a large project in Vue and I absolutely hated the template language compared to JSX. It was Angular 1 all over again.
    - sillysaurus3 9y ago
      FWIW Webstorm somewhat mitigates this. I know it feels sticky to rely on IDE tooling, but it's pretty good in my experience. People have reported some issues with the Vue tooling, but it's worth trying: brew cask install webstorm cd your-app && webstorm .
- aaron-lebo 9y ago
  Sometimes I get the impression that Vue is the new Angular that everyone is excited about but people will be moving on from in 3 years. It's "my first framework" kind of thing, or maybe it's a well-presented and complete package, which has obvious value. It would be interesting to see an informed comparison. What's Vue doing that a million other frameworks aren't?
  - kirillseva 9y ago
    To me vue is like react but with > simpler syntax. I think single-file components is a great thing when you're getting started. While true "js ninjas" will call me out on this, they're probably employed by a large org with problems that are different from mine. > less choice. I only write frontend occasionally. How would I know which react-router to choose? What's the best redux package? What about handling CSS, what's the flavor du jour? Vue says "want something done - do this. here's vue router, vuex, etc." Overall, the two are very much similar in both how they work and what they provide, but one is developed and used by an organization that has a virtually infinite supply of engineers, and the other is being developed by one guy. Technology that makes Facebook successful may be inappropriate for a successful hackathon or a small startup
wnm 9y ago
what I don't like about that setup is that views are rendered in the client, instead of on the server. I wish there was a js framework, which would let me keep renderering my views with rails on the server, but then take over and help me handle ui interactions etc..
- jeffjose 9y ago
  vue.js supports SSR out of the box, AFAI-can tell. Isnt that what you're asking?
  - wolco 9y ago
    I think he wants a rails/vue hybrid backend. Why is another question.
- whitefang 9y ago
  Yes, that is what I want. Here is a question that I posted on stack overflow, which talks about replacing ERB with Vue. https://stackoverflow.com/questions/43084499/replacing-rails-erb-template-with-vue https://stackoverflow.com/questions/43084499/replacing-rails... If this interests you, I would love to work. :)
stevenwoo 9y ago
I just started learning Vue.js, do you recommending switching to this gem immediately or learning Vue.js fundamentals first then using the gem?
- inopinatus 9y ago
  Not the author but I recommend trying it in a simple CRUD Rails 5.1 app with the Webpacker gem version 3.0.2 or later, first running through the Vue tutorial guide in that context. Once you've got a fuller understanding of how it fits in, add webpacker to your existing app and starting building Vue components. Chris Oliver's guides on GoRails are also quite useful although they're becoming out-of-date already in some aspects.
- whitefang 9y ago
  If you know Rails already and you are new to Vue.js. I would say first do some small frontend app only in Vue. So that Vue is not the problem. So having Vue and Rails out of the way you can focus on bringing them together. TL;DR; Learn Rails and Vue in isolation. When building sofware use this gem.
enraged_camel 9y ago
I share the author's sentiments. Vue is the first framework that actually made writing front-end code pleasant. I sometimes even find myself looking forward to it! I use it with an Elixir/Phoenix backend and the two work incredibly well together.
- whitefang 9y ago
  I too would love to try Phoenix/Elixir. How is your experience using it?
sergiotapia 9y ago
I prefer React and Mobx. 1. Prettier - I can lint it. 2. JavaScript - I can read it. 3. Onboarding - it’s easier to onboard a JavaScript developer.
- vorpalhex 9y ago
  I prefer using `ed` to write pure ASCII C, obviously writing performance sensitive parts in pure x86 asm. /s
inopinatus 9y ago
I have been progressively enhancing an older Rails+jQuery app with Vue.js components, and integration has been a breeze. Things I'll note: - Rails effectively now has two asset pipelines. Sprockets has been the off-the-shelf inclusion for some years. The Webpacker gem is making Sprockets look out-of-date and under-maintained. Adding Vue to the existing project has been trivial, using Webpacker. At some point, somethings gotta give and we choose one or the other. My money is on Webpacker. - Vue components are very readable. For a Rails-first developer looking to be productive this has been a huge win over the other "big three" comparable frameworks. - Building a real-time control panel with ActionCable and Vue was amazingly easy - there was no impedance mismatch between the client and server side - and the result is surprisingly reliable and extremely performant even for mobile clients with patchy connectivity. The hardest part was finding the right nginx+ELB configuration to handle the Websockets upgrade. - One of the first things I always seem to build is higher-level abstractions for forms, such that (for example) client- and server-side validations render with consistent L&F and without POLA violations in the UX. Vue gives some excellent primitives to assist e.g. v-model, but some kind of next-level abstraction for forms is an obvious next step for the integration. - I see the peanut gallery is sledging the "template language", not realising that one may switch template formats with ease. I've seen Vue components written in JSX, Haml, Pug et al. Obviously it's better if a team standardises, but complaining about the "template language" means you missed a full understanding of what you're looking at. - Turbolinks is, as usual, a pain in the ass. By reimplementing basic web browser functions such as navigation and page caching as a frankly premature optimisation, Turbolinks introduces numerous incompatibilities and misbehaviours. There are compatibility shims, but adding and maintaining such for every glitch your users encounter is gonna suck for everybody. Top tip, if you're using Vue with Rails, disable Turbolinks.
- whitefang 9y ago
  So true. I've felt all these pains. :) About choosing one asset pipeline, what if the Vue could be the new ERB? Here I have a question on the same. I would love to work on this. https://stackoverflow.com/questions/43084499/replacing-rails-erb-template-with-vue https://stackoverflow.com/questions/43084499/replacing-rails...
vmware513 9y ago
I just don't understand this hype around vue.js. People say, one of the best feature of vue that it is somehow opinionated, howevever it has weird templating syntax. The conclusion is simple again. There is only one framework left which is "rule them all", opinionated, super easy to use, with beautiful templating language, an fast. Fast rendering, fast for building apps, and the only with continous consistency. It is Ember.js. Obviously.
NathanCH 9y ago
// ignore this line, it just says hey Vue use the element UI This tutorial is full of hacks, confusing comments, and questionable english. Also I wonder if the author knows he or she can use multi-line HTML comments. I honestly don't see the issue with JSX when looking at "html" like this.
- whitefang 9y ago
  haha. I'm really sorry for not using the right tools. I'm also sorry for my bad English as I'm not a native English speaker. and yes, multi-line comments are there but in atom, I can just use ctrl + / to comment and uncomment, makes my life lot easier. I would say it's not huge. If you can help me by telling which comments are confusing I would love to work with you and fix that. Thanks for your constructive feedback. :)
  - NathanCH 9y ago
    > and yes, multi-line comments are there but in atom, I can just use ctrl + / to comment and uncomment, makes my life lot easier I am dying of laughter. Also, re: JSX. I was surprised now to see Vue supports JSX out of the box, so that's pretty cool.
fanpuns 9y ago
Rails API + Vue is by far the most productive stack for me. I came from a Rails background but never really liked the view layer + jquery. I tried React but it just didn't stick. When I put those together for the first time though I genuinely had fun building again.
luord 9y ago
Similar experience, except using Flask. For new projects, I have a docker-compose based template for that bootstraps postgresql, a flask app and a vue app in different containers. Aside note: Why is every article featured here about vue filled with people... talking about how they prefer using react? I don't see how it isn't annoying for everyone else and for themselves: I don't care about react and, thus, I don't read or even open links about it.

109 points by whitefang 9y ago

"Vue.js is awesome. I’m telling this after having used React for more than a year in production software". I wish the author gave some mentions as to why that's the case (and why he's even using Ruby here). I've been using React with MobX and Typescript for the past year in production and it's been treating me and my team very well. The framework feels quite invisible at this point.

yaseer 9y ago
It's probably opening a can of worms to begin the JavaScript Framework comparison in that blog post. I'd imagine it would detract from their central aim of an integration guide. I also imagine this HN thread will quickly turn into a thread dominated by framework comparisons (it's the main reason I clicked through...)
- whitefang 9y ago
  Maybe it was not right to start on that note and I should have given some background. But trust me my intentions were not bad. Here is a post I've written on my experience using React https://www.classandobjects.com/tutorial/problems_with_react_single_page_app/ https://www.classandobjects.com/tutorial/problems_with_react... I would update the article to include this.
  - heartbreak 9y ago
    I’ve been clicking through your blog for the last 20 minutes or so, and I’ve been really impressed. I’m itching to get home from work today and try out Vue with a Rails side project I’ve been working on. Thank you!
    - whitefang 9y ago
      I'm so happy. I'll keep writing. :)
vec 9y ago
I'm not the author, but that quote lines up almost exactly with our experience. First, Vue shares most of the things that actually make React exciting. Component oriented, one-way databinding, virtual DOM, a first party Flux-inspired state management plugin. We didn't feel that we lost anything moving from React to Vue, and most of our existing components were trivial to port. What we gained, on the other hand, is a whole lot of developer comfort. Vue's template syntax can be read and manipulated by people who aren't primarily Javascript developers. Directives and filters eliminate quite a bit of boilerplate. Opt-in two way binding eliminates noisy setter functions without any loss of clarity. Getters enable the use of computed values as though they were raw data. There's no single killer feature, but taken together Vue just feels much more pleasant to use than React. React has the correct fundamental abstraction, but the actual API mistakes "small" for "simple". JSX, in particular, is trivial to explain and understand in theory, but in practice is often quite verbose and complex to use, as everyone who has asked themselves "how do I actually write an if/else block" has discovered to their dismay. Vue plux Vuex keeps the same conceptual simplicity and cleanliness as React, but it pairs it with a much larger, much more opinionated API that doesn't force us to reinvent every wheel we need.
- hashkb 9y ago
  You don't mention mobx. If you haven't used it, you ought want to give it a look and reconsider your opinion
  - rpeden 9y ago
    I enjoy mobx a lot, but I don't think it really address most of the points vec raised. The way I look at it, it's not a contest. If Vue is better for some developers and some teams than React, that's great! It's nice to have multiple good tools to choose from.
  - nlperguiy 9y ago
    According to https://vuejs.org/v2/guide/comparison.html https://vuejs.org/v2/guide/comparison.html , vuejs is less verbose React + Mobx.
- 9y ago
boubiyeah 9y ago
Yeah, depends what you value. vue is "easier" with probably less boilerplate at the cost of more magic and less type safety due to magic string templates (if using typescript like I love to) Definitely not a good tradeoff for me, but it is for some.
- k__ 9y ago
  Never understood this. How is Vue easier if we only consider components? How can it offer something simpler than functions as components?
  - vec 9y ago
    Because "simple" and "easy" are not synonyms. For example, Backbone is much simpler than React. React keeps a full virtual copy of the DOM in runtime and uses complex diffing algorithms to decide when and how to actually update the DOM in a manner which is entirely opaque to the developer. Backbone just does the DOM updates you tell it to, when and how you tell it to. And since Backbone is so much simpler, it logically follows that building an application in Backbone much be much easier than building the same application in React, right? Right? In Vue, a component generally consists of a raw JS object, an (almost) HTML template, and a block of raw CSS. The framework does some opaque but straighforward work to bind these three together into a single conceptual entity. This is indeed more complex, but the added complexity follows the grain of my preexisting intuitions. The end result, in practice, is components which have a clean internal structure and much less boilerplate. Slightly more complex, but easier.
chmln 9y ago
We've used React and the ecosystem quite extensively at a company I worked at, and the main gripe we had were forms. Yes, there is redux-form but the fact that it exists seems like a drawback for React and Redux. Its APIs can be very clunky and not straightforward at all. setState(...) is not a good solution either as things can get more complicated with nested objects and such. In Vue, you don't even think about this problem. There's v-model which makes forms a breeze.
- whitefang 9y ago
  Yes, form validation is a huge mess. I would say this would be one of the major reason, I even tried Vue for the first time.
kendallpark 9y ago
> "Vue.js is awesome. I’m telling this after having used React for more than a year in production software" Had the exact same experience. After Angular 1, Ember, and React, Vue is the first JS framework that I'm actually excited to use. My three biggest gripes with React are solved with Vue 1) better out-of-the-box experience (CRA is still not ideal), 2) single file components that strike a great balance between templating, logic, and styling, 3) Vuex is a slick Flux architecture with much less boilerplate than something like Redux. Vue is opinionated enough to give you a sane structure and guidance, but not so opinionated that you feel trapped in their domain and get lost in domain-specfic magic. You might say it's the goldilocks of frameworks. Doesn't introduce any radical new ideas, but MAN does it strike the right balance.

duiker101 9y ago

Slightly off but is it just me or Ruby and Rails pretty much disappeared in a puff of smoke after being all over HN for a while?

serg_chernata 9y ago
I have to agree. I remember several years back RoR was in every third headline.
- deleted 9y ago
  [deleted]
- petepete 9y ago
  Rails has simply become dull, and that's not a bad thing. It's a solid choice for most web applications, once you know the framework it's very easy to write complex software quickly in a sensible manner.
mrtksn 9y ago
These days, everything is about JavaScript as lot's of exciting stuff keep happening in the area. What's the latest exciting thing that happened with RoR?
- hashkb 9y ago
  Some of us see stability as a positive. You don't have to make headlines every week to be reliable and useful!
  - mrtksn 9y ago
    I'm not saying that it's bad, the thing is that you don't talk too much about a mature tech with established ways of doing things.
kirillseva 9y ago
There pretty much aren't that many new problems to solve that RoR ecosystem hasn't solved already, hence hard to generate hype. RoR developers are busy building things and don't spend much time on forums anyway. And those that do, they are on forums to learn about new exciting shiny frameworks/languages, like Elixir

stevebmark 9y ago

<el-form :model="user" :rules="rules" I would still rather write lintable, composable Javascript (JSX) than an embedded mini string language in HTML attributes. This is a strange post, it's even less information than a Vue 101 post?

warent 9y ago
It is not an embedded mini string language. It is JavaScript and interpreted as such. When an attribute is prefixed with a colon (:), then those quotations are homologous to JSX curlies. Your IDE should be able to syntax highlight and even lint it.
- Kiro 9y ago
  The comment was clearly not about colons alone. I've built a large project in Vue and I absolutely hated the template language compared to JSX. It was Angular 1 all over again.
  - sillysaurus3 9y ago
    FWIW Webstorm somewhat mitigates this. I know it feels sticky to rely on IDE tooling, but it's pretty good in my experience. People have reported some issues with the Vue tooling, but it's worth trying: brew cask install webstorm cd your-app && webstorm .
aaron-lebo 9y ago
Sometimes I get the impression that Vue is the new Angular that everyone is excited about but people will be moving on from in 3 years. It's "my first framework" kind of thing, or maybe it's a well-presented and complete package, which has obvious value. It would be interesting to see an informed comparison. What's Vue doing that a million other frameworks aren't?
- kirillseva 9y ago
  To me vue is like react but with > simpler syntax. I think single-file components is a great thing when you're getting started. While true "js ninjas" will call me out on this, they're probably employed by a large org with problems that are different from mine. > less choice. I only write frontend occasionally. How would I know which react-router to choose? What's the best redux package? What about handling CSS, what's the flavor du jour? Vue says "want something done - do this. here's vue router, vuex, etc." Overall, the two are very much similar in both how they work and what they provide, but one is developed and used by an organization that has a virtually infinite supply of engineers, and the other is being developed by one guy. Technology that makes Facebook successful may be inappropriate for a successful hackathon or a small startup

wnm 9y ago

what I don't like about that setup is that views are rendered in the client, instead of on the server. I wish there was a js framework, which would let me keep renderering my views with rails on the server, but then take over and help me handle ui interactions etc..

jeffjose 9y ago
vue.js supports SSR out of the box, AFAI-can tell. Isnt that what you're asking?
- wolco 9y ago
  I think he wants a rails/vue hybrid backend. Why is another question.
whitefang 9y ago
Yes, that is what I want. Here is a question that I posted on stack overflow, which talks about replacing ERB with Vue. https://stackoverflow.com/questions/43084499/replacing-rails-erb-template-with-vue https://stackoverflow.com/questions/43084499/replacing-rails... If this interests you, I would love to work. :)

stevenwoo 9y ago

I just started learning Vue.js, do you recommending switching to this gem immediately or learning Vue.js fundamentals first then using the gem?

inopinatus 9y ago
Not the author but I recommend trying it in a simple CRUD Rails 5.1 app with the Webpacker gem version 3.0.2 or later, first running through the Vue tutorial guide in that context. Once you've got a fuller understanding of how it fits in, add webpacker to your existing app and starting building Vue components. Chris Oliver's guides on GoRails are also quite useful although they're becoming out-of-date already in some aspects.
whitefang 9y ago
If you know Rails already and you are new to Vue.js. I would say first do some small frontend app only in Vue. So that Vue is not the problem. So having Vue and Rails out of the way you can focus on bringing them together. TL;DR; Learn Rails and Vue in isolation. When building sofware use this gem.

enraged_camel 9y ago

I share the author's sentiments. Vue is the first framework that actually made writing front-end code pleasant. I sometimes even find myself looking forward to it! I use it with an Elixir/Phoenix backend and the two work incredibly well together.

whitefang 9y ago
I too would love to try Phoenix/Elixir. How is your experience using it?

sergiotapia 9y ago

I prefer React and Mobx. 1. Prettier - I can lint it. 2. JavaScript - I can read it. 3. Onboarding - it’s easier to onboard a JavaScript developer.

vorpalhex 9y ago
I prefer using `ed` to write pure ASCII C, obviously writing performance sensitive parts in pure x86 asm. /s

inopinatus 9y ago

I have been progressively enhancing an older Rails+jQuery app with Vue.js components, and integration has been a breeze. Things I'll note: - Rails effectively now has two asset pipelines. Sprockets has been the off-the-shelf inclusion for some years. The Webpacker gem is making Sprockets look out-of-date and under-maintained. Adding Vue to the existing project has been trivial, using Webpacker. At some point, somethings gotta give and we choose one or the other. My money is on Webpacker. - Vue components are very readable. For a Rails-first developer looking to be productive this has been a huge win over the other "big three" comparable frameworks. - Building a real-time control panel with ActionCable and Vue was amazingly easy - there was no impedance mismatch between the client and server side - and the result is surprisingly reliable and extremely performant even for mobile clients with patchy connectivity. The hardest part was finding the right nginx+ELB configuration to handle the Websockets upgrade. - One of the first things I always seem to build is higher-level abstractions for forms, such that (for example) client- and server-side validations render with consistent L&F and without POLA violations in the UX. Vue gives some excellent primitives to assist e.g. v-model, but some kind of next-level abstraction for forms is an obvious next step for the integration. - I see the peanut gallery is sledging the "template language", not realising that one may switch template formats with ease. I've seen Vue components written in JSX, Haml, Pug et al. Obviously it's better if a team standardises, but complaining about the "template language" means you missed a full understanding of what you're looking at. - Turbolinks is, as usual, a pain in the ass. By reimplementing basic web browser functions such as navigation and page caching as a frankly premature optimisation, Turbolinks introduces numerous incompatibilities and misbehaviours. There are compatibility shims, but adding and maintaining such for every glitch your users encounter is gonna suck for everybody. Top tip, if you're using Vue with Rails, disable Turbolinks.

whitefang 9y ago
So true. I've felt all these pains. :) About choosing one asset pipeline, what if the Vue could be the new ERB? Here I have a question on the same. I would love to work on this. https://stackoverflow.com/questions/43084499/replacing-rails-erb-template-with-vue https://stackoverflow.com/questions/43084499/replacing-rails...

vmware513 9y ago

I just don't understand this hype around vue.js. People say, one of the best feature of vue that it is somehow opinionated, howevever it has weird templating syntax. The conclusion is simple again. There is only one framework left which is "rule them all", opinionated, super easy to use, with beautiful templating language, an fast. Fast rendering, fast for building apps, and the only with continous consistency. It is Ember.js. Obviously.

NathanCH 9y ago

// ignore this line, it just says hey Vue use the element UI This tutorial is full of hacks, confusing comments, and questionable english. Also I wonder if the author knows he or she can use multi-line HTML comments. I honestly don't see the issue with JSX when looking at "html" like this.

whitefang 9y ago
haha. I'm really sorry for not using the right tools. I'm also sorry for my bad English as I'm not a native English speaker. and yes, multi-line comments are there but in atom, I can just use ctrl + / to comment and uncomment, makes my life lot easier. I would say it's not huge. If you can help me by telling which comments are confusing I would love to work with you and fix that. Thanks for your constructive feedback. :)
- NathanCH 9y ago
  > and yes, multi-line comments are there but in atom, I can just use ctrl + / to comment and uncomment, makes my life lot easier I am dying of laughter. Also, re: JSX. I was surprised now to see Vue supports JSX out of the box, so that's pretty cool.

fanpuns 9y ago

Rails API + Vue is by far the most productive stack for me. I came from a Rails background but never really liked the view layer + jquery. I tried React but it just didn't stick. When I put those together for the first time though I genuinely had fun building again.

luord 9y ago

Similar experience, except using Flask. For new projects, I have a docker-compose based template for that bootstraps postgresql, a flask app and a vue app in different containers. Aside note: Why is every article featured here about vue filled with people... talking about how they prefer using react? I don't see how it isn't annoying for everyone else and for themselves: I don't care about react and, thus, I don't read or even open links about it.