Book Image

Enterprise Application Development with Ext JS and Spring

By : Gerald Gierer
Book Image

Enterprise Application Development with Ext JS and Spring

By: Gerald Gierer

Overview of this book

Spring and Ext JS are cutting edge frameworks that allow us to build high performance web applications for modern devices, that are now consuming data at a faster rate than ever before. It is the appropriate time for you to understand how to best leverage these technologies when architecting, designing, and developing large scale web development projects. This practical guide condenses an approach to web development that was gained from real world projects, and outlines a simple, practical approach to developing high performance, and enterprise grade web applications. Starting with configuring Java, NetBeans, and MySQL to prepare your development environment, you will then learn how to connect your NetBeans IDE to the MySQL database server. We will then explore the Task Time Tracker (3T) project database structure and populate these tables with test data. Following on from this, we will examine core JPA concepts after reverse engineering the domain layer with NetBeans. Leveraging the Data Access Object design pattern, you will learn how to build the Java DAO implementation layer assisted by generics in base classes, followed by a Data Transfer Object enabled service layer to encapsulate the business logic of your 3T application. The final chapters that focus on Java explore how to implement the request handling layer using Spring annotated controllers, and deploy the 3T application to the GlassFish server. We will then configure the Ext JS 4 development environment and introduce key Ext JS 4 concepts, including MVC and practical design conventions. Covering a variety of important Ext JS 4 strategies and concepts, you will be fully-equipped to implement a variety of different user interfaces using the Ext JS MVC design pattern. Your journey ends by exploring the production build and deployment process using Maven, Sencha Cmd and GlassFish.

Related Content you might be interested in

Current Title:

Small book image
Enterprise Application Development with Ext JS and Spring
Gerald Gierer
Dec, 2013 | 446 pages
No titles found
Table of Contents (22 chapters)
Enterprise Application Development with Ext JS and Spring
Enterprise Application Development with Ext JS and Spring
Credits
Credits
About the Author
About the Author
Acknowledgments
Acknowledgments
About the Reviewers
About the Reviewers
www.PacktPub.com
www.PacktPub.com
Preface
Preface
Free Chapter
1
Preparing Your Development Environment
Preparing Your Development Environment
Installing MySQL
Installing the Java SE Development Kit (JDK)
Installing the NetBeans IDE
Introducing Maven
Creating the Maven Web Application project
Starting the GlassFish 4 server
Running the Task Time Tracker project
Summary
2
The Task Time Tracker Database
The Task Time Tracker Database
Connecting NetBeans with MySQL
The 3T database
Enterprise options for the 3T database
Summary
3
Reverse Engineering the Domain Layer with JPA
Reverse Engineering the Domain Layer with JPA
Understanding the reasons for using JPA
Understanding JPA implementations
Reverse engineering with NetBeans
Introducing the persistence.xml file
Refactoring the Java classes
Introducing the Java Persistence Query Language
Refactoring Java equals() and hashCode()
Summary
4
Data Access Made Easy
Data Access Made Easy
Defining the DAO interfaces
Defining the generic DAO implementation
Defining the DAO implementations
A better domain layer
Exercise – a simple change request
Summary
5
Testing the DAO Layer with Spring and JUnit
Testing the DAO Layer with Spring and JUnit
Unit testing overview
Configuring the test environment
Introducing the Spring IoC container
Defining a test case superclass
Defining the CompanyDao test case
Running the JUnit test cases with Maven
JPA traps for the unwary
Exercises
Summary
6
Back to Business – The Service Layer
Back to Business – The Service Layer
Service layer considerations
Building the service layer
The service layer interfaces
Implementing the service layer
Testing the service layer
Automating the service layer tests
Exercises
Summary
7
The Web Request Handling Layer
The Web Request Handling Layer
A brief history of Web MVC
Request handling for enterprise web applications
Building the request handling layer
Creating the request handlers
The Spring HandlerInterceptor interface
The Spring MVC configuration
Defining the TaskLogHandler class
More on Spring MVC
Exercises
Summary
8
Running 3T on GlassFish
Running 3T on GlassFish
Configuring the 3T web application
Configuring the Maven pom.xml file
Adding eclipselink.target-server to the persistence.xml file
Adding the logback.xml file to your resources directory
Configuring the GlassFish server
Running 3T
Managing GlassFish without NetBeans
Summary
9
Getting Started with Ext JS 4
Getting Started with Ext JS 4
The importance of application design
Ext JS 4 MVC concepts
Ext JS 4 design conventions and concepts
Practical conventions
The Ext JS 4 development environment
Generating the 3T Ext JS 4 application skeleton
Creating components using Sencha Cmd
Summary
10
Logging On and Maintaining Users
Logging On and Maintaining Users
Layouts, screens, and workflows
Building our views
Models and persistence
Controlling the Logon and Viewport actions
Controlling our user views
Let's log on!
Let's maintain users
Summary
11
Building the Task Log User Interface
Building the Task Log User Interface
Task log workflows and layouts
Building our task log views
Defining our models
Defining our stores
Controlling the TaskLog actions
Testing the task log interface
Summary
12
3T Administration Made Easy
3T Administration Made Easy
Administration workflows and layouts
Building the 3T administration interface
Generating a JSON tree in the CompanyHandler class
Controlling the 3T administration
Testing the 3T administration interface
Dynamically loading tree nodes
Displaying multiple tree columns
Drag-and-drop made easy
Summary
13
Moving Your Application to Production
Moving Your Application to Production
Compiling with Sencha Cmd
Ext JS 4 theming
Compiling for production use
Integrating Sencha Cmd compiling with Maven
Adding the build version and timestamp
Building a slimmer WAR file
Deploying the WAR file to GlassFish
GlassFish performance tuning and optimization
Summary
Introducing Spring Data JPA
Introducing Spring Data JPA
Index
Index

Building the 3T administration interface

The 3T administration interface will require us to build the components displayed in the following screenshot. The ProjectForm and TaskForm views are not visible and will be displayed when required in a card layout:

The ManageTasks view is an hbox layout that equally splits the left and right parts of the screen. The toolbar contains a single button to add a new company, while the region to the right is a card layout containing the CompanyForm, ProjectForm, and TaskForm views. Let's now look at each component in detail.

The ManageTasks.js file

The ManageTasks view defines the toolbar with the Add New Company button and splits the view into an hbox layout. The companytree panel and container defined with the card layout are configured by xtype. The card layout container contains the CompanyForm, ProjectForm, and TaskForm. The ManageTasks view is defined as follows:

Ext.define('TTT.view.admin.ManageTasks', {
    extend: 'Ext.panel.Panel',
    xtype: 'managetasks...
Previous Section
End of Section 3
Next Section