Reusable web components in VUE JS - Webcomponent-DL Webcomponent-Delight
>NB: a lot of dirt code, I'm sorry a do not have engough timeto make it better !
---
I know Vuetify,Quasar,Element-UI,Vue-Material from having used it several times and its use does not prove that we know Vue.js.
Worse, the monitoring of migrations is heavy and painful especially in CSS since we need to hack for overriding in order to integrate in something existing. So it becomes very expensive to follow the versions.
As much mastering its own components makes basic languages and follow them, that's my point of view.
However, it is very difficult to do something flawless in such a short time.
---
Live demo
All in one components live demo )
https://guardian-angels-for-riders.com/demovuejs/
Final Use Cases
> Treetable with differents types of axis (aggregates CA, % CA...)
>
> Partial editable Flat with Treetable aspect
>
>... so many others
UX Design - bases - FR
> UX se décline en trois étapes : Analyse, Conception et Évaluation.
User Research = Observer, interviewer, analyser le comportement des véritables utilisateurs du produit, comprendre le besoin
> L’étape de conception: définition des interfaces de l’expérience digitale (UX/UI Design). = maquette des solutions pour répondre aux attentes des utilisateurs. Ce sont des hypothèses de conception à vérifier auprès des véritables utilisateurs.
> L‘étape de l’évaluation des interfaces, généralement, un test utilisateur qui permet de valider concrètement auprès des véritables utilisateurs du produit les hypothèses de la seconde étape.
> UX est une démarche scientifique, s’appuyant sur les travaux en ergonomie, psychologie cognitive et psychologie expérimentale
UI - bases
> Colors
>
> blue
> pink..
> others UI aspects ...
Install
> You can checkout the project and get dependencies with
yarn, a demo page will run with
yarn serve
or
> To use this components in your project run
yarn add webcomponents-dl@0.1.43
Table with header
Example with simple model
Read only mode
Filters in columns
Edit mode
Composition with simples components
Treetable
> Usefull for aggregates columns and explore partials branches
Flat with Treetable aspect
> Usefull for display groups
----------
Reusable Components
Component - Editable Field - Datepicker
> A date with datepicker
----------
Component - Editable Field - Combo
> Valid values in combo
----------
Component - Editable Field - Number, String ...
> A number with dynamic debounce
----------
Component - Pastille
> Rounded element
----------
Component - Toggle
> Toggle button
----------
Component - Buttons
> Buttons can be an image or anything else
----------
Component - Spinner
> Reactive SVG Spinner
----------
Component - Tooltips
> tooltips inline or absolute with buttons
----------
Component - Fixed
> fix header for different uses : for tables ...
----------
Component - Toasted
> toasted event
----------
Component - Expender
> expender
----------
Component - Filter
> Reactive filter
----------
Component - pagination
> pagination
----------
Component - Search field
> full text search
----------
> LE DORNER François