ExtJS 5 Simple Login System Example


Professional Ext applications require users to login. This example shows how to get logged-in user data from the server before the application actually starts and how to require user to login.

Open in new window

Main Features

  • uses custom startup sequence
  • stores user data in private variables
  • uses View Model to two-way bind login form fields
  • protects from command line startup attempts
  • reloads the application on logout
  • uses custom Ext error handler (test by typing XLogin.startApp()) in the console

Use Cases

You can use this example as the basis of your login system when developing an application that requires login. However, you need to implement your security measures as the example does not focus on security. See the comments in the source code that explain where to implement your security implementation.

Example Files (relative to example root)

The example has been initially generated with sencha generate app so the following list contains only added or edited files:

Source Code

If you want to see the example code, login or sign-up. Free membership is available.
Follow me:


I'm a well seasoned developer, consultant and educator of web applications based mainly on Sencha libraries, PHP, MySQL and Node.js. Besides (Apple) computers, I love photography and mountain biking.
Follow me:

Latest posts by Saki (see all)


  1. says

    I have received the following bug report from Zoltan:

    Hi Saki,

    I think I may have found a bug in your simple-login-system example.
    In app/Setup.js on line 90, I think instead of this:
    me.fireEvent(me, response);
    it should be this:
    me.fireEvent(‘setupfail’, response);

    Am I right, or did I miss something? :)

    Also, I just wanted to let you know, that I Love your site, so keep up the good work!

    Best regards,

    Yes, you’re right Zoltan, thank you for finding and reporting the bug and for the bugfix.

  2. Ayman Abi Abdallah says

    Hi Saki,

    Is it possible to load view on demand in a single page application built using Sencha Architect? Write now the application basically loads all the view straight from the login page.

    Best regards,

  3. says

    It should be possible because you can also write some code in Architect, however, I have never tried it as I do not use Architect for real applications, only for prototyping.

  4. Pedro Reino says

    Hi Saki,

    First of all congratulations for your great work.

    I’ve a question on app launch: calling Setup.init() will post a request with empty params to server. Is this ok?

    Thanks in advance,
    Pedro Reino.

We will be happy to hear back from you

Please Login to post a comment