Page History
...
Magnolia front-end helpers are collections of JavaScript libraries that enable easy integration of single-page applications in the Magnolia Pages app. Currently, the helpers are available from our Bitbucket repository https://git.magnolia-cms.com/scm/modules/frontend-helpers.git, and currently consist of the following Currently, Magnolia provides the following helper libraries:
- Angular renderer.
- React renderer.
- Magnolia Template Annotations. The annotations make content from a front-end project editable in Magnolia. This is achieved by injecting annotations (HTML comments) around components/templates which the Magnolia Page Editor transforms into controls for web content editors.
| Table of Contents |
|---|
Installing and usage
You can add the libraries to your SPA project either by installing them using the npm install command,
| Mgnl mini code snippet | ||
|---|---|---|
| ||
npm install --save @magnolia/template-annotations |
or by including them as project dependencies.
The helpers have the following package names:
- Angular renderer:
@robsis/react-renderer - React renderer:
@robsis/angular-renderer - Template Annotations:
@robsis/template-annotations
For more information on how to install and use these helper libraries, click the following links:
- Angular renderer: https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/browse/packages/angular-renderer/projects/angular-renderer/README.md
- React renderer: https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/raw/packages/react-renderer/README.adoc
- Template Annotations: https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/raw/packages/template-annotations/README.adoc
On npmjs.com, the helpers have the following package names:
- Angular renderer:
@robsis/react-renderer - React renderer:
@robsis/angular-renderer - Template Annotations:
@robsis/template-annotations
Front-end helpers in Magnolia example SPA pages
...
Overview
Content Tools