Page tree
Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

Version 1 Next »

Introduction

I know, Eclipse, it's an IDE. Why would a front-end developer want to get all wrapped up with that? One word, convenience. In order to develop efficiently with Magnolia you need to rely on some tools. Aside from the actual webapp you will also need some kind of text editor. Preferably one that has Freemarker and YAML syntax highlighters. CSS and JavaScript development tools would also be helpful. You will need a servlet container like Tomcat. Also, some tool to help facilitate the development process can be nice, so let's go ahead and throw in the Magnolia CLI tool for that.

Let's take an inventory. So I have an ee bundle downloaded (community here). I started it using my command line utility. I've finished the install in Firefox and I'm tailing the log from the command window. I've got a second command window open for the CLI tool. I've moved myself into the modules directory of the author instance and I'm ready to start creating modules and templates. I'm using the Atom text editor and I have the modules directory opened as a project. Atom also provides syntax highlighting for YAML but not Freemarker. As a substitute I will associate Freemarker files as HTML to at least get partial highlighting. No so bad, with a little finagling I can probably get that all showing at one time.

One Tool

Eclipse IDE is a powerful tool. It is the most popular Java IDE today. It can integrate a lot of technologies and also provides a framework for plugins. Let's set up the light development version. No Maven, no Git is needed for this. Front end, back end, those evaluating the product can find this approach useful. 

  1. Make sure you have Java 8 JDK.
  2. Download a copy of Eclipse Oxygen.
  3. Download a copy of Tomcat Server.

    It should not matter which server you use. Tomcat tends to be the lightest.

  4. Download a copy of the war file you would like to use.
  5. In your user home directory create a folder named Eclipse and a sub-folder called light-development-workspace.

    MacBook-Pro-3:/Users/rgange/Eclipse/light-development-workspace rgange$
  6. Move the tomcat zip inside the workspace and unzip it.
  7. Move the Magnolia war file inside the workspace.
  8. Open Eclipse
    1. Select the new workspace when prompted.
    2. Close the Welcome tab to get to the Project Explorer.
  9. Configure the environment.
    1. Close the tabs: Markers, Properties, Data Source Explorer, Snippets, Outline, and Task List.

      These are really not needed for light development so we move them out of the way.

    2. Open the Internal Browser for convenience.
    3. Hide the Tool Bar. (Window > Appearance)

Eclipse plugin

Now for the trifecta. The custom Eclipse plugin for Magnolia development. With this plugin you can create light modules, apps, dialogs, and templates with a wizard.

Light modules

With light modules select only the registries you need. Create only the files you want. Link templates to existing dialogs or create new dialogs via form input.

Templates

Create a page or component template using the wizard.

Content apps

Create a content app with basic features that can be customized.

Virtual URI mappings

Quickly create virtual URI mappings using a wizard.

Decorations

Creating decorations can be confusing for some. The wizard walks you through the steps to get the appropriate module and registry folders as well as the definition you wish to target.

Themes

Get the base configuration automated using the wizard.

Magnolia Eclipse Support module

Offered as an extension, the Magnolia eclipse support module provides rest endpoints which allow Eclipse to query things from the registries. For example, when creating a page template you can select your preferred dialog from a drop-down rather then having to try and remember the correct format.

Installation

<dependency>
   <groupId>info.magnolia.eclipse</groupId>
   <artifactId>magnolia-eclipse-plugin-support</artifactId>
   <version>1.0-SNAPSHOT</version>
</dependency>
  • No labels