Clarification using Starter Kit and Vue Cli3, needed please

Ben Hayat

Hi;

I’m new to Vue framework and the third party around it. My goal is to use Vue as our front end app to our .Net Web API REST server. For this, I had done lots of research on the UI toolkits and at first I came across Vuetify, but it’s Mobile browser did not satisfy our needs. Continued with the research, and Quasar is the champion of our choice.

For us to use Vuetify, we only needed to use Vue’s CLI 3 to build the project and then add Vuetify into the mix. Simple!
However, after reading Quasar Guide and seeing there are several ways to install & use quasar, I have developed a confusion to bring it up.

NOTE: Our app only needs to run in web browser (desktop & Mobile). No need to build stand alone app or Cordova or SSR.

looking at the options I have, the guide recommends using Starter Kit, which means (to my limited knowledge) we use Quasar’s CLI system to build the whole project and basically NOT use Vue CLI 3 CLI. Is this correct understanding?
For building SPA app, do we need Starter Kit, or should we install Vue CLI 3 and then add Quasar plugin into the CLI 3?
What advantage will I gain from using Starter kit or what will I lose if I don’t use Starter Kit?

Thank you in advance and looking forward to be part of this rich community.

nothingismagick

Hi Ben - basically, if you use the quasar-cli, you will be using our node & webpack hot-reloading dev server for an interstellar development experience. You are correct in assuming you won’t be needing the vue-cli. My recommendation is to NOT use the quasar plugin. Try it out! If you need anymore help, feel free to visit us over at Discord.

Ben Hayat

@nothingismagick

Thank you very much for your speedy reply. I’m deep into the docs and reading the materials and I’m super impressed with Quasar and have NO problem using Quasar’s CLI than Vue’s CLI.
I’d like to make a suggestion, especially for new comers like myself. The name “Starter Kit” might be a bit misleading in connection with using Quasar CLI. As most new users begin to understand how the CLI works and get adapted to the concept of CLI, I suggest that the docs be changed to use the tile of “Quasar CLI” than “Starter Kit”. The word “Starter Kit” in this case, almost sounds like a propriety kit for building Vue app, than simply using Quasar CLI.

I want to take this opportunity to “Thank” how well the SPA apps run in Mobile browser. The performance and responsiveness, is a HUGE advantage over other libraries we looked at.

Once again, thank you!

Hawkeye64

@nothingismagick I agree with @Ben-Hayat in the sense that “Starter Kit” to me usually means something to train with and is preferably not to be used for Production quality coding.

s.molinari

How about “Core Kit” or “Base Kit”. It’s not really just about the CLI. It’s about “beginning”, “getting going”, etc… From there, you can do more including building out to other app types (i.e. SSR, PWA, etc.)

Scott

Ben Hayat

@s-molinari said in Clarification using Starter Kit and Vue Cli3, needed please:

How about “Core Kit” or “Base Kit”.

That’s really what CLI does. Starter Kit, Core kit, Base Kit and etc. are all good, but people “immediately” relate to CLI and what it does. So it’s best to stay with the standard terminologies to reduce confusions, mainly for newcomers. This is important, because with many libraries out there, new users spend a few minutes to check each out and as soon as they see something that looks odd, they disqualify it. Quasar is an excellent and well thought out product and deserves the attention it should get. And that’s where my main post was all about.

genyded

I agree as well. Ut really is Quasar CLI and it can do more that just get you started. In fact, it refers to itself as Quasar CLI in the version call:

 Example usage
    $ quasar <command> <options>

  Help for a command
    $ quasar <command> --help
    $ quasar <command> -h

  Options
    --version, -v Print Quasar CLI version

  Commands
    init          Create a project folder
    dev           Start a dev server for your App
    build         Build your app for production
    clean         Clean all build artifacts
    new           Quickly scaffold page/layout/component/... vue file
    mode          Add/remove Quasar Modes for your App
    info          Display info about your machine and your App
    serve         Create an ad-hoc server on App's distributables
    help          Displays this message

s.molinari

That’s really what CLI does. Starter Kit, Core kit, Base Kit and etc. are all good, but people “immediately” relate to CLI and what it does. So it’s best to stay with the standard terminologies to reduce confusions, mainly for newcomers.

But, that part of the docs is not just about the CLI. It’s about developing a core application. It’s about config, routing, build commands (yes with the CLI), app plug-ins, theming, etc. etc. 90% of it has nothing to do with the CLI, thus naming that part of the docs “CLI” or something similar makes no sense. I agree that “Starter Kit” could be named something different, something better. But definitely not CLI.

Scott

Hawkeye64

I am more or less thinking of how new perople would perceive it before they read the docs.

Ben Hayat

One other question on the starter kit.
Does the current starter kit work with Vue CLI 3 or the older one?
In the docs it says:

make sure you have vue-cli globally installed
$ yarn global add vue-cli
or:
$ npm install -g vue-cli

Node.js >= 8.9.0 is required.
$ yarn global add quasar-cli
or:
$ npm install -g quasar-cli

Does the docs need to be updated or does it mean, Quasar requires the older Vue CLI?
Thanks!

genyded

The docs already state “Vue CLI 3 Plugin”

Ben Hayat

@genyded said in Clarification using Starter Kit and Vue Cli3, needed please:

The docs already state “Vue CLI 3 Plugin”

That is if you want to go the route of Vue CLI3 Plugin and NOT the Starter Kit:

Vue CLI 3 plugin

Make sure you have vue-cli 3.x.x:

vue --version

If you don’t have a project created with vue-cli 3.x yet:

vue create my-app

Please take a look here:
https://quasar-framework.org/guide/index.html

nothingismagick

@hawkeye64 Can you tell me more about your feelings regarding the “onboarding” process. This is an aspect of our communication with the devs that we really want to be succinct, but also informative. Any feedback is greatly appreciated!

Ben Hayat

@nothingismagick

Hi;
Although you asked hawkeye64 to give you some feedback, I’d also like to offer my two cents, to make Quasar a first class framework especially for new users getting started.

When I was looking at different libraries, Vuetify was on the top of my list. the main reason was for the their great "style " of documents, samples, being able to test the samples online and copy a working sample to our code. This provides confidence to the new user and not to get intimidated. like https://vuetifyjs.com/en/components/badges

Quasar has a lot more into it, so to start off, it’s more complex and not having seamless docs, people can easily shy away from it. I took the time to read the docs to appreciate the power and richness of Quasar, but that’s only 5% of new users.

Hope this helps.

s.molinari

so to start off, it’s more complex

That impression is the one we need to somehow avoid, because it isn’t true.

Scott

s.molinari

Hmm…I was just about to suggest another name for that part of the docs and it looks like Razvan changed it already 3 days ago. Now it is “Quasar CLI” and now that I see it there, I can go with it.

I was about to suggest something like “Developing a Core Project” to go with the other “Developings” below it.

Scott