Application structure - jasperjs/jasper-application GitHub Wiki

Jasper is a tiny framework that wraps AngularJS to provide component approach for creating rich JavaScript applications.

Jasper hides following deprecated AngularJS API:

  1. directive definition object
  2. $scope
  3. ng-controller, ng-include...
  4. jqLite
  5. modules

Jasper application consists of the following units:

Component - a custom HTML element that encapsulates its own template and behaviour.

<my-button text="Press me" type="danger"></my-button>

Read more about components

Decorator component - a custom HTML attribute that adds functionality to an HTML element. For instance, it may be an attribute that puts selection to the contents of an input element when it gains focus:

<input type="text" select-on-focus />

Read more about decorators

Service - a class that encapsulates some application logic. For instance, a service may call remove APIs or do some calculations.

Read more about services

Filter - an AngularJS filter. Filters are commonly used to format values in templates. For instance, formatting a number as price:

<p>
  {{cart.total | price}}
</p>

Read more about filters

Page - a component that represents an application page with its own route and a code-behind file. At the build time the grunt-jasper task registers a page as a component and adds a route to JasperRouteProvider.

Read more about pages

Area - a subset of the components listed above which can be loaded asynchronously at runtime. Areas are used to split large applications into parts and load them on demand.

Read more about areas

⚠️ **GitHub.com Fallback** ⚠️