Setup Aptana Studio/Eclipse for Ext JS...

Preview:

Citation preview

Setup Aptana Studio/Eclipse for Ext JS Development: Aptana is a powerful open-source web development IDE. Please download and install Aptana Studio 3.

Now, you need t o i n s t a l l Spke t IDE p l ug i n from spket.com. Spket is a powerful toolkit for JavaScript and XML development. It enables autocomplete feature for Ext JS as soon as you install and configure Spket IDE plugin in Aptana or Eclipse.

Install Spket plugin in Aptana or Eclipse: 1. Open Aptana/Eclipse. 2. Go to Help menu -> 'Install New Software..'

3. It will open a popup window as shown below:

4.

5. Click 'Add' and enter name 'Spket' and Location ‘http://www.agpad.com/update/’.

6.

7. Click OK. 8. Select all the packages under Spket IDE:

9.

10. Click 'Next'.

11. Accept the License Agreement. 12. Click 'Finish'.

13.

14. This will download and install Spket IDE plugin in Aptana/Eclipse. 15. After installation -> restart Aptana/Eclipse.

Now, you need to configure Spket plugin. Follow the below steps to configure Spket plugin in Aptana/Eclipse in windows platform:

1. Start Aptana or Eclipse. 2. Go to Windows menu -> Preferences.

3. Expand Spket -> select JavaScript Profiles.

4.

5. Click 'New..'

6. Enter Name as ExtJS and click OK.

7.

8. Now, select ExtJS profile and click 'Add Library'. This opens 'Select Library' popup.

9. Select ExtJS from the drowpdown and click 'OK'.

10.

11. Now, select ExtJS profile and click 'Add Library'.

12. In the Select Library popup, select ExtJS and click OK.

13. Now, select ExtJS child node and click Add Folder and

select build folder under Ext JS 6 sdk folder which you downloaded earlier.

14. This will add all JS files under build folder.

15. Now, set ExtJS profile as Default profile by clicking on Default button. 16. Click OK and restart Aptana or Eclipse.

Now, create new project and JavaScript file and press Ctrl + Space. This shows autocomplete feature with help as shown below:

This is how you can get autocomplete feature in Aptana or Eclipse.

JavaScript Syntax errors and warnings: Aptana or Eclipse comes with JSLint and JavaScript Syntax validators. However, JSLint validator is disabled by default. To enable it,

1. Go to Windows -> Preferences. 2. Expand Aptana Studio node.

3. Select Validation. There you will see JSLint Validator:

4.

5. Select JSLint validator and click OK. Now the Problems window displays JavaScript errors and warnings for your project. However, you need to exclude extjs sdk folder because JSLint shows errors and warnings for many sdk JS files.

To exclude it, right click on sdk folder in Project explorer -> select Properties -> select Resource Filters under Resource node and click 'Add':

Select Exclude All, Files and Folders, All Children and enter * in File and Folder Attributes as shown below:

Now, you get errors and warnings for your JavaScript files only.

Format JavaScript code: Aptana comes with default code formatter for JavaScript. Press Ctrl + Shift + F to format JavaScript code in Aptana.

So, in this way you can setup development environment using Aptana or Eclipse IDE in Windows platform.