Monster
Monster is a lightweight, robust and easy-to-use library with modest ambitions. Monster integrates easily into your existing websites without taking over everything.
It is not the goal of Monster to pull in a completely new abstraction
with its own language, but to combine the existing techniques of HTML,
CSS and Javascript in a meaningful way.
Monster is perfectly suited for the creation of beautiful and fast
user interfaces and websites. The basis is formed by core functions that
can be supplemented by necessary classes and objects.
One design target is to reach the shiny sun with as little Javascript as possible.
Monster was built with ES6 modules and uses import
and export.
There is a version in the /dist folder that was built via webpack and
thus supports all browsers that are compatible with ES5.
For some functions you need additional polyfills.
Installation
npm install @schukai/monster
CDN
<!DOCTYPE html>
<html>
<head>
<title>HTML, CSS and JavaScript demo</title>
</head>
<body>
<p>Hello Monster <span id="version"></span>!</p>
<script type="module">
import {
Monster
} from 'https://unpkg.com/@schukai/monster@1.31.0/dist/modules/monster.js';
let id = document.getElementById('version');
id.innerHTML = Monster.getVersion();
</script>
</body>
</html>nomodule for backwards compatibility
<script type="module" src="https://unpkg.com/@schukai/monster@1.31.0/dist/modules/monster.js"></script>
<script nomodule src="https://unpkg.com/@schukai/monster@1.31.0/dist/monster.js"></script>Polyfill
We do try to work around some browser bugs, but on the whole we don't use polyfills and feature detection.
However, many functions can be mapped via polyfill.io and thus the compatibility can be increased.
<script id="polyfill" src="https://polyfill.io/v3/polyfill.min.js?features=Array.from,Array.isArray,Array.prototype.entries,Array.prototype.fill,Array.prototype.filter,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.keys,Array.prototype.lastIndexOf,Array.prototype.map,Array.prototype.reduce,Array.prototype.sort,ArrayBuffer,atob,CustomEvent,DataView,document,Document,DocumentFragment,Element,Event,fetch,globalThis,HTMLDocument,HTMLTemplateElement,Intl,JSON,Map,Math.log2,Number.isInteger,Object.assign,Object.defineProperty,Object.entries,Object.freeze,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.keys,Promise,Reflect,Reflect.defineProperty,Reflect.get,Reflect.getOwnPropertyDescriptor,Reflect.setPrototypeOf,Set,String.prototype.endsWith,String.prototype.matchAll,String.prototype.padStart,String.prototype.startsWith,String.prototype.trim,Symbol,Symbol.iterator,Uint16Array,Uint8Array,URL,WeakMap,WeakSet"
crossorigin="anonymous"
referrerpolicy="no-referrer"></script>Compatibility
if the global name Monster, is already used by another component, the following variable can be used to adapt the name of the component.
__MonsterRootName__="MyMonster"After that, all classes are accessible via MyMonster. For example MyMonster.getVersion().
Documentation
To check out docs and examples, visit monsterjs.org/en/doc/latest/.
Questions
For questions and commercial support please contact schukai GmbH. The issue list of this repo is exclusively for bug reports and feature requests.
Issues
Please make sure to read the Issue Reporting Checklist before opening an issue. Issues not conforming to the guidelines may be closed immediately.
License
Copyright © 2021 schukai GmbH
you can also purchase a commercial licence
Changelog
Detailed changes for each release are documented in the CHANGELOG.