Synchronizing the code between AEM Instance and Eclipse

In this post, we will learn how to sync the code between AEM Instance and Eclipse.

Versions Used : AEM -> 6.3 , Eclipse -> Oxygen 3a

We will use the AEM Developer tools eclipse plugin to do the sync operation.
Install AEM Developer tools in Eclipse

1) Open eclipse -> Go to Help -> click on Eclipse Marketplace.

2) Search for AEM Developer tools and install the plugin.
Import AEM maven project into Eclipse

In Project Explorer view -> right-click and select an Import option.

On Import popup window -> select maven -> existing maven projects.

Click Next -> browse the Maven project root directory.

Click finish. Now our AEM project is imported into eclipse.
Change the default perspective to AEM perspective

Go to Windows -> perspective -> open perspective -> select AEM -> click open

Now we have our project on the AEM perspective.

Convert the maven modules into content and bundle projects

Right click on demo.core module -> configure -> click on convert to Bundle Project.

similarly right click on demo.ui.apps module -> select configure -> click on convert to Content Project.
Configure AEM server connector in Eclipse Servers view

To connect eclipse to AEM server click on “no servers are available” link in servers view.

Click finish. To edit the server connection details like port, debug port, username, and password, double click on the configured server connector.

Edit the properties and save.

To add the bundle and ui.apps package to the configured server -> right click on the server connector -> select Add or Remove.

Add the bundles from the left section to the right using Add button and click finish.

Start AEM Instance

Once the AEM Instance is started, go to eclipse and start the configured server in the Eclipse.

once the server is started, the bundle and ui.apps modules will be published to the AEM server.

To verify go to OSGi bundles console and find the demo.core module.

If the bundle and ui.apps module is not published to the AEM server, republish the modules by removing all modules and adding them again to the Eclipse server connector.

Now the Demo project is deployed to AEM.
Importing the Code changes from AEM Instance to Eclipse

open CRXDE and edit a component html file.

Helloword.html file is updated with the text “Welcome to my world” as shown above.

To get the updated component to eclipse workspace, in eclipse right click on helloworld.html file and click on Import from the server.

The file will be imported from the AEM Instance to eclipse.

Exporting the code changes from Eclipse to AEM

Updated helloword.html with some text in eclipse workspace as shown below.

The updated file will automatically be synchronized/pushed to AEM Instance.