5. Practical – a CMS Application | Ext JS Application Development Blueprints

Sign In Start Free Trial

Book Overview & Buying
Table Of Contents

Ext JS Application Development Blueprints

By : Colin Ramsay

4 (1)

Ext JS Application Development Blueprints

4 (1)

By: Colin Ramsay

Overview of this book

If you are a developer who has knowledge of Ext JS but would like to expand it to encompass the bigger picture of application development, then this book is ideal for you.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

1. Introduction

1. Introduction

Humble beginnings

What is application architecture?

Ext JS

Getting ready

In safe hands

Summary

2. MVC and MVVM

2. MVC and MVVM

Diary of always

Bringing MVC to the Web

Ext JS and MVC

How does it help your application

MVC and the illusion of choice

Introducing MVVM

An event domain example

Summary

3. Application Structure

3. Application Structure

Ideas for structure

Getting to know your application

Cultivating your code

The solution to pollution

Summary – mind your own beeswax

4. Sencha Cmd

4. Sencha Cmd

What is Sencha Cmd?

Why is it important?

Setting up your application

The generation game

Develop in style

Care for the environment

Before the build

Code complete

The best of the rest

Summary

5. Practical – a CMS Application

5. Practical – a CMS Application

A content-managed system

The requirements

Starting at the bottom

Work your way up

Where the wild things are

The real deal

Creating a structure

Data-driven design

A room with a view

Summary

6. Practical – Monitoring Dashboard

6. Practical – Monitoring Dashboard

Application design

Requirements

Data structure

The view from the top

Flexibility and pragmatism

Does this hurt?

Onwards and upwards

Data first

Storing the data

With a view to a controller

The main view controller

The dashboard

The dashboard view model

The dashboard view controller

Web logs subpage

A view on the Web

Controlling the Web

More and more subpages

Summary

7. Practical – an E-mail Client

7. Practical – an E-mail Client

Form factors

Application design

I require to admire

Responding to the situation

Input required

A view to a thrill

Application state

A binding agreement

An eventful application

Coding – it's been a long time

It's under control

Login view

Main force

The head of the family

Unravel the thread

I am the best message

A composed finish

Deciding on a theme

Summary

8. Practical – Questionnaire Component

8. Practical – Questionnaire Component

Application design – my way

Data structure

Data flow

Sketchy sketching

Get set

The data layer

The payload

The wizard component

One step forward

Making progress

Step by step

Questionnaire command and control

The wizard model

A delightful host

Mixin the night away

Summary

9. A Shopping Application

9. A Shopping Application

About the app

Back to Ext JS

The data layer

Component interaction

The simplicity of view models

Code, code, and more code

Interface in your face

Categorically speaking

Product placement

A basket case

The account window

Summary

10. Debugging and Performance

10. Debugging and Performance

In-browser debugging

Breaking and busting

Performance in Ext JS

Quick on the draw

Analyzing performance

Summary

11. Application Testing

11. Application Testing

Total testing

Testing tool time with Jasmine

Testing with robots

Testability

Faking it with mocks

Continuous coverage

Summary

Index

Index

The real deal

We've designed the data layer and the UI layer, the glue that dictates how the two interact, and tackled the remaining bits of the client requirements that look like they may cause trouble. We're in good shape to start putting our fingers on the keyboard in our favorite text editor and show how the design can be implemented in Ext JS.

A short interlude on data binding

With the introduction of view models in Ext JS, the concept of data binding has also been brought to prominence. In short, data binding binds one value to another value. When the first changes, the second updates automatically. Two-way data binding means that when either value changes, the other updates accordingly.

On the whole, Ext JS has implemented this idea via view models. A UI component may have its title bound to a value and when this value is updated by another part of the application, the title automatically changes. This removes the need for the developer to wire up change events and ensures that data...

CONTINUE READING

83

Tech Concepts

36

Programming languages

73

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Ext JS Application Development Blueprints

Search

Your notes and bookmarks