01-getting-started.md
-
Volker Schukai authoredVolker Schukai authored
You'll need basic HTML, CSS, and JavaScript skills for Monster. If you're just starting out with frontend development, you should have a good beginner's guide open alongside this one.
You can also post your questions on Stack Overflow.
To get started with Monster, all you need is a text editor and a browser. The best way is to copy the following example into a file and save it as index.html.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>awaken the monster in you!</title>
</head>
<body>
<div>your version is
<spay id="version"></spay>
</div>
<script type="module">
import {Version} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.21.0/dist/modules/types/version.js';
document.getElementById('version').innerText = new Version('1.0.0').toString();
</script>
</body>
</html>
Now open this file with your browser.
What did you do? you used the class 'Version' of monster and created a Version object. They then output this in a span.
Voila!
As seen above in the version example, each monster class or function can be used independently.
Alternatively, Monster can be used as a collection of many useful classes and functions via
the Monster
namespace as a single javascript file.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>awaken the monster in you!</title>
<script src="https://cdn.jsdelivr.net/npm/@schukai/monster@1.21.0/dist/monster.js"></script>
</head>
<body>
<div>your version is
<spay id="version"></spay>
</div>
<script>
document.getElementById('version').innerText = new Monster.Types.Version('1.0.0').toString();
</script>
</body>
</html>
Besides the CDN jsdelivr,
Monster can also be obtained via NPM
or the git repos.
Monster itself has no dependencies and does not dictate anything to you,
you can use Monster with Bootstrap, jQuery or other cool frameworks.