* Getting Started
	1. Prerequisites
		1. Download and Install Sencha Cmd 6.5.1
		2. Download the Ext JS 6.5 SDK
		#recomanded
		C:\Users\Me\sencha-sdks    # Windows
		/Users/Me/sencha-sdks      # Mac OS X
		/home/me/sencha-sdks       # Linux

	2. Create New Project
		a. sencha -sdk /path/to/ext6 generate app MyApp /path/to/my-app
		b. sencha generate app -ext MyApp /path/to/my-app
		c. sencha app build
		d. sencha app watch
		e. sencha app build development	>command only updates the JavaScript portion of the bootstrap.
		f. sencha app refresh >  command will perform a refresh but will also compile your styling to generate a fresh CSS file.
	3. Generate
		a. sencha generate model User id:int,name,email >Model
		b. sencha generate view -base Ext.tab.Panel foo.Thing >View
		c. sencha generate controller Central >Controller

*Core Concepts
	1. Class System
		a. Naming Conventions
			a.1. Classes
				names
				- only contain alphanumeric characters.
		  		- Do not use underscores, hyphens, or any other non-alphanumeric character
				- should be grouped into packages when appropriate and properly namespaced using object property dot-notation (.).

			a.2. Source File
				The names of the classes map directly to the file paths in which they are stored. As a result, there must only be one class per file.

		b. Methods and Variables
			names
			Method and variable names should always be in camelCased

		c. Declaration
			use a single method for class creation: Ext.define
			Ext.define(className, members, onClassCreated);
			. className: The class name
			. members is an object that represents a collection of class members in key-value pairs
			. onClassCreated is an optional function callback that is invoked when all dependencies of the defined class are ready and the class itself is fully created
		d. Configuration
			config property that gets processed by the powerful Ext.Class pre-processors before the class is created.

	2. Layouts and Containers
		It handles the sizing and positioning of every Component in your application

		a. Layouts
			Every container has a layout that manages the sizing and positioning of its child Components.
			a.1 Using Layouts
			a.2 How the layout system works
				- A Container's Layout is responsible for the initial positioning and sizing of all of the Container's children
					width: 400,
					height: 200,
				    	title: 'Container Panel',
				    	layout: 'column',
				    	suspendLayout: true // Suspend automatic layouts while we do several different things that could trigger a layout on their own
		b. Component Layout
			ust like a Container's Layout defines how a Container sizes and positions its Component items,
			a Component also has a Layout which defines how it sizes and positions its internal child items.
			Component layouts are configured using the componentLayout config option

		c. Components
			c.1. The Component Hierarchy
				- A typical application's Component hierarchy starts with a Viewport at the top
				- A Container is a special type of Component that can contain other Components.
				- A typical application is made up of many nested Components in a tree-like structure that is referred to as the Component hierarchy.
			c.2. XTypes and Lazy Instantiation
				- Every Component has a symbolic name called an xtype.
			c.3. Showing and Hiding
				- All Components have built in show and hide methods. The default CSS method used to hide the Component is "display: none".
			c.4. Floating Components
				- Floating Component are positioned outside of the document flow using CSS absolute positioning, and do not participate in their Containers' layout
				- draggable - enables dragging of a floating Component around the screen.
				- shadow - customizes the look of a floating Component's shadow.
				- alignTo() - aligns a floating Component to a specific element.
				- center() - centers a floating Component in its Container.

		d. Creating Custom Components
		e. Template Methods
		f. Which Class To Extend