# Run a first grapesjs example

Start with the smallest workflow described by the README for **grapesjs**. Complete [installation and configuration](/docs/up-to-code-grapesjs/installation-guide) first.

## Usage

```html
<link rel="stylesheet" href="path/to/grapes.min.css" />
<script src="path/to/grapes.min.js"></script>

<div id="gjs"></div>

<script type="text/javascript">
  var editor = grapesjs.init({
    container: '#gjs',
    components: '<div class="txt-red">Hello world!</div>',
    style: '.txt-red{color: red}',
  });
</script>
```

For a more practical example I'd suggest looking up the code inside this demo: http://grapesjs.com/demo.html

## Verify your changes

The root manifest provides this check:

```sh
npm run test
```

Read any errors before continuing. Build and type checks verify source consistency; exercise the README example to verify the behavior you need.

## Next task

[Read the usage guide](/docs/up-to-code-grapesjs/usage-guide) for the documented components, configuration, and source layout.

## Source and help

- [GitHub repository](https://github.com/Up-to-code/grapesjs)
- [Original README](https://github.com/Up-to-code/grapesjs/blob/dev/README.md)
- [Issues and existing reports](https://github.com/Up-to-code/grapesjs/issues)
- [Open the project website](https://grapesjs.com)


This catalog entry is a fork. The README may describe upstream packages, domains, or release procedures; those destinations do not establish a separate release of this fork.