4 ms·

I'm mostly a backend dev, but I have sort of an app idea that I'd like to work on the side. It would be a website on top of Firebase. I was looking at Vue the

by htamas 7y ago

I'm mostly a backend dev, but I have sort of an app idea that I'd like to work on the side. It would be a website on top of Firebase. I was looking at Vue the other day but it seem to have the same issue for me as the other major frameworks: they need a lot of ceremony to start working with it and has a quite steep learning curve at the beginning. Since I don't plan to scale my app to a global level, can anyone recommend Vue to pick up or should I look elsewhere?

makotech222 7y ago
Vue is super light-weight. You can drop the Vue.Js file on the page, put up a simple viewmodel, and you're done. No need for complicated Webpack-esque build systems (unless you want Single-File-Component Vue).
amiga-workbench 7y ago
You don't have to go all in on the insane build toolchain/component template memes. Vue can be used standalone just like Angular 1.
lichtenberger 7y ago
I think it's doable (I'm also a backend dev and started a frontend a few days ago). But I guess it would be great if you also get some help to begin. However, maybe we should use https://www.npmjs.com/package/@vue/composition-api https://www.npmjs.com/package/@vue/composition-api instead of giving Vue.js 3 a try if some things are simply not implemented as of now.
cubedrone 7y ago
I have used Vue to simplify some enterprise pages of unholy jquery. Vue is added as a single js file in the header, and I call 'new Vue' on a div element. I do not get .vue files, i can't use fancy vue compenents i see online, and a few other things, but it worked really well for my use case. I used vue to replace ~400 lines of jquery with 80 lines of very clean code. Use what you need, and leave the rest.
- james_s_tayler 7y ago
  Even doing it that way you still can use the fancy components you see online.
- speedplane 7y ago
  > I used vue to replace ~400 lines of jquery with 80 lines of very clean code. Use what you need, and leave the rest. I tried using Vue, and started by trying to replace a small 100 line Jquery component and it quickly turned into 300 lines of Vue code. Like eating broccoli, I know that using Vue over Jquery is good for you, but it's still hard to swallow that first bite.
codegeek 7y ago
I highly recommend vue. Bare minimum is to stick the js file in your html and you can start writing vue code. You technically don't need the whole node/npm ecosystem. In fact, even for more advanced Single File Components in vue (.vue files), I found this excellent library that does not require npm/node stuff : https://github.com/FranckFreiburger/http-vue-loader https://github.com/FranckFreiburger/http-vue-loader
dhritzkiv 7y ago
- @vue/cli to set up your project and make development a breeze. The only add-on you probably need during set-up is vue-router. - SFC (single file components) are your friend - Skip vuex until you need it Everything else (what makes up a component: props, data, getters; v-if, @click, etc.) should probably take a day to get familiar with.
wkrp 7y ago
I'm also a mostly backend dev (C#) and Vue didn't take too long to get started. Outside of getting node/yarn set up on my machine, I was able to create a project and start fiddling with Vue pretty quickly. I found https://www.taniarascia.com/getting-started-with-vue/ https://www.taniarascia.com/getting-started-with-vue/ as a better initial starting point compared to the Vue website. I've been using Vue for the past few weeks on a for-fun project and have been loving it once I grasped the basic concepts.
- fjp 7y ago
  I need to check this out, I've had such trouble making the jump from the official tutorial.
ghego1 7y ago
Disclaimer: these are highly debated things and there's no definitive answer except "what works best for you". So I'll just tell you what worked best for me. If you know typescript I'd recommend angular (v. 7 or up). It's most likely the one with the steepest learning curve, but at the same time it offers an out-of-the-box solution, with a very complete CLI, so you can actually start right away with a full front end app that has everything you need. You can bother understanding the underlying layers well past you release your app. To accomplish the same with react and Vue you need to add libs or frameworks, so you need to be more aware of all the tech involved. So in the end there's a learning curve here as well. Another good reason to pick angular IMHO is that you actually can ignore it. This is rarely discussed. You can basically write your app as you would do in nodejs (with TS of course) and rely on angular only for the UI. I import my non angular code in the components TS files and handle the logic of the app without nearly any angular service. The only angular services I use are those for routing and state management (redux), and to use them in non angular code (e.g. Classes) I refer the object of the service on a property of a custom constant object, and thanks to the fact that JS references objects, I simply import in my classes my custom constant. Like import { stateData } from ... ... stateData.redux = this.redux ... Somewhere else: stateData.redux.store ...
- tashoecraft 7y ago
  Agree with above, Angular even published a way to deploy your app to firebase just by typing a simple cli command.
- jgalentine007 7y ago
  I learned Vue first because I didn't want to have to learn a reactive framework and Typescript at the same time. I've made several 'complete' apps with Vue / ES6 and .Net Core. For a new job possibility I have now been learning Angular and Typescript and I am really liking how much Typescript simplifies the boilerplate of components etc. My angular components are much more readable than my deeply nested Vue components. There are some class component plugins for Vue 2.x but it seems that this is being dropped now for 3.x in favor of composition functions. Looking at code samples it seems to mix the worst of both worlds to me. I'm liking how much less cognitive load I've had with just going the 'angular way' whereas with Vue I had to make a lot of decisions for your basic needs (HTTP data access, form validation etc.)
joebubna 7y ago
Yeah, I'd recommend it. Although you CAN do all the ceremony you referred to and setup a complicated build environment, etc... Vue doesn't require it and can be used fairly effectively using a simple setup. I made a little jsFiddle for you to demonstrate. This is just including the Vue.js library on the page and using it to do stuff. No build environment or anything. https://jsfiddle.net/mjbvn0ts/4/ https://jsfiddle.net/mjbvn0ts/4/
- koboll 7y ago
  Yeah the nice thing about Vue is you can basically add it to existing HTML and import it via CDN, you can skip the build step entirely. This makes it really easy to get started. If you're not planning on building a large app, I'd say it's a better choice than React for that alone. React excels at scale versus its rivals, but Vue is much easier to jump into and be immediately productive with.
biktor_gj 7y ago
I'm a sysadmin with a mixed knowledge in C, PHP and Javascript my first time both with Vue and the whole webpack & npm world went like this: Day 1 I didn't understand anything Day 6 I started getting confortable with the stack Day 30 had working prototypes for a multilanguage site One year later I have made three websites with about 1K visitors a month, and two vue-electron 'apps', one of them being a Digital Signage client for large videowalls at work. It is strange in the beginning, but if you have programmed before, it gets easier as you work with it quite fast
mthoms 7y ago
As a fellow backend developer, I found Vue to be the absolute perfect entry-point to the world of frontend frameworks. If you set up your project with Vue CLI v3 then it automates all the setup and even offers a web interface called "Vue UI" for managing your app, it's plugins, and NPM packages. It's a dream. Suddenly, I don't hate JavaScript anymore.
fjp 7y ago
My issue has been going from the tiny little examples in the official tutorial to a medium-size app, I always get hung up on how to structure my files and code what belongs where yadda yadda.
- ratww 7y ago
  The most common way I see on the wild is by separating in categories: - package.json - src |- main.js |- components |- pages \- widgets |- directives |- helpers |- mixins |- router \- store This works for both small projects (but you might not have directives/mixins/router/store) and larger projects (but you might have to add more subfolders inside components/pages because you will start breaking down components).
turtlebits 7y ago
Svelte is a better choice IMHO. There is little to no ceremony or learning to get started (and you don't need a ton of files). I could never get into React or Vue (the "right" way) because of this.
- taftster 7y ago
  Right. I tried to like Vue, but learned about Svelte around the same time. The idea that it compiles the javascript application resonates with me. I'm not up enough on the differences/advantages with the approach that Svelte takes. But as a backend developer myself, this seems more intuitive and probably has some advantages in terms of performance.
  - shdh 7y ago
    I just wish there was TypeScript support.
jacurtis 7y ago
Of all the three major frontend frameworks, Vue has the easiest and quickest setup time. On the simple end you can pull the framework from NPM or a CDN and insert it into your HTML. Then insert a script tag with your data and methods to use for Vue. That is really it. 2-way databinding is as simple as adding a `v-model` to your html tags like your inputs. Of all three, you will find Vue has the least amount of "ceremony" to get started. Of course as you get into advanced projects you probably want to start working with something like Nuxt.js (for Vue) or Next.js (for React). These have a lot more setup and learning. But on a simple level Vue is pretty dead-simple to use. Far easier to use than React in my opinion.
- thelittleone 7y ago
  Have you tried Gridsome? I found it more intuitive than Nuxt and it produces much faster sites out of the box.
geddy 7y ago
Just throwing my $0.02 into the ring - Vue struck me as incredibly easy to use. That was after learning AngularJS and some basic React stuff, and none of it felt natural or made sense. Something about Vue is just.. simple. I picked up on it lightning quick and it reignited a fire I'd lost for development. I even did a bunch of side projects because of _just how quickly_ you can crank out code. React I was writing all sorts of bogus looking JSX and it made me want to throw myself off a cliff, AngularJS was so.. verbose.. (granted it's very outdated by today's standards and of course modern Angular), but Vue actually made me spend my free time writing code again. It really is excellent - download vue-cli and give it a shot. The HelloWorld app it'll generate is crazy simple, you literally need to mess with like 2 files right off the bat, and both are super self-explanatory. And single-file components are crazy convenient and powerful.

by htamas 7y ago

makotech222 7y ago

Vue is super light-weight. You can drop the Vue.Js file on the page, put up a simple viewmodel, and you're done. No need for complicated Webpack-esque build systems (unless you want Single-File-Component Vue).

amiga-workbench 7y ago

You don't have to go all in on the insane build toolchain/component template memes. Vue can be used standalone just like Angular 1.

lichtenberger 7y ago

I think it's doable (I'm also a backend dev and started a frontend a few days ago). But I guess it would be great if you also get some help to begin. However, maybe we should use https://www.npmjs.com/package/@vue/composition-api https://www.npmjs.com/package/@vue/composition-api instead of giving Vue.js 3 a try if some things are simply not implemented as of now.

cubedrone 7y ago

I have used Vue to simplify some enterprise pages of unholy jquery. Vue is added as a single js file in the header, and I call 'new Vue' on a div element. I do not get .vue files, i can't use fancy vue compenents i see online, and a few other things, but it worked really well for my use case. I used vue to replace ~400 lines of jquery with 80 lines of very clean code. Use what you need, and leave the rest.

james_s_tayler 7y ago
Even doing it that way you still can use the fancy components you see online.
speedplane 7y ago
> I used vue to replace ~400 lines of jquery with 80 lines of very clean code. Use what you need, and leave the rest. I tried using Vue, and started by trying to replace a small 100 line Jquery component and it quickly turned into 300 lines of Vue code. Like eating broccoli, I know that using Vue over Jquery is good for you, but it's still hard to swallow that first bite.

codegeek 7y ago

I highly recommend vue. Bare minimum is to stick the js file in your html and you can start writing vue code. You technically don't need the whole node/npm ecosystem. In fact, even for more advanced Single File Components in vue (.vue files), I found this excellent library that does not require npm/node stuff : https://github.com/FranckFreiburger/http-vue-loader https://github.com/FranckFreiburger/http-vue-loader

dhritzkiv 7y ago

- @vue/cli to set up your project and make development a breeze. The only add-on you probably need during set-up is vue-router. - SFC (single file components) are your friend - Skip vuex until you need it Everything else (what makes up a component: props, data, getters; v-if, @click, etc.) should probably take a day to get familiar with.

wkrp 7y ago

I'm also a mostly backend dev (C#) and Vue didn't take too long to get started. Outside of getting node/yarn set up on my machine, I was able to create a project and start fiddling with Vue pretty quickly. I found https://www.taniarascia.com/getting-started-with-vue/ https://www.taniarascia.com/getting-started-with-vue/ as a better initial starting point compared to the Vue website. I've been using Vue for the past few weeks on a for-fun project and have been loving it once I grasped the basic concepts.

fjp 7y ago
I need to check this out, I've had such trouble making the jump from the official tutorial.

ghego1 7y ago

Disclaimer: these are highly debated things and there's no definitive answer except "what works best for you". So I'll just tell you what worked best for me. If you know typescript I'd recommend angular (v. 7 or up). It's most likely the one with the steepest learning curve, but at the same time it offers an out-of-the-box solution, with a very complete CLI, so you can actually start right away with a full front end app that has everything you need. You can bother understanding the underlying layers well past you release your app. To accomplish the same with react and Vue you need to add libs or frameworks, so you need to be more aware of all the tech involved. So in the end there's a learning curve here as well. Another good reason to pick angular IMHO is that you actually can ignore it. This is rarely discussed. You can basically write your app as you would do in nodejs (with TS of course) and rely on angular only for the UI. I import my non angular code in the components TS files and handle the logic of the app without nearly any angular service. The only angular services I use are those for routing and state management (redux), and to use them in non angular code (e.g. Classes) I refer the object of the service on a property of a custom constant object, and thanks to the fact that JS references objects, I simply import in my classes my custom constant. Like import { stateData } from ... ... stateData.redux = this.redux ... Somewhere else: stateData.redux.store ...

tashoecraft 7y ago
Agree with above, Angular even published a way to deploy your app to firebase just by typing a simple cli command.
jgalentine007 7y ago
I learned Vue first because I didn't want to have to learn a reactive framework and Typescript at the same time. I've made several 'complete' apps with Vue / ES6 and .Net Core. For a new job possibility I have now been learning Angular and Typescript and I am really liking how much Typescript simplifies the boilerplate of components etc. My angular components are much more readable than my deeply nested Vue components. There are some class component plugins for Vue 2.x but it seems that this is being dropped now for 3.x in favor of composition functions. Looking at code samples it seems to mix the worst of both worlds to me. I'm liking how much less cognitive load I've had with just going the 'angular way' whereas with Vue I had to make a lot of decisions for your basic needs (HTTP data access, form validation etc.)

joebubna 7y ago

Yeah, I'd recommend it. Although you CAN do all the ceremony you referred to and setup a complicated build environment, etc... Vue doesn't require it and can be used fairly effectively using a simple setup. I made a little jsFiddle for you to demonstrate. This is just including the Vue.js library on the page and using it to do stuff. No build environment or anything. https://jsfiddle.net/mjbvn0ts/4/ https://jsfiddle.net/mjbvn0ts/4/

koboll 7y ago
Yeah the nice thing about Vue is you can basically add it to existing HTML and import it via CDN, you can skip the build step entirely. This makes it really easy to get started. If you're not planning on building a large app, I'd say it's a better choice than React for that alone. React excels at scale versus its rivals, but Vue is much easier to jump into and be immediately productive with.

biktor_gj 7y ago

I'm a sysadmin with a mixed knowledge in C, PHP and Javascript my first time both with Vue and the whole webpack & npm world went like this: Day 1 I didn't understand anything Day 6 I started getting confortable with the stack Day 30 had working prototypes for a multilanguage site One year later I have made three websites with about 1K visitors a month, and two vue-electron 'apps', one of them being a Digital Signage client for large videowalls at work. It is strange in the beginning, but if you have programmed before, it gets easier as you work with it quite fast

mthoms 7y ago

As a fellow backend developer, I found Vue to be the absolute perfect entry-point to the world of frontend frameworks. If you set up your project with Vue CLI v3 then it automates all the setup and even offers a web interface called "Vue UI" for managing your app, it's plugins, and NPM packages. It's a dream. Suddenly, I don't hate JavaScript anymore.

fjp 7y ago

My issue has been going from the tiny little examples in the official tutorial to a medium-size app, I always get hung up on how to structure my files and code what belongs where yadda yadda.

ratww 7y ago
The most common way I see on the wild is by separating in categories: - package.json - src |- main.js |- components |- pages \- widgets |- directives |- helpers |- mixins |- router \- store This works for both small projects (but you might not have directives/mixins/router/store) and larger projects (but you might have to add more subfolders inside components/pages because you will start breaking down components).

turtlebits 7y ago

Svelte is a better choice IMHO. There is little to no ceremony or learning to get started (and you don't need a ton of files). I could never get into React or Vue (the "right" way) because of this.

taftster 7y ago
Right. I tried to like Vue, but learned about Svelte around the same time. The idea that it compiles the javascript application resonates with me. I'm not up enough on the differences/advantages with the approach that Svelte takes. But as a backend developer myself, this seems more intuitive and probably has some advantages in terms of performance.
- shdh 7y ago
  I just wish there was TypeScript support.

jacurtis 7y ago

Of all the three major frontend frameworks, Vue has the easiest and quickest setup time. On the simple end you can pull the framework from NPM or a CDN and insert it into your HTML. Then insert a script tag with your data and methods to use for Vue. That is really it. 2-way databinding is as simple as adding a `v-model` to your html tags like your inputs. Of all three, you will find Vue has the least amount of "ceremony" to get started. Of course as you get into advanced projects you probably want to start working with something like Nuxt.js (for Vue) or Next.js (for React). These have a lot more setup and learning. But on a simple level Vue is pretty dead-simple to use. Far easier to use than React in my opinion.

thelittleone 7y ago
Have you tried Gridsome? I found it more intuitive than Nuxt and it produces much faster sites out of the box.

geddy 7y ago

Just throwing my $0.02 into the ring - Vue struck me as incredibly easy to use. That was after learning AngularJS and some basic React stuff, and none of it felt natural or made sense. Something about Vue is just.. simple. I picked up on it lightning quick and it reignited a fire I'd lost for development. I even did a bunch of side projects because of _just how quickly_ you can crank out code. React I was writing all sorts of bogus looking JSX and it made me want to throw myself off a cliff, AngularJS was so.. verbose.. (granted it's very outdated by today's standards and of course modern Angular), but Vue actually made me spend my free time writing code again. It really is excellent - download vue-cli and give it a shot. The HelloWorld app it'll generate is crazy simple, you literally need to mess with like 2 files right off the bat, and both are super self-explanatory. And single-file components are crazy convenient and powerful.