4 ms·

Just out of curiosity, what are your thoughts on Vue? I've heard a lot of good things about it.

ipsum2 8y ago
I dislike the templating language, preferring jsx which is mostly standard js syntax, e.g.: Vue: <li v-for="i in items">{{i}}</li> React: items.map((i) => <li>{i}</li>)
- bartaxyz 8y ago
  Just to make things clear. You can use JSX with Vue as well. It's even a recognized way to write code in the official documentation (https://vuejs.org/v2/guide/render-function.html#JSX https://vuejs.org/v2/guide/render-function.html#JSX). JSX is just a language that can be interpreted into code for React & Vue.
  - Can_Not 8y ago
    Not to mention that you can use Jade/pug, also.
- Jare 8y ago
  IIRC you can use JSX with Vue via a Babel plugin [1]. I can't vouch for it personally but it should be pretty easy to use. [1] https://github.com/vuejs/babel-plugin-transform-vue-jsx#usage https://github.com/vuejs/babel-plugin-transform-vue-jsx#usag...
- alayek 8y ago
  I learned this the hard way, coming from React to Vue land; that v-for on an element would also repeat the element itself. With React, it was pretty clear which element / component would repeat.
- Bizarro 8y ago
  "Stringy code" is an issue, but it's more declarative and readable than JSX map.
- kyriakos 8y ago
  exactly that. I prefer using javascript than inventing a template DSL
petepete 8y ago
I love Vue, so much of what it does just feels right. My one complaint is that Vue components place templating, code and styles in a single file and I'd prefer a directory with three (or more) separate files.
- moltar 8y ago
  I don’t think it’s a requirement. You can use Vue simply by including it from CDN and just sprinkle some functionality on a page.
- JimDabell 8y ago
  > My one complaint is that Vue components place templating, code and styles in a single file and I'd prefer a directory with three (or more) separate files. You can have that. You do need an index.vue file containing something like: <template src="my-component.html" /> <script src="my-component.js" /> <style scoped lang="scss" src="my-component.scss" /> If you put that into a directory called my-component/ then you can just do: import MyComponent from 'my-component' …and it will pull everything in.
alayek 8y ago
Have been developing with React for last 3 years, and recently started building with Vue JS. React's core philosophy is JS everywhere - there's no template, no HTML, no CSS; only JS. As much as possible, write JS, and if you can, pure JS. It has its benefits - you can have code formatter to format your JSX, unit test any part of your code, or write integration tests with mount, or write snapshot tests. Extremely easy and natural to compose various components - because it's a function calling another function. Vue is magic, and its own DSL rules will get in your way. For instance, inside the Vue templates you cannot use `this`. However, inside your methods and computed, you have to. Coming from Angular 1, Vue JS would look feel like a breeze. Never could make ESLint work on my Vue files, tried all plugins. Some parts of the code it lints, and some parts of the code it doesn't. Inside your template, Vue.config can be undefined; so you've to assign it to something in mounted(), and then get it to work. Vue artisans tell me Vue supports "this" or "that". I don't want something that supports A or B - I want something where A and B are inherently supported from the ground up. It's not all bad. VueX is pretty cool, kinda like Redux without the drama. And I cannot stress this enough - it's insanely easy to go through a Vue codebase and pick up the business logic of your app. It still takes me some time to get used to a new React codebase. Overall, I felt Vue is really good to build MVP and get your product off the ground, but it starts to show why you need React's discipline in your codebase with growing requests from users to add new features and support more platforms. Then again, I'm new to Vue JS; so ask me again in a year. Am keeping an open mind.
- Can_Not 8y ago
  > Vue is magic, and its own DSL rules will get in your way. For instance, inside the Vue templates you cannot use `this`. However, inside your methods and computed, you have to. Except everyone seems to complain that "this" exists at all, but then it's confusing that "this" is implicit inside an objects own template? The DSL is awesome, and what makes it even more awesome is that it's optional. Your options are HTML, Jade/Pug, JSX, and a literal vanilla function. After the compile process, the template ends up as a render function. > Never could make ESLint work on my Vue files, tried all plugins. Some parts of the code it lints, and some parts of the code it doesn't. I can't say for sure this was true a year or more ago (especially in that short time you couldn't tell which libraries supported Vue 1 or 2 or both), but today and for as long as I've remembered eslint has been working in my Vue component files and inside sublime linter. My biggest complaint is that I want reasonML.
Bizarro 8y ago
We're just finishing up porting our app from React to Vue and we're very happy with the results. I don't really understand's the author's point about GraphQL and Axios. But React Router, Redux and its ecosystem of supporting libraries are issues in React development Having state management (axios), a built-in router, "the" styling solution built into Vue is a big win for us. Single File Components (SFC) are a joy to work with. I actually like JSX (which you can use in Vue too), and was worried about "stringy code" ala directives, but in practice it hasn't been a big deal. We also switched from Typescript to plain ES6 which is a big win in simplifying our code. I'm actually a big fan of static typing, but at the end of the day Typescript's complicated type system, typing file incompatibilities, and general fiddling around with types wasn't worth it for us. Redux was just a nightmare for us to work with. A library on top of Redux like DVA https://github.com/dvajs/dva https://github.com/dvajs/dva would've helped, but there's a very small community there. We went to Mobx State Tree for a while, but there were a bunch of issues there too. I'm keeping an eye on Blazor for some administrative apps in the future, but for now we're very happy with Vue.
- balfirevic 8y ago
  > Having state management (axios) Axios is a http client library, not state management library, you're thinking of Vuex. That being said, I don't know why the author associates Axios with React ecosystem, it's just a library you can use with any of the client frameworks.
  - Bizarro 8y ago
    Right, I got my "library with x in the name" screwed up. I've found vuex much more pleasant to work with than straight redux. I wish Facebook would just come out with an "official stack" already and put something on top of plain Redux to make it more programmer ergonomic.
mamcx 8y ago
For me, vue is more natural, as is easier to use html/css as "normal" and just spice things up with vue. And it let me use LESS javascript. Less javascript is always good.

I dislike the templating language, preferring jsx which is mostly standard js syntax, e.g.: Vue: <li v-for="i in items">{{i}}</li> React: items.map((i) => <li>{i}</li>)

bartaxyz 8y ago
Just to make things clear. You can use JSX with Vue as well. It's even a recognized way to write code in the official documentation (https://vuejs.org/v2/guide/render-function.html#JSX https://vuejs.org/v2/guide/render-function.html#JSX). JSX is just a language that can be interpreted into code for React & Vue.
- Can_Not 8y ago
  Not to mention that you can use Jade/pug, also.
Jare 8y ago
IIRC you can use JSX with Vue via a Babel plugin [1]. I can't vouch for it personally but it should be pretty easy to use. [1] https://github.com/vuejs/babel-plugin-transform-vue-jsx#usage https://github.com/vuejs/babel-plugin-transform-vue-jsx#usag...
alayek 8y ago
I learned this the hard way, coming from React to Vue land; that v-for on an element would also repeat the element itself. With React, it was pretty clear which element / component would repeat.
Bizarro 8y ago
"Stringy code" is an issue, but it's more declarative and readable than JSX map.
kyriakos 8y ago
exactly that. I prefer using javascript than inventing a template DSL

petepete 8y ago

I love Vue, so much of what it does just feels right. My one complaint is that Vue components place templating, code and styles in a single file and I'd prefer a directory with three (or more) separate files.

moltar 8y ago
I don’t think it’s a requirement. You can use Vue simply by including it from CDN and just sprinkle some functionality on a page.
JimDabell 8y ago
> My one complaint is that Vue components place templating, code and styles in a single file and I'd prefer a directory with three (or more) separate files. You can have that. You do need an index.vue file containing something like: <template src="my-component.html" /> <script src="my-component.js" /> <style scoped lang="scss" src="my-component.scss" /> If you put that into a directory called my-component/ then you can just do: import MyComponent from 'my-component' …and it will pull everything in.

alayek 8y ago

Have been developing with React for last 3 years, and recently started building with Vue JS. React's core philosophy is JS everywhere - there's no template, no HTML, no CSS; only JS. As much as possible, write JS, and if you can, pure JS. It has its benefits - you can have code formatter to format your JSX, unit test any part of your code, or write integration tests with mount, or write snapshot tests. Extremely easy and natural to compose various components - because it's a function calling another function. Vue is magic, and its own DSL rules will get in your way. For instance, inside the Vue templates you cannot use `this`. However, inside your methods and computed, you have to. Coming from Angular 1, Vue JS would look feel like a breeze. Never could make ESLint work on my Vue files, tried all plugins. Some parts of the code it lints, and some parts of the code it doesn't. Inside your template, Vue.config can be undefined; so you've to assign it to something in mounted(), and then get it to work. Vue artisans tell me Vue supports "this" or "that". I don't want something that supports A or B - I want something where A and B are inherently supported from the ground up. It's not all bad. VueX is pretty cool, kinda like Redux without the drama. And I cannot stress this enough - it's insanely easy to go through a Vue codebase and pick up the business logic of your app. It still takes me some time to get used to a new React codebase. Overall, I felt Vue is really good to build MVP and get your product off the ground, but it starts to show why you need React's discipline in your codebase with growing requests from users to add new features and support more platforms. Then again, I'm new to Vue JS; so ask me again in a year. Am keeping an open mind.

Can_Not 8y ago
> Vue is magic, and its own DSL rules will get in your way. For instance, inside the Vue templates you cannot use `this`. However, inside your methods and computed, you have to. Except everyone seems to complain that "this" exists at all, but then it's confusing that "this" is implicit inside an objects own template? The DSL is awesome, and what makes it even more awesome is that it's optional. Your options are HTML, Jade/Pug, JSX, and a literal vanilla function. After the compile process, the template ends up as a render function. > Never could make ESLint work on my Vue files, tried all plugins. Some parts of the code it lints, and some parts of the code it doesn't. I can't say for sure this was true a year or more ago (especially in that short time you couldn't tell which libraries supported Vue 1 or 2 or both), but today and for as long as I've remembered eslint has been working in my Vue component files and inside sublime linter. My biggest complaint is that I want reasonML.

Bizarro 8y ago

We're just finishing up porting our app from React to Vue and we're very happy with the results. I don't really understand's the author's point about GraphQL and Axios. But React Router, Redux and its ecosystem of supporting libraries are issues in React development Having state management (axios), a built-in router, "the" styling solution built into Vue is a big win for us. Single File Components (SFC) are a joy to work with. I actually like JSX (which you can use in Vue too), and was worried about "stringy code" ala directives, but in practice it hasn't been a big deal. We also switched from Typescript to plain ES6 which is a big win in simplifying our code. I'm actually a big fan of static typing, but at the end of the day Typescript's complicated type system, typing file incompatibilities, and general fiddling around with types wasn't worth it for us. Redux was just a nightmare for us to work with. A library on top of Redux like DVA https://github.com/dvajs/dva https://github.com/dvajs/dva would've helped, but there's a very small community there. We went to Mobx State Tree for a while, but there were a bunch of issues there too. I'm keeping an eye on Blazor for some administrative apps in the future, but for now we're very happy with Vue.

balfirevic 8y ago
> Having state management (axios) Axios is a http client library, not state management library, you're thinking of Vuex. That being said, I don't know why the author associates Axios with React ecosystem, it's just a library you can use with any of the client frameworks.
- Bizarro 8y ago
  Right, I got my "library with x in the name" screwed up. I've found vuex much more pleasant to work with than straight redux. I wish Facebook would just come out with an "official stack" already and put something on top of plain Redux to make it more programmer ergonomic.

mamcx 8y ago

For me, vue is more natural, as is easier to use html/css as "normal" and just spice things up with vue. And it let me use LESS javascript. Less javascript is always good.