Would you use Vue + Quasar to build a Marketing site?



  • I have been working on a templating solution in the form of an app extension for Quasar. Currently I’m stuck on how to integrate dynamic content. Unfortunately, there is no standard for the communication with the backend. I’ve been using json-api but that does not cover authentication for example.

    I’m wondering what your thoughts are on what is the most convenient way to implement this @Ben-Hayat @qyloxe .
    For example, if Firebase provides authentication, how do you login (which routes, payload, responses) with Quasar? Any standards you use?



  • @stefanvh said in Would you use Vue + Quasar to build a Marketing site?:

    I have been working on a templating solution in the form of an app extension for Quasar. Currently I’m stuck on how to integrate dynamic content. Unfortunately, there is no standard for the communication with the backend. I’ve been using json-api but that does not cover authentication for example.

    I’m wondering what your thoughts are on what is the most convenient way to implement this @Ben-Hayat @qyloxe .
    For example, if Firebase provides authentication, how do you login (which routes, payload, responses) with Quasar? Any standards you use?

    This is a too broad question. “Dynamic content” could mean anything, “integrate” is almost a meme word, the “authentication” you write probably means “authorisation”, “convenient” is not a synonym for “secure”. Please just write what are your constraints, what is your expected outcome in specific context, then it would have sense to write anything. Any of us could come with different solutions which could be “convenient” “integrated” and any of buzz words, but without context they all would be wrong. There’s a little learning in this.



  • I might power it with ButterCMS (https://buttercms.com - uses Vue too!) and use quasar components for the front end.

    It might look a bit too app-like, though - if you know what I mean.



  • @walfin said in Would you use Vue + Quasar to build a Marketing site?:

    I might power it with ButterCMS (https://buttercms.com - uses Vue too!) and use quasar components for the front end.

    It might look a bit too app-like, though - if you know what I mean.

    That’s a bit expensive.



  • @Ben-Hayat You’ve got me interested in rebuilding my company website using quasar. I’m looking at new Vue based CMSes now.

    https://pagekit.com looks interesting too. Vue based so I can probably create a theme that uses Quasar. PHP so it’ll work on my shared hosting. And open source so not expensive.



  • @qyloxe said in Would you use Vue + Quasar to build a Marketing site?:

    @stefanvh said in Would you use Vue + Quasar to build a Marketing site?:

    I have been working on a templating solution in the form of an app extension for Quasar. Currently I’m stuck on how to integrate dynamic content. Unfortunately, there is no standard for the communication with the backend. I’ve been using json-api but that does not cover authentication for example.

    I’m wondering what your thoughts are on what is the most convenient way to implement this @Ben-Hayat @qyloxe .
    For example, if Firebase provides authentication, how do you login (which routes, payload, responses) with Quasar? Any standards you use?

    This is a too broad question. “Dynamic content” could mean anything, “integrate” is almost a meme word, the “authentication” you write probably means “authorisation”, “convenient” is not a synonym for “secure”. Please just write what are your constraints, what is your expected outcome in specific context, then it would have sense to write anything. Any of us could come with different solutions which could be “convenient” “integrated” and any of buzz words, but without context they all would be wrong. There’s a little learning in this.

    This post exactly describes the problem. There are a billion ways to implement it, but it is not feasible for a templating system to support a billion different methods. I have a working solution myself, but I’m curious how other people approach the same problem and if there maybe is a common solution that would suit most people.

    I meant authentication. Authorization happens using HTTP headers, which fortunately is a pretty standard solution but can also be implemented in a bunch of different ways.

    So, for example simple blog functionality. There needs to be a way to authenticate the user with an username and password. The authentication returns an authorization token. With the authorization token the user should be able to create a blog post (e.g. POST /posts). Unauthenticated people should be able to retrieve this post (e.g. GET /posts or /posts/1). This post is prefetched in Quasar and then displayed in a QCard for example. JSON-API covers creating and fetching resources (the posts), but authentication and even authorization can be performed in a billion different ways. Personally I am using PASETO tokens and /login and /register routes with simply {username, password} as payload with the appropriate HTTP status codes as response. But there are a lot of other ways (http://www.passportjs.org/packages/).

    For a templating system there needs to be some kind of communication standard between the frontend and backend if you want dynamic content (dynamic as in you don’t have to rebuild your app).

    @Ben-Hayat I don’t want to hijack your topic so let me know if I have to move this discussion somewhere else.



  • @stefanvh said in Would you use Vue + Quasar to build a Marketing site?:

    @Ben-Hayat I don’t want to hijack your topic so let me know if I have to move this discussion somewhere else.

    I’m also feeling uncomfortable here…

    So, for example simple blog functionality. There needs to be a way to authenticate the user with an username and password. The authentication returns an authorization token. With the authorization token the user should be able to create a blog post (e.g. POST /posts). Unauthenticated people should be able to retrieve this post (e.g. GET /posts or /posts/1). This post is prefetched in Quasar and then displayed in a QCard for example. JSON-API covers creating and fetching resources (the posts), but authentication and even authorization can be performed in a billion different ways. Personally I am using PASETO tokens and /login and /register routes with simply {username, password} as payload with the appropriate HTTP status codes as response. But there are a lot of other ways (http://www.passportjs.org/packages/).

    anyway, this scheme could be vulnerable to CSRF family of attacks. You need secure, same-site etc. cookie. Every other client side token, visible to JS is a potential vector of attack. If it is a blog for cats stories I wouldnt worry of course, but if it is a blog for bank official statements - this is another story. Do you know who your target is?
    Well, the words are cheap and misleading. We, as developers has a opportunity and privilege to talk precisely and exactly about topic - we can use the language of code. So, please just create a repo on github, put your words into action and just create a skeleton, template, base of your thoughts in material (as in computers haha) form. It is much easier to discuss code in specific context than just dream about any possible or maybe possible context. At the end of the day, you will need to make a technical decision.



  • @Ben-Hayat So, this has gotten me to work. I decided to rebuild my company website using Quasar, with directus (https://directus.io) as the backend (it has quite a full featured API, including a JavaScript SDK which I used, and has authentication built-in).

    Let me know your feedback on the UI:
    https://customautosys.com/new (new Quasar UI)
    https://customautosys.com (old UI)

    🙂

    @qyloxe said in Would you use Vue + Quasar to build a Marketing site?:

    @stefanvh said in Would you use Vue + Quasar to build a Marketing site?:

    @Ben-Hayat I don’t want to hijack your topic so let me know if I have to move this discussion somewhere else.

    I’m also feeling uncomfortable here…

    So, for example simple blog functionality. There needs to be a way to authenticate the user with an username and password. The authentication returns an authorization token. With the authorization token the user should be able to create a blog post (e.g. POST /posts). Unauthenticated people should be able to retrieve this post (e.g. GET /posts or /posts/1). This post is prefetched in Quasar and then displayed in a QCard for example. JSON-API covers creating and fetching resources (the posts), but authentication and even authorization can be performed in a billion different ways. Personally I am using PASETO tokens and /login and /register routes with simply {username, password} as payload with the appropriate HTTP status codes as response. But there are a lot of other ways (http://www.passportjs.org/packages/).

    anyway, this scheme could be vulnerable to CSRF family of attacks. You need secure, same-site etc. cookie. Every other client side token, visible to JS is a potential vector of attack. If it is a blog for cats stories I wouldnt worry of course, but if it is a blog for bank official statements - this is another story. Do you know who your target is?
    Well, the words are cheap and misleading. We, as developers has a opportunity and privilege to talk precisely and exactly about topic - we can use the language of code. So, please just create a repo on github, put your words into action and just create a skeleton, template, base of your thoughts in material (as in computers haha) form. It is much easier to discuss code in specific context than just dream about any possible or maybe possible context. At the end of the day, you will need to make a technical decision.

    Authentication is a problem that has been solved by many other companies. Don’t reinvent the wheel. There are solutions like Auth0 & Okta, just to name 2 of the most common ones. Using a tried-and-tested authentication provider is probably more secure and less susceptible to CSRF than anything a solo dev could churn out.



  • @walfin Same here. I would use ButterCMS too. I am already using it with a Laravel app that uses Vue in front end. I have made some components on the app with laravel while blog is being called with ButterCMS api.



  • @olidev How does ButterCMS compare with Directus?


Log in to reply