# Installation

There are several ways to start using Marcelle:

⚠️ Experimental

Marcelle is still experimental and is currently under active development. Breaking changes are expected.

# Using Marcelle CLI

Install the CLI globally:

npm install -g @marcellejs/cli

Generate a Marcelle application (if unsure about the options, just select the defaults):

marcelle generate app

See the CLI's documentation

# Using a package manager

Using npm:

npm install @marcellejs/core --save

or yarn:

yarn add @marcellejs/core

# Direct Download / CDN

<script src="https://unpkg.com/@marcellejs/core"></script>

The following HTML and JS snippets provide a template marcelle application.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Marcelle Example</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <link rel="stylesheet" href="https://unpkg.com/@marcellejs/core@0.3.2/dist/marcelle.css" />
    <script defer type="module" src="script.js"></script>
  </head>
  <body>
    <noscript>
      <strong>
        We're sorry but this application doesn't work properly without JavaScript enabled. Please
        enable it to continue.
      </strong>
    </noscript>
  </body>
</html>
import {
  dashboard,
  webcam,
} from 'https://unpkg.com/@marcellejs/core@0.3.2/dist/marcelle.bundle.esm.js';

const w = webcam();

const dash = dashboard({
  title: 'Hello Marcelle',
  author: 'Jane Doe',
});

dash.page('Main').sidebar(w);

dash.show();