Developing against your own CMS

This page lists a number of options to run a development build of Fonto Editor against your own CMS. This setup allows you to benefit from fast rebuilds on changes in your Fonto Editor configuration and easy debugging, while also using your actual CMS as a source for documents.

We still recommend to implement additional custom endpoints in the development CMS of the Fonto Development Tools. When we need your editor in a support ticket, we can only run it using FDT, not with your own CMS.

For more information on implementing additional custom endpoints in the development CMS, click here.

Testing the several endpoints on the CMS can be a time-consuming, and cumbersome task using just the Editor. Instead of using the Editor to test the endpoints it's recommended to use a tool like Postman. This is a powerful tool that allows you to send requests with the desired data to any endpoint to verify that it works as expected.

Using a different absolute cmsBaseUrl scope variable does not work when running fdt editor run due to CORS. You will need the options on this page when there are multiple hosts involved.

On this page, we will assume your CMS runs on http://localhost:9000. The Fonto Editor (fdt editor run) runs on http://localhost:8080.

Let's say you're launching Fonto Editor from your CMS with a button in the CMS UI. That button will likely open Fonto Editor in the current tab or in an IFrame. The source of both those locations would be http://localhost:9000/fonto/index.html?<scope>. The /fonto part would end up on a static file location in your CMS, where it would find the index.html. The index.html has a script tag that eventually will load the main.js from the same static file location.

Using a symbolic link to the development files

The first option is to create a symbolic link to the files that fdt editor run produces. FDT has the option to write an intermediate build to disk. This build updates every time changes are made to the Fonto Editor application code.

You can write those files to disk by using the --write-to-disk flag in the fdt editor run command. This will write the files to a folder called dev. The folder contains the same files as if it would have been an fdt editor build, albeit these files include sourcemaps and are not optimized for performance.

Do not use the dev files in a production system.

You can then create a symbolic link from the dev folder to the actual static file location in your CMS, or manually copy those files. Creating symbolic links differs from OS to OS, so please consult the appropriate documentation.

Using a proxy in your CMS

Another option is to proxy the files requested from the CMS to the fdt editor run endpoint. This is needed if the CMS runs on another machine than the location of fdt editor run or if a symbolic link is not possible.

Now a possibility would be to, instead of the static file location, create a proxy (or just an endpoint on your CMS). That proxy (or CMS endpoint) would then request the http://localhost:8080/index.html file from the fdt editor run application.

You will need a "catch all" proxy, where every static file requested from the http://localhost:9000/fonto path is proxied to http://localhost:8080.

In a diagram, the proxy setup would look like this. Please also see this page for more information on proxy setups.