7 ms·
As someone who more or less recently did this, I can tell you about my journey. I went from fulldev LAMP stack (with some JQuery) to Vue ... which immediately g
by lubujackson 7y ago
As someone who more or less recently did this, I can tell you about my journey. I went from fulldev LAMP stack (with some JQuery) to Vue ... which immediately got me embroiled webpack config files, linters, Babel, ES5+ES6 syntax and all the rest. Vue is great and pretty quick to pick up the basics, but as soon as you try to veer off the tutorial train you start finding unhelpful code examples that require a bevy of alternative things to learn and the stack keeps getting bigger and wider in every direction. As someone who started learning webdev in the Perl days when you couldn't just Google answers, this was the worst part of picking up new things - there is no "one path" to do anything, everyone uses a slightly different stack and all these tools are intertwined in a way that makes progress very tedious without direct guidance.
For example, I learned the basics of Vue then tried to hack something together. But all the example code I found was using single file components (SFC) which is an alternative file structure for Vue that I had to learn first in order to make sense of the code samples. Then I needed to setup Webpack for some reason or another and Babel just seemed useful, so I spent a while in config hell learning all about those. In order to keep things simple I tried to avoid learning Vuex and Vue Router but I kept finding sample code that used both to the point I ended up learning them in order to unroll code samples, then I learned about event busses as an in-between solution to passing data around - at which point I decided I might as well just use Vuex after all. But it was frustrating to have to learn a big stack of things from a side channel to really understand code I was reading... I dare you to find a Vue tutorial/sample beyond a basic introduction that doesn't use some combination of those things.
That being said, I ended up going a step further and now I'm using the Quasar Framework. Quasar is like a wrapper around Vue that lets me avoid fussing with Webpack/Babel/Linters/SASS/hot reloading configs and I would have probably been better off doing a basic Vue tutorial then going right to Quasar. It also simplifies the frontend with integrated material design and that has always been the tedious side of doing full stack stuff for me, especially when fussing around with early stage ideas.
So, finally, getting to the plusses: Hot reloading lets me edit/upload a file and have the webpage change beneath me without even refreshing, that's pretty cool. Frontend work is much, much better and simplified. I rarely have to fuss with positioning CSS nightmares or worry about different screen sizes or browser differences because that is all abstracted away from me, and I am fine with that. And once it is setup with Vuex, the API-style data communication to the backend is a simple and clean way to separate the front/back.
OAuth has turned out to be a hairier beast than it has any right to be, but for me that is still a work in progress. Any advice on a simple solution for that would be appreciated!
- jonnycoder 7y agoI've been developing VueJS with Vuetify lately using only the CDN links with editing an html file. Quasar and Vuetify are very similar, with Quasar appearing to have a few more components. The documentation is even very similar, and I like the readability of Quasar a little better. It's good to know this exists!
- lubujackson 7y agoI looked at Vuetify too but what finally sold me on Quasar was the integrated deployment to mobile, desktop and PWA.