From Learn About the Ext JavaScript Library

Contents 1 Download Ext 2 Configure 2.1 No Web Server 2.2 IIS - Microsoft Internet Information Services 2.3 Apache 3 HTML Page Setup 4 How to learn it? 5 The Demos / Examples 5.1 s.gif 5.2 php 5.3 Carrots

This tutorial will walk through how to get an Ext installation up and running quickly.

Download Ext

If you haven't done so already, you'll first want to download the most current Ext release which can always be found here: http://extjs.com/products/extjs/download.php.

There are several different options for what you can download, but you'll probably want to start with the most current stable production version available. Once you download and unzip the file, you're pretty much ready to go, but read on for some specifics depending on your server setup.

Configure

Some Ext JS examples require a HTTP server (and some a PHP server). This does not mean that Ext JS can only be used in combination with a HTTP server.

Ext JS code that uses server requests requires a HTTP web server (access pages through a webserver via http://something).

No Web Server

You can actually run Ext JS without a web server thanks to Doug Hendricks. If you would like to run Ext without a web server, check out this forum post.

IIS - Microsoft Internet Information Services

If you encounter any difficulties on a IIS platform, additional tips can be found in this forum post.

Apache

If you encounter issues with Apache on windows (files being corrupted), additional tips can be found in this forum post.

HTML Page Setup

Setting up your HTML Page

How to learn it?

• If you're not sure where to start, one approach might be to:

1. See if there's something in the demos that is close to what you want to do
2. Review the demo source code.
3. If you see commands in the source and don't understand what it's doing check the API Docs for more info
4. At the same time that you search in the demos, see if there's a tutorial for what you're about to do that might provide additional commentary.
5. Check the FAQs if you encounter any problems along the way for the part you're working on.
6. If you're branching into something more complex, then check the tutorial section for Application Design stuff (how to structure your app, working with scope, extending, xtypes, etc).
7. Also if you're branching out check the extensions to see if someone has done something similar. There is a forum for extensions, as well as a recent initiative to house extensions in a more centralized, searchable location.
8. Books and Screencasts.
9. Finally feel free to contribute your learning experience to a tutorial or supplement the FAQs. Don't worry about posting something wrong, someone will correct it.

The Demos / Examples

A good place to start exploring is the examples directory and the wiki (tutorials and manual). The examples directory in the download package has several working examples, please note the following:

s.gif

Ext uses a 1x1 transparent gif image to create inline icons with CSS background images. The default URL to this file is "extjs.com/s.gif", so you'll want to change this somewhere at the top of your code by telling Ext where to find the empty image. You can modify the URL as needed with a command like this:

Ext.BLANK_IMAGE_URL = '/images/ext/resources/images/default/s.gif';

php

Ext JS is a client side javascript framework and will operate with any server platform that can process POST requests and return structured data. It just so happens that some of the samples provided include php files, so you'll need to have a local php server set up to run some of these examples out of the box (again php is not required for Ext JS).

• The php files are written assuming short tags are enabled <? instead of <? php.

• The examples provided by ExtJS using JSON via XHR assume your php server supports json_encode(). If your version of php (pre 5.2?) doesn't have that function available there is really easy to fix:
  

/*
1.) Download JSON.php from:
http://mike.teczno.com/JSON/JSON.phps<br />
 
2.) copy JSON.php to the example dir of Ext.<br />
 
3.) Change the php file in the example as follows:
("ext tree" used for the example below)<br />
*/
//In: example/tree/get-nodes.php add /remark: 
require_once("../JSON.php");
 
...
...
...
//echo json_encode($nodes);
$json = new Services_JSON();
echo $json->encode($nodes);

Carrots

Not all of the samples are linked on the examples index page. You will need to browse the directories manually to discover some other examples Ext includes in the distribution package.