Sitemap
ipek

ipek

My Ext JS Notes

3 min readJun 23, 2019

--

I started using Ext JS more than 10 years ago. Until that time, I had developed desktop business applications using Delphi and C# without worrying about the UI layer, with the help of the visual form designers and handy themes.

But then, I needed to enter into the world of web applications. And, since knowing how HTML and CSS works didn’t mean that one could easily develop not bad looking, user-friendly, functional business applications, I was ready to give up at any minute. However, while googling around to learn about the ways for generating nice looking grids with HTML and CSS, I came across with Ext JS! Yes, it didn’t have a visual designer but it was really easy to use with all its nice looking components, layout mechanisms and pretty good documentation. I was saved by Ext JS even though I did not now JavaScript at that time! I learned them concurrently and it was not so hard. Or may be, it seemed easy because I knew that it would be harder to do layouts and dynamic pages on my own, by using floats and tables to accomplish the same thing.

10 years ago, Ext JS gave us the opportunity to develop our business web application as an SPA in a very short time. Since we were developing a business application, our main focus was delivering the rapidly changing business needs as soon as possible. Therefore, UI was only a conduit to do business online: it needed to be working and not look bad, that was all :) And thankfully it did!

And now, we have decided to rewrite our Ext JS 3.4 web application and again opted to use Ext JS. The latest version of Ext JS (as of now it is 6.7) is nothing like version 3.4 so, there is a lot to learn. But the most important part is to decide how the application structure should be. There are not many guidelines and the ones out there are scattered in different parts of the docs (Cmd, Ext JS, FAQs) and also blogs. This led me to take notes, sometimes in a copy/paste kind of way, to keep all these necessary bits of information in one place to avoid searching them again and again. These notes were for me; I have never thought that I would publish them. But as I delved into the framework, I have realized that there are hardly any articles out there on the current version of the framework, most likely because there isn’t a huge Ext JS community. That’s why I decided to publish these notes even though I really hold back writing anything public. I just hope that these notes will help new Ext JS users save time and patience for common problems and ease their Ext JS journey.

I believe that to be comfortable with Ext JS you have to understand the build process, workspaces and resource management. Without grasping these concepts it seems hard to build a large application.

Get ipek’s stories in your inbox

Join Medium for free to get updates from this writer.

I have taken down my notes in markdown format as a README document of a sample project named extjs_guide_ws on Github. Therefore I did not want to copy those notes to this article. However, I have written down the main outlines of my notes below:

Creating an empty workspace and adding apps and packages

Watching the app

Building the app

Building a package

Comparison of Application Folder Structures

Inner Workings of Sencha Cmd

Resource Management

As I have mentioned before most of the notes are copied from the documentation just to gather them in one place. However, while doing that, in some parts I have added my own remarks and findings to the notes. Most importantly, I have tried to implement some of the ambiguous concepts in the project with explanations and also screenshots.

--

--