I am developing Laravel/Vuejs Web Application using Bootstrap. There are some components which requires material design. I am confused in selecting between Vuetify and MDBootstrap (though its paid).
can anyone please recommend what should i use and why?
Related
Not sure it's the right question for this forum, but I couldn't find another place for it.
Our design team built their design system based on fluent ui libraries as described here. They downloaded the design from here.
Unfortunately, our engineering team is using Angular, so we naturally reached for the option of web component but found out to our surprise that the library is completely different - different set of components, abilities, and of course - a completely different design.
I thought that all fluentui platforms are supposed to be an implementation / interface of the same design. Why is this not the case? What am I missing?
Is there a way we can use the design described in here in Angular? (Except actually using the react library inside my Angular project).
Thanks for helping and very sorry if this question is inappropriate for this forum.
fluent web components integrated with angular.
take a look at documents
I really love using Svelte but at this moment, one of its cons is the lack of ready-to-use components for Svelte. I want to use vue-atlaskit in a project, but I really prefer using Svelte. Is it possible to use vue components inside a Svelte app?
I guess it all should be just "web-components", but I really don't know how to do it.
I checked with people in the Svelte Discourse. There is no simple way to do that. The suggestion is to convert the UI components I need from Vue to Svelte.
While not a comprehensive answer, I would add some findings on the topic:
As you suggested, I would try with Web Components. According to Custom Elements Everywhere the support for Web Components is fairly high for both frameworks. Vue states that the support is 100% although the site shows less so there is some discrepancy. But basic tests pass 100%. Svelte is also at 100%. This paints a fairly positive picture.
There is another question on SO that refers to consuming Web Components in Svelte.
Here is another reference article on how to create web components with Vue 3.
Note: I will try to update the answer as I learn more. I will be testing this out on a migration of a PWA from Vue to Svelte, where I plan first to use Svelte components in an existing Vue app and then perhaps switch to using Vue components in a Svelte app, depending on how things go with rewriting.
I am building Vue.Js application which uses Clarity Design. The library doesn't support officially Vue, so I'm using just the css classes and make custom components with them. But I faced a problem with the date picker, because it's supported only for Angular and can't see a solution to use it in Vue. Is there any way to use it in my application.
Currently Clarity only works with Angular. We have an initiative to make Clarity framework independent underway, but today the only option is to use Clarity with Angular to get the datepicker and other features.
See: https://medium.com/claritydesignsystem/clarity-core-72f6d3a029bc
Need to build an interface. So want to know what is the best and easy way to do it in vue.js
As with a lot of things, there isn't a "best" thing as this is a very subjective matter but we can focus on the "most popular". I will give you an overview of the current state of most popular Vue.js styling solutions:
Vuetify
A complete material design UI framework has a lot of components and is very active, very customizable as well It probably is the most popular UI solution for Vue.js
Quasar Framework
Quasar is also a material based UI framework but it focuses on performance and developer experience, very active and releases often. It also has its own CLI and allows you to target apps using Electron or Cardova, its more of a complete app-bootstrapper than a UI framework.
Bootstrap-Vue
It is like the name suggests, a bootstrap-based UI framework and is the most comprehensive one with full implementation of bootstrap and a lot of custom components as well. It the way to go if you are going with bootstrap-based UIs.
Tailwind CSS
Tailwind is a utility-first CSS framework that uses PostCSS, it is really easy to get started with and very productive, it is my personal favorite because it stays in the CSS and HTML realm, while UI frameworks are very cool and productive, you cannot escape the overhead they introduce and not all designs are based off bootstrap or material anyways. Tailwind manages to stay productive while being very flexible but requires having decent knowledge of CSS and how properties interact.
Again there isn't a "best" framework out there for styling, so you need to study the options and pick the one that "better suits you".
Hello Gurus / AEM Experts.
I have a situation here and need your advise as to will it add value in performing responsive testing for AEM components.
Currently Our AEM application dev team uses AEM 6.2 for there component development. What I understand from them is they are using Bootstrap and developing the custom components. It could be a Tile , Button , Image , Hero component.
I belong to the testing team and do you see is it necessary to test the responsive design of the components ( using tools like Galen Galen Framework | Automated testing of responsive design )
My understanding is that the out-of- box components created in AEM are already comply to responsive design. Will that imply to the custom components.
Looking for your valuable inputs based upon which We could devise the next steps.
Thanks
Will that imply to the custom components.
Short answer: no, unless the devs have made those custom components responsive.
It depends on project requirement. In my current project custom components are responsive and we are doing responsive testing. We have used Galen for the automated testing of look and feel for responsive design.