Implement Dreamweaver like FTP Upload On Save function to Eclipse without the need for ANT

One familiar problem with using Eclipse for web development is that it expects developers to run or compile sources on their local machines. Now this expectation is not really appropriate for many situations including HTML development where you develop on remote or virtual test servers. So we are going to customise Eclipse so it will automatically upload a file to a test server whenever it is saved, after editing.

Firstly this technique requires the use of the free Aptana plug-in for Eclipse. For those who don’t know, Aptana is a very functional IDE plug-in for Eclipse that puts a focus on web based development.

Assuming Aptana is installed and up and running we can go on. Firstly we need to change the Eclipse perspective to Aptana so we can be certain the correct menu options are available while you follow this tutorial.

The first thing you need to do is create a new folder ‘scripts’ in the root of the project where you wish to enable Upload Current File On Save. You can do this by selecting the project and then right-click, New > Folder.

Now with your newly created scripts folder, right-click it. New > JavaScript File. With the New JavaScript File dialog save the script file as upload_current_file_on_save.js.

Once created, select from the Eclipse menu select Window > Open Perspective > Aptana

From the Eclipse menu select Window > Show Aptana View > Scripts

This should bring up a new window listing all the available Aptana customized scripts. In the Scripts dialog, scroll down to the bottom to the folder ‘Synchonize’. Look for, select and then right-click over the script ‘Upload Current File On Save’. Select ‘Edit Script’.

Select the body of the script [Ctrl A] and copy it to the clipboard [Ctrl C]. Open the blank upload_current_file_on_save.js you created earlier, paste the content of the clipboard into the file [Ctrl P]. Then save the modified file either with [Ctrl S] or using the Eclipse menu, File > Save.

Now we need to modify the script as by default it is disabled. On line 5 where it says * Menu: Synchonize > Upload Current File On Save; replace the word Synchonize to the name of your project or website. Save the changes. You should be able to test that everything is okay by going to the Scripts menu, there should be a sub-menu item with the name of your project or website with a Upload Current File On Save option.

Now back in the script window, go to line 12 which says // * Listener: commandService().addExecutionLister(this);
Remove the comments which are the two forward slashes, //. Select and cut the whole of line 12 and insert it to line 5 so it now sits above the *Menu: … item as shown below. Again save the file and you cna now close the Script edit tab.

Now the script is complete, we need to setup a FTP account.

In the Eclipse menu select Window > Show Aptana > View > Sync Manager

Right-click on Sync Manager and select Add Site Connection
A new dialog will come up, Create Site Connection.
Give a short but meaningful Connection name.
In the Path section, change the Local: from File to Project.
Browse for and select your project.

Now we add the FTP testing server details. In the same dialog, under Remote: + Select remote server, select Add New FTP (or SFTP, FTPS). Enter your site details and press Okay. Back in the Create Site Connection dialog, also press Okay.

Now we are almost there all we need to do now is select the new connection to make sure it is used as default whenever we save a file within the project.

Right-click your project name, under the Project tab. Select Properties at the bottom of the right-click menu. In the Properties dialog click the Synchronization option near the bottom of the options. Change the Default Synchronization Connections to the one you previously created and make sure the Use Connection As Default checkbox is checked.

Congratulations you now have enabled automatic uploads on save for your Eclipse project!