Materialized Custom Element
- Small and fast(Less than 9KB gzipped).
- No depenancy on framework or library. Vanilla JS only.
- Common-sense engineering; Element itself(not JS object) has properties and functions.
- Minimal coding, easy to maintain. Take a look at code
You don't need Angular, React, or Vue to create a simple SPA with routing capability. router example
Do you show a loading sign on a specific section. Use
mce-blocker to show loading sign exactly overlayed on an element.
Your page scrolls, and you don't want to load all elements that are not inviewport. inview example
You have list, and you want to click, navigate, select with keyboard/mouse. list item example
By simply adding the following
<script> tag to your html, you are ready to go.
<script defer src="https:/unpkg.com/mce"></script>
Optionally, and for better design, you can add Google Roboto font, Material Design Icons, and/or, Font-Awesome icons.
<link rel="stylesheet" href="https:/fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900italic,900"> <link rel="stylesheet" href="https:/fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="https://firstname.lastname@example.org/css/font-awesome.css">
How To Use
Just use it in your html. No other step is required.
For Whom With Curiousity
$ git clone https://github.com/allenhwkim/mce.git $ cd mce $ npm i $ npm start # to see all components in development. mode
For NodeJS users, install
npm install mce --save-dev