Published Dec 25, 2010 | ILoveToQuestion | Tutorial | Easy
Last Updated Jul 11, 2011

Preface

For those of you who would like to use Eclipse[1] as an IDE for developing Ext-JS applications, this tutorial details the initial setup. This tutorial assumes that the reader has knowledge of setting up projects in Eclipse environment. Also this tutorial assumes that the Ext-JS has been downloaded to your computer.

Eclipse Dynamic Web Project Directory Structure

 
+ << Web Project Name >>
   - build
   - src
   - WebContent
      - css
      - images
      - js
      - META-INF
      - WEB-INF
      - examples

Procedure

1. Create a Dynamic Web Project in Eclipse.
2. Create the folders "css", "images", "js" and "examples" as shown above.
3. Copy "examples.css" and "ext-all.css" to css folder.
4. Copy the images directory from <<ext installation>>\resources folder.
5. Copy "ext-all.js" and "ext-base.js" into the js folder.
6. Create your own html page under examples directory based on the template html file shown here [2] .
7. Deploy your Web Application to Apache Tomcat or any other Web/Application Server of your choice
8. ENJOY THE POWER OF EXT-JS.