Ember.js: Difference between revisions

From 탱이의 잡동사니
Jump to navigation Jump to search
No edit summary
No edit summary
Line 2: Line 2:
Ember.js 내용 정리.
Ember.js 내용 정리.


== Directory structure ==
== Basic ==
=== Directory structure ===
* app  
* app  
: This is where folders and files for models, components, routes, templates and styles are stored. The majority of your coding on an Ember project happens in this folder.
: This is where folders and files for models, components, routes, templates and styles are stored. The majority of your coding on an Ember project happens in this folder.
Line 23: Line 24:
* ember-cli-build.js
* ember-cli-build.js
: This file describes how Ember CLI should build our app.
: This file describes how Ember CLI should build our app.
=== ES6 Modules ===
<source lang=javascript>
import EmberRouter from '@ember/routing/router';
import config from './config/environment';
const Router = EmberRouter.extend({
  location: config.locationType,
  rootURL: config.rootURL
});
Router.map(function() {
});
export default Router;
</source>
Ember CLI uses ECMAScript 2015(ES2015 for short or previously known as ES6) modules to organize application code. For example, the line import EmberRouter from '@ember/routing/router'; gives us access to Ember's Router class as the variable EmberRouter. And the import config from './config/environment'; line gives us access to our configuration data as the variable config. const is a way to declare a read-only variable to make sure it is not accidentally reaasigned elsewhere. At the end of the file, export default Router; makes the Router variable defined in this file available to other parts of the app.


[[category:programming]]
[[category:programming]]

Revision as of 00:22, 26 December 2017

Overview

Ember.js 내용 정리.

Basic

Directory structure

  • app
This is where folders and files for models, components, routes, templates and styles are stored. The majority of your coding on an Ember project happens in this folder.
  • config
The config directory contains the environment.js where you can configure settings for your app.
  • node_modules / package.json
This directory and file are from npm. npm is the package manager for Node.js. Ember is build with Node and uses a variety of Node.js modules for operation. The package.json file maintains the list of current pm dependencies for the app. Any Ember CLI addons you install will also show up here. Packages listed in package.json are installed in the node_modules directory.
  • public
This directory contains assets such as images and fonts.
  • vendeor
This directory is where front-end dependencies(such as JavaScript or CSS) that are not managed by Bower go.
  • tests / testem.js
Automated tests for our app go in the tests folder, and Ember CLI's test runner testem is configured in testem.js.
  • ember-cli-build.js
This file describes how Ember CLI should build our app.

ES6 Modules

<source lang=javascript> import EmberRouter from '@ember/routing/router'; import config from './config/environment';

const Router = EmberRouter.extend({

 location: config.locationType,
 rootURL: config.rootURL

});

Router.map(function() { });

export default Router; </source> Ember CLI uses ECMAScript 2015(ES2015 for short or previously known as ES6) modules to organize application code. For example, the line import EmberRouter from '@ember/routing/router'; gives us access to Ember's Router class as the variable EmberRouter. And the import config from './config/environment'; line gives us access to our configuration data as the variable config. const is a way to declare a read-only variable to make sure it is not accidentally reaasigned elsewhere. At the end of the file, export default Router; makes the Router variable defined in this file available to other parts of the app.