Vesan is a User Interface Framework made with Vue & Animadio
Use this Template
or
git clone https://github.com/philippebeck/vesan.git
or
Latest Release
NPM : npm i vesan
or
Yarn : yarn add vesan
If you choose to get Vesan from NPM or Yarn : you need to copy Vesan from node_modules/vesan to the root of your App
Install the frontend dependencies :
$ npm install
To configure the frontend constants, replace values :
/src/config/values.example.js
(then rename it /src/config/values.js)
To run the UI :
$ npm start
-
Compile the frontend :
$ npm run build
-
Then use the files of the dist folder for your prod UI
Elements Components :
- BtnElt (Link & Button Elements)
- CardElt (Article & Section Elements)
- FieldElt (User Input & User Select Elements)
- FootElt (Footer Element)
- ListElt (List Element)
- MediaElt (Audio, Image, Quote & Video Elements)
- NavElt (Navbar & Sidebar Elements)
- SliderElt (Slider Element)
- TableElt (Table Element)
Setters Components :
- ArticleSet (Article Setter)
- GallerySet (Gallery Setter)
- ImageSet (Image Setter)
- LinkSet (Link Setter)
- OrderSet (Order Setter)
- ProductSet (Product Setter)
- ProjectSet (Project Setter)
- UserSet (User Setter)
Main Views :
- HomeView (Home)
- ContactView (Contact)
- LegalView (Legal notice)
- LoginView (Sign in, Sign up, Forgot password)
- ProfileView (User profile)
- ErrorView (Error)
Data Views :
- BlogView (Blog with articles list)
- ArticleView (Article of the blog)
- PortfolioView (Portfolio of projects)
- ShopView (Shop with products list)
- ProductView (Product of the shop)
- BasketView (Basket & order process)
- GalleryView (Galleries list)
- ImageView (Images of a gallery)
- LinkView (Links list)
Services :
- Checkers : checkRange(), checkRegex(), checkRole()
- Fetchers : getData(), postData(), putData(), deleteData()
- Getters : getCats(), getItemName(), getItemsByCat()
- Setters : setError(), setGlobalMeta(), setMeta()
Available Demo :
Available Readme :