Găsiți următorul dvs. carte preferat

Deveniți un membru astăzi și citiți gratuit pentru 30 zile
Learning Aurelia

Learning Aurelia

Citiți previzualizarea

Learning Aurelia

Lungime:
950 pages
5 hours
Lansat:
Dec 26, 2016
ISBN:
9781785881183
Format:
Carte

Descriere

This book is for JavaScript developers who want to build modern web apps with Aurelia. No prior knowledge of Aurelia is needed.
Lansat:
Dec 26, 2016
ISBN:
9781785881183
Format:
Carte

Despre autor


Legat de Learning Aurelia

Cărți conex
Articole conexe

Previzualizare carte

Learning Aurelia - Manuel Guilbault

Table of Contents

Learning Aurelia

Credits

About the Author

About the Reviewer

www.PacktPub.com

Why subscribe?

Customer Feedback

Preface

What this book covers 

What you need for this book 

Who this book is for 

Conventions 

Reader feedback

Customer support

Downloading the example code 

Errata

Piracy

Questions

1. Getting Started

Terminology

Core concepts

Conventions

Components

Architecture

Core features

Abstraction layers

Default implementations

Integration layers

Additional tools and plugins

Tooling

Node.js and NPM

The Aurelia CLI

Installing the CLI

The project skeletons

Our application

The structure of a CLI-based project

The aurelia.json file

Tasks

Generators

Environments

The structure of an Aurelia application

The hosting page

The main module

The root component

Conventional bootstrapping

Customizing Aurelia configuration

Summary

2. Layout, Menu, and Getting Familiar

Dependency injection

The inject decorator

TypeScript and autoinject

The static inject method or property

Root and child containers

Resolving an instance

Lifetime

Registration

The container registration API

Automatic registration

Registration strategies

Creating a custom registration strategy

Resolvers

Lazy

All

Optional

Parent

Factory

NewInstance

The plugin system

Plugins

An example

Registering global resources

Features

Logging

Configuration

Default configuration

An appender

Writing logs

Routing

Configuring the router

Declaring routes

Redirection route

Navigation strategies

Laying out our application

Trying it out

The screen activation life cycle

Navigation commands

Handling unknown routes

Conventional routing

Activation strategies

Child routers

Pipelines

Events

Multiple viewports

Push state versus hash change

Generating URLs

In code

In views

Navigating

Summary

3. Displaying Data

Templating basics

View resources

Locally loading resources

Resource types

Loading CSS

Data binding

Binding modes

String interpolation

Data binding commands

bind

One-way

Two-way

One-time

trigger

delegate

call

ref

Binding literals

Using built-in binding context properties

Binding to DOM properties

innerhtml

textcontent

style

scrolltop

scrollleft

Using built-in behaviors

show

hide

if

repeat.for

Binding to a map

Repeat n times

Repeating templating

Contextual variables

The with attribute

The focus attribute

The compose element

Rendering a view-model

Passing activation data

Rendering a template

Value converters

Using value converters

Passing a parameter

Passing multiple parameters

Passing context variables as parameters

Chaining

Implementing a value converter

Binding behaviors

Using binding behaviors

Passing parameters

Built-in binding behaviors

oneTime

throttle

debounce

updateTrigger

signal

Computed properties

computedFrom

Fetching data from an endpoint

The Fetch API

Using the Fetch client

Configuration

A common pitfall

Interceptors

Our application

Our contact gateway

Prerequisites

Displaying the contacts

Grouping and sorting the contacts

Creating the orderBy value converter

Creating the groupBy value converter

Updating the contact list

Filtering contacts

The contact detailed view

The view-model

The template

Summary

4. Forms, and How to Validate Them

Binding to form inputs

select elements

Multi-selection

Matchers

input elements

File pickers

Radio buttons

Checkboxes

textarea

Disabling an element

Making an element read-only

Adding forms to our application

Adding new routes

Adding links to the new routes

Updating models

Creating the form component

Activating the view-model

Building the form layout

Editing scalar properties

Editing phone numbers

Adding the missing method

Editing the other lists

Saving and canceling

Sending data with fetch

Uploading a contact's photo

Building the template

Creating the view-model

Uploading files with fetch

Deleting a contact

Validation

Installing the library

Configuration

Validating the contact form

Setting up the template

Using ValidationController

Adding ValidationRules

Rendering validation errors

The errors property

The validation-errors attribute

Creating a custom ValidationRenderer

Changing the validation trigger

Creating custom ValidationRules

Validating a date

Validating that files are selected

Validating the size of files

Validating file extensions

Validating the contact photo selector

Editing complex structures

Installing the dialog plugin

Creating the edition dialogs

Using edition dialogs

Summary

5. Making Reusable Components

Composition

Splitting the contact edition component

Reusing templates

Reusing components

Using a template as a custom element

Understanding HTML behaviors

Injecting the DOM element

Declaring bindable properties

Change handler methods

Life cycle

Custom attributes

Declaring a custom attribute

Attributes with a single value

Adding an image preview

Adding a file drop target

Attributes with multiple properties

Using a custom attribute with multiple properties

Attributes with dynamic properties

Using a custom attribute with dynamic properties

Custom elements

Declaring a custom element

Creating a file picker

Declaring the custom element

Using the custom element

Validating custom elements

Surrogate behaviors

Content projection

The default slot

Named slots

Data-binding projected content

Default content

Slots in slots

Mixing named slots with a default slot

Slot-ception

Limitations

Template injection

Creating a group list

Using the group list

Default template part

Re-scoping binding context

Creating a list editor

Using the list editor

Using the customization decorators

viewResources

useView

inlineView

noView

useViewStrategy

processAttributes

processContent

containerless

useShadowDOM

children

child

Bonus – preventing multiple submits

Creating the submit task attribute

Using the submit task attribute

Creating the submit button

Using the submit button

Customizing the view location strategy

Changing the convention itself

Changing the strategy for a single component

Summary

6. Design Concerns - Organizing and Decoupling

Re-organizing our application

Refactoring the structure

Breaking the models down

Isolating the gateway

Grouping the components

There is no silver bullet

Leveraging child routers

Changing the root routes

Configuring the contacts child router

Implications

Declaring root routes in a feature

Creating the feature

Changing the root routes

Reducing coupling on the feature

Implications

Why not both?

Decoupling components

Using data binding

Using remote services

Using events

The event aggregator

Extending an object with events

Using event classes

Creating an interactive connection

Adding notifications

Getting out of the pitfall

Simulating a multi-user scenario

Using shared services

Creating an in-memory store

Using the store

Summary

7. Test All the Things

Unit tests

Running unit tests

Configuring validation

Configuring Bluebird warnings

Unit-testing models

Testing static factory methods

Testing computed properties

Unit-testing services

Removing configuration from the gateway constructor

Testing read methods

Testing write methods

Unit-testing value converters

Unit-testing custom elements and attributes

The component tester

Testing the file-drop-target attribute

Testing the list-editor element

Unit-testing route components

End-to-end tests

Setting things up

Mocking the backend

The page object pattern

Writing a first test case

Running tests

Testing the contacts list

Testing contact creation

Further testing

Summary

8. Internationalization

Setting things up

Installing the libraries

Configuring the plugin

Creating the translation file

Polyfilling the Intl API

Getting and setting the current locale

Translating

Using attributes

Passing parameters

Using the value converter

Passing parameters

Using the binding behavior

Passing parameters

Using code

Choosing one technique over another

Formatting numbers

Using the value converter

Using the binding behavior

Using code

Formatting dates

Using the value converter

Using the binding behavior

Using code

Formatting relative time

Using the value converter

Periodically refreshing the value

Using code

Translating our contact management application

Integrating with validation

Overriding ValidationMessageProvider

Adding the translations

Refreshing validation errors

Integrating with the Router

Segregating translations by feature

Summary

9. Animations

The Animator API

The CSS animator

Installing the plugin

Animating view transitions

Animating the list-editor

Manually triggering an animation

Emphasizing validation errors

Animating route transitions

Swap order

Summary

10. Bundling for Production

Configuring bundles

Merging the application in a single bundle

Splitting the application into multiple bundles

Versioning bundles

Deploying the application

Summary

11. Integrating with Other Libraries

Using Bootstrap widgets

Loading the library

Creating a bs-tooltip attribute

Using the attribute

Creating a bs-datepicker element

Installing the bootstrap-datepicker plugin

Creating the custom element

Using the element

Internationalizing the bs-datepicker element

Reconfiguring bundling of jQuery and Bootstrap

Updating the element

Using jQuery UI widgets

Installing the libraries

Creating a jq-tooltip attribute

Using SASS instead of CSS

Replacing CSS with SASS

Dragging and dropping with sortable

Installing the library

Adding drag and drop to list-editor

Drawing graphs with D3

Installing the library

Prepping the application

Creating the contact-address-tree custom element

Using Polymer components

Installing the libraries

Configuring the application

Displaying a Google map

Geocoding addresses

Displaying a marker

Summary

A. Using JSPM

Getting started

Running tasks

Running unit tests

Running end-to-end tests

Adding libraries

Bundling

Configuring bundles

Summary

B. Using Webpack

Getting started

Running tasks

Adding libraries

Bundling

Lazy-loading bundles

Environment-based configuration

Summary

Learning Aurelia


Learning Aurelia

Copyright © 2016 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author(s), nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: December 2016

Production reference: 1221216

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham 

B3 2PB, UK.

ISBN 978-1-78588-967-7

www.packtpub.com

Credits

About the Author

Manuel Guilbault is a Canadian-born, France-based developer, and works as the CTO of an online marketing startup. After studying software engineering in Montreal, he worked as a full-stack web developer for well-known clients in the press industry, automotive industry, and financial sector for 10 years.

An Aurelia enthusiast since day one, he closely followed the development of the framework, while modestly contributing to it and blogging and talking about it. He is an active member of the Paris Aurelia meetup group.

Passionate about software craftsmanship, agility, and lean principles, he loves to learn and debate about how we do things, why we do them this way, and how they can be improved.

I’d like to thank my friends and family for their tremendous support and enthusiasm for this project. Kudos to Geoffrey for his patience, for all the times I let him handle business issues so I could work on this book, and to Frank for the review and advice. Lastly, my gratitude to my wife, Caroline, who lovingly went through the countless weekends during which I researched and wrote instead of spending time with her.

About the Reviewer

Matthew James Davis is a friendly guy who loves his family and enjoys writing exceptional code. He has been involved with Aurelia since its inception and regularly writes Aurelia-related blogs on his website, http://davismj.me/.

I’d like to thank my two mentors in the software world: Brian Hearn and Rob Eisenberg.

www.PacktPub.com

For support files and downloads related to your book, please visit www.PacktPub.com.

Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.PacktPub.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at service@packtpub.com for more details.

At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.

https://www.packtpub.com/mapt

Get the most in-demand software skills with Mapt. Mapt gives you full access to all Packt books and video courses, as well as industry-leading tools to help you plan your personal development and advance your career.

Why subscribe?

Fully searchable across every book published by Packt

Copy and paste, print, and bookmark content

On demand and accessible via a web browser

Customer Feedback

Thank you for purchasing this Packt book. We take our commitment to improving our content and products to meet your needs seriously—that's why your feedback is so valuable. Whatever your feelings about your purchase, please consider leaving a review on this book's Amazon page. Not only will this help us, more importantly it will also help others in the community to make an informed decision about the resources that they invest in to learn. You can also review for us on a regular basis by joining our reviewers' club. If you're interested in joining, or would like to learn more about the benefits we offer, please contact us: customerreviews@packtpub.com.

Preface

The Web evolves very quickly. Technologies come and go, and every couple of years, new ideas emerge and become widely popular, only to be replaced by something else after a while.

If you’ve been doing web development for many years, chances are you’ve seen this cycle go on. Things such as Prototype, and then jQuery, were widely popular in the mid-2000s, and are still used on many projects nowadays.

Then, with the performance of browsers and JavaScript engines getting better and better, the last decade or so have seen the emergence of many full-blown, JavaScript-based frontend frameworks such as Angular and Durandal. More recently, modern frameworks based on different concepts or paradigms such as React and Polymer have gained a lot of popularity.

Aurelia is such a modern framework. The brainchild of Rob Eisenberg, the father of Durandal, it is based on cutting edge Web standards, and is built on modern software architecture concepts and ideas, to offer a powerful toolset and an awesome developer experience.

What this book covers 

Chapter 1, Getting Started, walks you through the basic concepts around Aurelia, and explains how to set up your environment and start a project.

Chapter 2, Layout, Menu, and Getting Familiar, goes further into the concepts at the core of Aurelia, such as dependency injection, logging, and the plugin system. It also explains how to create the main layout and navigation menu of a multi-paged application.

Chapter 3, Displaying Data, guides you through the templating and data-binding system, so you can build complex views.

Chapter 4, Forms, and How to Validate Them, builds on the previous chapter by showing how to build rich forms and how to use Aurelia’s flexible and powerful validation mechanism. It also explores different edition models, such as inline edition or dialog-based edition.

Chapter 5, Making Reusable Components, shows you how to build reusable Aurelia components, such as custom HTML elements and attributes. It also explains how to leverage some cutting edge Web Standards supported by Aurelia, such as the Shadow DOM and content projection.

Chapter 6, Design Concerns – Organizing and Decoupling, walks you through different ways to organize and structure an Aurelia application. It also discusses various techniques to manage communication between decoupled components.

Chapter 7, Test All the Things, teaches you how to write and run automated tests for an Aurelia application, with both unit and end-to-end tests.

Chapter 8, Internationalization, shows you how to internationalize texts and the format of various data types, such as dates and numbers.

Chapter 9, Animations, teaches you how to animate view transitions using CSS, and introduces the general animation API, so you can use richer animation plugins.

Chapter 10, Bundling for Production, shows you how to optimize for production by packaging your application in one or multiple bundles.

Chapter 11, Integrating with Other Libraries, gives examples of how you can integrate various UI libraries into your application, such as Bootstrap widgets, jQuery UI, D3, and Polymer components.

Appendix A, Using JSPM, shows you how to develop, build, and bundle an Aurelia application using SystemJS and JSPM.

Appendix B, Using Webpack, shows you how to develop, build, and bundle an Aurelia application using Webpack.

What you need for this book 

For maximum enjoyment, you will need a PC/laptop running Windows, Linux, or Mac OS X, an Internet connection, and a modern browser. All the code samples were developed and tested using Google Chrome; as such, it is the recommended browser.

All software mentioned in this book is free of charge and can be downloaded from the Internet.

Who this book is for 

This book is for all developers, either keen to learn to build single-page applications using Aurelia, or simply curious about the framework. Some knowledge of JavaScript is ideal to follow the book; however, if you’re new to JS, you’ll pick up most of the basics along the way.

Conventions 

In this book, you will find a number of text styles that distinguish between different kinds of information. Here are some examples of these styles and an explanation of their meaning.

Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: As such, in the aurelia_project/aurelia.json file, in the build section, under bundles, let's add the following entries to the dependencies of the bundle named vendor-bundle.js:

A block of code is set as follows:

{

  name: aurelia-i18n,

  path: ../node_modules/aurelia-i18n/dist/amd,

  main: aurelia-i18n

},

{

  name: i18next,

  path: ../node_modules/i18next/dist/umd,

  main: i18next

},

{

  name: i18next-xhr-backend,

  path: ../node_modules/i18next-xhr-backend/dist/umd,

  main: i18nextXHRBackend

},

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

 

t=404.title>

 

t=404.explanation>

Any command-line input or output is written as follows:

> npm install aurelia-i18n i18next --save

New terms and important words are shown in bold. Words that you see on the screen, for example, in menus or dialog boxes, appear in the text like this: At this point, if you run the application, click the New button and, for example, put gibberish in the Birthday textbox then try to save.

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or disliked. Reader feedback is important for us as it helps us develop titles that you will really get the most out of.

To send us general feedback, simply e-mail feedback@packtpub.com, and mention the book's title in the subject of your message.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide at www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Downloading the example code 

You can download the example code files from your account at http://www.packtpub.com for all the Packt Publishing books you have purchased. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support  and register to have the files e-mailed directly to you.

You can download the code files by following these steps:

Log in or register to our website using your e-mail address and password.

Hover the mouse pointer on the SUPPORT tab at the top.

Click on Code Downloads & Errata.

Enter the name of the book in the Search box.

Select the book for which you're looking to download the code files.

Choose from the drop-down menu where you purchased this book from.

Click on Code Download.

You can also download the code files by clicking on the Code Files button on the book's webpage at the Packt Publishing website. This page can be accessed by entering the book's name in the Search box. Please note that you need to be logged in to your Packt account.

Once the file is downloaded, please make sure that you unzip or extract the folder using the latest version of:

WinRAR / 7-Zip for Windows

Zipeg / iZip / UnRarX for Mac

7-Zip / PeaZip for Linux

The code bundle for the book is also hosted on GitHub at https://github.com/PacktPublishing/Learning-Aurelia. We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you could report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/submit-errata, selecting your book, clicking on the Errata Submission Form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded to our website or added to any list of existing errata under the Errata section of that title.

To view the previously submitted errata, go to https://www.packtpub.com/books/content/support and enter the name of the book in the search field. The required information will appear under the Errata section.

Piracy

Piracy of copyrighted material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works in any form on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at copyright@packtpub.com with a link to the suspected pirated material.

We appreciate your help in protecting our authors and our ability to bring you valuable content.

Questions

If you have a problem with any aspect of this book, you can contact us at questions@packtpub.com, and we will do our best to address the problem.

Chapter 1. Getting Started

Developer experience is a key strength of Aurelia. Its authors paid careful attention to every aspect of the development process, so using the framework is seamless and fluid, and so the learning curve is as smooth as possible.

This book humbly attempts to follow the same philosophy. It will teach you how you can use Aurelia to build real-world applications from A to Z. In fact, while reading the book and following the code samples, that's exactly what you will do. You will start by setting up your development environment and creating the project, then I will walk you through concepts such as routing, templating, data binding, automated testing, internationalization, and bundling. We will discuss application design, communication between components, and integration of third parties. We will cover every topic most modern, real-world single-page applications require.

In this first chapter, we will start by defining some terms that will be used throughout the book. We will quickly cover some core Aurelia concepts. Then we will take a look at the core Aurelia libraries and see how they interact with each other to form a complete, full-featured framework. We will see also what tools are needed to develop an Aurelia application and how to install them. Finally, we will start creating our application and explore its global structure.

Terminology

As this book is about a JavaScript framework, JavaScript plays a central role in it. If you are not completely up-to-date with the terminology, which has changed a lot in the last few years, let me clear a few things up.

JavaScript (or JS) is a dialect, or implementation, of the ECMAScript (ES) standard. It is not the only implementation, but it is definitely the most popular. In this book, I will use the JS acronym to talk about actual JavaScript code or code files and the ES acronym when talking about an actual version of the ECMAScript standard.

Like everything in computer programing, the ECMAScript standard evolves over time. At the time of writing, the latest version is ES2016 and was published in June 2016. It was originally called ES7, but TC39, the committee drafting the specification, decided to change their approval and naming model, hence the new name.

The previous version, named ES2015 (ES6) before the naming model changed, was published in June 2015 and was a big step forward as compared to the version before it. This older version, named ES5, was published in 2009 and was the most recent version for six years, so it is now widely supported by all modern browsers. If you have been writing JavaScript in the last five years, you should be familiar with ES5.

When they decided to change the ES naming model, the TC39 committee also chose to change the specification's approval model. This decision was made in an effort to publish new versions of the language at a quicker pace. As such, new features are being drafted and discussed by the community, and must pass through an approval process. Each year, a new version of the specification will be released, comprising the features that were approved during the year.

Those upcoming features are often referred as ESNext. This term encompasses language features that are approved or at least pretty close to approval but not yet published. It can be reasonable to expect that most or at least some of those features will be published in the next language version.

As ES2015 and ES2016 are still recent versions, they are not fully supported by most browsers. Moreover, ESNext features have typically no browser support at all.

Those multiple names can be pretty confusing. To make things simpler, I will stick with the official names ES5 for the previous version, ES2016 for the current version and ESNext for the next version. But that's only my preference; in the following chapters, we may encounter some tools or libraries still using the original nomenclature.

Before going any further, you should make yourself familiar with the features introduced by ES2016 and with ESNext decorators, if you are not already. We will use these features throughout the book.

Note

If you don't know where to start with ES2015 and ES2016, you can find a great overview of the new features on Babel's website:

https://babeljs.io/docs/learn-es2015/

As for ESNext decorators, Addy Osmani, a Google engineer, explained them pretty well:

https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841

For further reading, you can take a look at the feature proposals (decorators, class property declarations, async functions, and so on) for future ES versions:

https://github.com/tc39/proposals

Core concepts

Before we start getting our hands dirty, there are a couple of core concepts that need to be explained.

Conventions

First, Aurelia relies a lot on conventions. Most of those conventions are configurable, and can be changed if they don't suit your needs. Each time we'll encounter a convention throughout the book, we will see how to change it whenever possible.

Components

Components are a first class citizen of Aurelia. What is an Aurelia component? It is a pair made of an HTML template, called the view, and a JavaScript class, called the view-model. The view is responsible for displaying the component, while the view-model controls its data and behavior. Typically, the view sits in an .html file and the view-model in a .js file. By convention, those two files are bound through a naming rule, they must be in the same directory and have the same name (except for their extension, of course).

Here's an example of an empty component with no data, no behavior, and a static template:

component.js

export class MyComponent {}

component.html

 

My component

A component must comply with two constraints, a view's root HTML element must be the template element, and the view-model class must be exported from the .js file. As a rule of thumb, the only function that should be exported by a component's JS file should be the view-model class. If multiple classes or functions are exported, Aurelia will iterate on the file's exported functions and classes and will use the first it finds as the view-model. However, since the enumeration order of an object's keys is not deterministic as per the ES specification, nothing guarantees that the exports will be iterated in the same order they were declared, so Aurelia may pick the wrong class as the component's view-model.

The only exception to that rule is some view resources which we'll see in Chapter 3, Displaying Data, and Chapter 5, Making Reusable Components. In addition to its view-model class, a component's JS file can export things like value converters, binding behaviors, and custom attributes basically any view resource that can't have a view, which excludes custom elements.

Components are the main building blocks of an Aurelia application. Components can use other components; they can be composed to form bigger or more complex components. Thanks to the slot mechanism, you can design a component's template so parts of it can be replaced or customized. We will see all of this in the next chapters.

Architecture

Aurelia is not your average monolithic framework. It is a set of loosely coupled libraries with well-defined abstractions. Each of its core libraries solves a specific and well-defined problem common to single-page applications. Aurelia leverages dependency injection and a plugin architecture so you can discard parts of the framework and replace them with third-party or even your own implementations. Or you can just throw away features you don't need so your application is lighter and faster to load. We will look deeper into this plugin mechanism in Chapter 2, Layout, Menu, and Getting Familiar.

The core Aurelia libraries can be divided into multiple categories. Let's have a quick glance.

Core features

The following libraries are mostly independent and can be used by themselves if needed. They each provide a focused set of features and are at the core of Aurelia:

aurelia-dependency-injection: A lightweight yet powerful dependency injection container. It supports multiple lifetime management strategies and child containers.

aurelia-logging: A simple logger, supporting log levels and pluggable consumers.

aurelia-event-aggregator: A lightweight message bus, used for decoupled communication.

aurelia-router: A client-side router, supporting static, parameterized or wildcard routes, and child routers.

aurelia-binding: An adaptive and pluggable data-binding library.

aurelia-templating: An extensible HTML templating engine.

Abstraction layers

The following libraries mostly define interfaces and abstractions in order to decouple concerns and enable extensibility and pluggable behaviors. This does not mean that some of the libraries in the previous section do not expose their own abstractions besides their features. Some of them do. But the libraries described in the current section have almost no other purpose than defining abstractions:

aurelia-loader: An abstraction defining an interface for loading JS modules, views, and other resources.

aurelia-history: An abstraction defining an interface for history management used by routing.

aurelia-pal: An abstraction for platform-specific capabilities. It is used to abstract away the platform on which the code is running, such as a browser or Node.js. Indeed, this means that some Aurelia libraries can be used on the server side.

Default implementations

The following libraries are the default implementations of abstractions exposed by libraries from the two previous sections:

aurelia-loader-default: An implementation of the aurelia-loader abstraction for SystemJS and require-based loaders.

aurelia-history-browser: An implementation of the aurelia-history abstraction based on standard browser hash change and push state mechanisms.

aurelia-pal-browser: An implementation of the aurelia-pal abstraction for the browser.

aurelia-logging-console: An implementation of the aurelia-logging abstraction for the browser console.

Integration layers

The following libraries' purpose is to integrate some of the core libraries together. They provide interface implementations and adapters, along with default configuration or behaviors:

aurelia-templating-router: An integration layer between the aurelia-router and the aurelia-templating libraries.

aurelia-templating-binding: An integration layer between the aurelia-templating and the aurelia-binding libraries.

aurelia-framework: An integration layer that brings together all of the core Aurelia libraries into a full-featured framework.

aurelia-bootstrapper: An integration layer that brings default configuration for aurelia-framework and handles application starting.

Additional tools and plugins

If you take a look at Aurelia's organization page on GitHub at https://github.com/aurelia, you will see many more repositories. The libraries listed in the previous sections are just the core of Aurelia - the tip of the iceberg, if I may. Many other libraries exposing additional features or integrating third-party libraries are available on GitHub, some of them developed and maintained by the Aurelia team, many others by the community. We'll cover some of those additional libraries in further chapters, but I strongly suggest that you explore the Aurelia ecosystem by yourself after reading this book, as it is rapidly growing, and the Aurelia community is doing some very exciting things.

Tooling

In the following section, we will go over the tools needed to

Ați ajuns la sfârșitul acestei previzualizări. Înscrieți-vă pentru a citi mai multe!
Pagina 1 din 1

Recenzii

Ce părere au oamenii despre Learning Aurelia

0
0 evaluări / 0 Recenzii
Ce părere aveți?
Evaluare: 0 din 5 stele

Recenziile cititorilor