Hacker News Reader

Comment by brobdingnagians | Hacker News Reader

I love Vue.js. I've never really caught onto the JSX stuff. If you have ".Vue" files then you get nice separation of the template html, methods, and the scoped styling. The Javascript syntax is pretty straightforward, and the templates just add nice directives like v-if, v-for, etc. I think it look pretty clean and is fairly easy for JS developers to pick up. Integration into a project is pretty straightforward as well. We have a webpack installation that pulls in the Vue files and bundles everything and it is quite clean.

View on HN

I've never understood how people view the separation of template, styles, and business logic into separate files as simpler. Now, to work on a single component, I need to open three files in my editor, instead of one.

It is an over reaction to bad PHP.

Bad PHP pages mixes all kinds of shit together. This leads to the thought that to do it 'good' everything needs to be seperated.

It's a wrong thought but I see how people got there.

The "separate files" argument is a red herring. It is really about separate "mindsets" or "modes of thinking".

In effect, JavaScript logic tends to be procedural/imperative, while templates allow declarative semantics, and styles are nearly a 2.5D constraint language. "Separation of concerns" here means only having to think in a particular mode, rather than blending all of those modes of thought into a single eyespan.

Notably, Vue allows for single-file components, while preserving the familiar and intentionally designed separation of declarative (HTML), imperative (JavaScript), and aesthetic (CSS) code.

I don't see how separate files forces you to think differently. It might aid in that effort, but it likely doesn't force it.

In vue (or atleast the way the majority of people use vue), each component is separated into a .vue file. That component's template, style and business logic is all encapsulated in that one file. A basic .vue file starts out with <template></template><style></style><script></script>. It keeps everything nice and simple, in my opinion. Each different "mode of thinking" is separated out, but still all together in one file.

Vue's 'separation' is a myth.

I don't know why people keep believing that separating templates and js is a good thig. Pete Hunt addressed this in the React into videos he did -

you want 'separation of concerns', not 'separation of technologies'.

React does the former. Vue/any other templating engine does the latter.

Reply on news.ycombinator.com