Smile Brands Inc. is one of the largest providers of support services to dental groups in the United States. Smile Brands Inc. provides comprehensive business support services to more than 1,300 dentists and hygienists practicing in over 360 Bright Now!® Dental, Monarch Dental®, and Castle Dental® offices in 18 states.
Ext JS and Sencha Touch are used by Smile Brands to create applications for our practice management platform. We’ve decided to create HTML5 web applications for UI Components on desktop and mobile devices to supplement, then replace, an existing green screen application used to facilitate support services within the company. These services include call centers for patient scheduling, billing centers for revenue cycle management, and patient and practice management in the dental office. The Ext JS and Sencha Touch frameworks work well with our Java backend technologies, which use Spring and Hibernate.
Table of Contents
Why We Chose Ext JS and Sencha Touch
We chose the Ext JS and Sencha Touch frameworks because we gained access to a vast library of client-side components, theming, events, and a familiar model, view, controller (MVC) architecture that helped us to succeed in building large, complex, single-page web applications. The team has been developing enterprise applications with Java for some time, and our practice management platform is a large multi-module Maven project yielding a half dozen web applications when deployed. We’ve built multiple layers of abstraction from a data model, repository layer, and service tier that roll into web modules. These separate web modules expose service-side functionality using REST. Ext JS and Sencha Touch do a fantastic job supporting an MVC paradigm that plays nicely with our architectural choices and makes it easy to connect our server-side frameworks with our client-side frameworks.
“Ext JS and Sencha Touch do a fantastic job supporting an MVC paradigm which plays nicely with our architectural choices and makes it easy to connect our server-side frameworks with our client-side frameworks.”
Visual appeal and a great user experience are things we strive to provide our user community. We follow a design principle called the aesthetic usability effect – the better it looks, the more users will perceive that it’s easy to use. This approach has made it easier for us to introduce more complex application processes into the organization that would have otherwise been executed manually while still leveraging existing training efforts. Sencha frameworks allowed us to customize and style a lot of the core components, especially data views, to get just the look we wanted. The ability to extend classes in Ext JS and Sencha Touch, whether they are UI components, controllers, models, etc. really helped us to reduce the complexity of the client-side elements of our applications, shifting responsibility to the appropriate layer, all the while adhering to a core design and development principle of reusability. That was a big advantage.
Our practice management platform relies heavily on the Ext JS data view and grid panel components with a lot of client-side filtering. Data views especially allow us to control the layout of content and plugins nicely to the event model that communicates to our client-side controllers. For example, the layout of the patient’s teeth in the charting modules is a data view. We used a template and a store of conditions to control the layout. When you look at the teeth, you see roots at the top or bottom based on the jaw followed by crowns and surfaces, if applicable. As the user records existing conditions and pathology or periodontal pocket depths, models in the store are changing and thus the data view.
As we introduced more functionality into our web product, we realized the demand for PC time in the operatory was growing. We quickly decided that we needed a mobile application for dental assistants to record clinical information and treatment recommendations presented during the exam. We had great success with Ext JS, so we chose Sencha Touch. We were able to take our Ext JS assets from the desktop product and quickly build a Touch application. The first iteration of our Touch-based restorative charting and treatment planning was up and running in 30 days.
As these applications continued to mature, we noticed a few of the core controllers grew massively because they needed to not only respond to view and application events, but also evaluate data and produce answers to common business questions that relied on multiple stores and models. To remedy this, we built a service layer of Singleton classes using Ext JS that we call managers. Ultimately, the framework enabled us to implement complex service logic and rely on the underlying stores and their content. For example, in the restorative app, if a dentist wants to recommend treatment on a tooth, this is easy to record from a data standpoint. However, the system wants to take into consideration existing conditions and pathology to narrow down the set to the most appropriate options. These types of business and flow questions are delegated to managers.
Business Value of Using Sencha Touch and Ext JS
When we needed to increase our development velocity on a business critical project, we were able to rely on Sencha Professional Services for assistance. Their experts became a part of our development team — working on custom components to improve performance as well as sharing best practices. Their additional insight and experience helped us to reach another level of expertise with Sencha frameworks.
Our Advice to New Developers
Read the docs and spend time with the samples and tutorials. Rely on the framework to do the work it’s intended to do. If you find yourself writing code outside the application’s intended functionality, there may be a configuration or convention you might be missing. Know your data model. Good applications are predicated on good data models and a solid understanding of the application’s purpose. The implementation of MVC in the framework will do the majority of the heavy lifting required to develop effective modern web applications, allowing the developer to cleanly implement functionality.
We’ve tried other libraries and frameworks, and we haven’t found anything that has the vast coverage of documentation, client-side components, customizability and extensibility that Sencha offers. Our dev team doesn’t know a world without Sencha frameworks — they fit our development principles and help us remain agile and productive.