EmberJS - Core Concepts

Ember.js has the following core concepts −

• Router
• Templates
• Models
• Components

Router and Route Handlers

The URL loads the app by entering the URL in the address bar and user will click a link within the app. The Ember uses the router to map the URL to a route handler. The router matches the existing URL to the route which is then used for loading data, displaying the templates and setting up an application state.

The Route handler performs the following actions −

• It provides the template.

• It defines the model that will be accessible to the template.

• If there is no permission for the user to visit a particular part of the app, then the router will redirect to a new route.

Templates

Templates are powerful UI for the end-users. Ember template provides user interface look of an application which uses the syntax of Handlebars templates. It builds the front-end application, which is like the regular HTML. It also supports the regular expression and dynamically updates the expression.

Model

The route handlers render the model that persists information to the web server. It manipulates the data stored in the database. The model is the simple class that extends the functionality of the Ember Data. Ember Data is a library that is tightly coupled with Ember.js to manipulate with the data stored in the database.

Components

The component controls the user interface behavior which includes two parts −

• a template which is written in JavaScript

• a source file which is written in JavaScript that provides behavior of the components.