Tools and editors

Before we go any further, it's important we use some tools in order to be more productive when building our code and our applications. There are many editors in the market we can use to write code. Let's review some of them that will be useful in this book.

XAMPP or WAMP

XAMPP is an open source distribution of Apache that contains MySQL, PHP, and Perl, and is easy to install and easy to use. XAMPP can provide us with a local web development environment that is easy to handle without the need to test on a public server or hosting.

XAMPP is available for Windows (32-bit), Linux, and OS X versions and you can download XAMPP at https://www.apachefriends.org/index.html.

WAMP is another free package containing Apache, MySQL, and PHP, especially designed for the Windows OS. You can get it at http://www.wampserver.com/en/. WAMP comes in 32-bit and 64-bit versions according to your Windows OS.

In order to test the code or review some Ext JS examples, we will need a web server (Apache) or IIS to get the proper functionality and AJAX responses that the examples and code require.

Aptana

The Aptana editor is an IDE from Appcelerator. It's based on Eclipse but optimized for web applications. It's an open source project and free of charge.

Among other IDEs, Aptana contains an autocomplete functionality for JavaScript and Ext JS, a JavaScript validator, a CSS and HTML validator, a JavaScript debugger, Bundles, and more:

Aptana is a great tool when working with Python, Ruby, or PHP as the backend of our projects. It contains tools to work with those out-of-the-box languages and also contains tools to deploy your application in the cloud using Heroku or Engine Yard.

Sencha Architect

The Sencha Architect desktop application is a tool that will help you design and develop an application faster than coding it by hand. The idea is to drag and drop the components into a canvas, and then add the functionality. The Sencha Architect desktop application is a product from Sencha Inc. that aims to help developers define components with a few clicks. We can create an Ext JS or Sencha Touch project. We can get a free trial from the official website of Sencha. We can also buy the license there.

Note

The current Sencha Architect version is 3.1.0. This works for Ext JS versions 4.x and 5.x. Previous versions of Sencha architect, such as 2.x will not work for Ext JS 5.

One of the advantages that Architect has is that you can drag-and-drop components into the work zone and this tool will create (generate) the basic code of the components and/or the part(s) you are working with.

Also, you can switch to the code view and see the results so far (some parts of the Ext JS classes/components can be edited but not all of them). You can see the code view in the following screenshot:

The intention of this book is not to teach you about Sencha Architect, it's for you to understand and learn Ext JS and create applications without the need to use Sencha Architect. Later, if you feel you need to use Sencha Architect or want to give a try, it may be easier once you know the basics and essentials that are covered in this book.