Добро пожаловать во вторую часть этой серии обзоров курса Pluralsight Основы Аурелии Брайана Нойеса.
Брайан является техническим директором и архитектором в Solliance, экспертной компании по разработке технологических решений.
Брайан — региональный директор Microsoft и MVP, он специализируется на многофункциональных клиентских технологиях, а также на создании поддерживающих их сервисов с помощью WCF и веб-API ASP.NET.
Вы можете следить за Брайаном через его блог на http://briannoyes.net.
Обзор Аурелии
Брайан описывает Aurelia как платформу для создания слабосвязанных, удобных в сопровождении и хорошо структурированных одностраничных приложений.
Он обсуждает, как Aurelia сравнима с другими фреймворками JavaScript, говоря, что ее ближайшим родственником является Durandal.
Он также обсуждает Angular 1.x, говоря, что это хороший фреймворк, но с некоторыми недостатками.
Эти недостатки являются одной из причин, по которым команда использовала разные подходы при разработке Angular 2.
Брайан говорит, что есть и другие популярные фреймворки: Ember, Backbone, Knockout и React. Из них только Эмбер так же всеобъемлющ, как Аурелия (хотя это означает, что остальные меньше по размеру). Он также добавляет, что если вы хотите, вы можете использовать React в качестве шаблона для шаблонов Aurelia по умолчанию и привязки данных.
Помимо этого модуля курса существует руководство Начало работы, написанное Робом Айзенбергом. Здесь есть ссылки для загрузки настроенной Aurelia для ES 2016 или настроенной для TypeScript Aurelia.
Совместимость с браузером
Брайан говорит, что Aurelia предназначена для вечнозеленых браузеров.
Для получения информации о том, как Aurelia работает с гибридной мобильной разработкой, см. aurelia-interface-update.
Особенности Аурелии
Узнаем о следующих особенностях:
- Модульная архитектура
- Внедрение зависимости
- Двусторонняя привязка данных
- Состав пользовательского интерфейса (MVVM)
- Маршрутизация/навигация
- Очереди задач
- Паб-подписка
- HTML-шаблоны
- Пользовательские элементы
- Пользовательские атрибуты
- логирование
Создание приложения Hello Aurelia с нуля
Приложение Hello World с использованием Express JS, Babel, Aurelia-Bootsraper и Bootstrap.
Мы видим два метода привязки данных к нашему представлению html: литералы шаблонов и .bind.
Экскурсия по процессу начальной загрузки Aurelia
Здесь обсуждается концепция соглашения о конфигурации.
Одним из таких соглашений является загрузка модуля с именем «приложение».
Мы видим, что aurelia-bootstrapper.js — это транспилированный код ES5.
Чтобы найти исходный код, Брайан заходит на github.com/aurelia, где есть отдельный проект для каждого модуля, созданного командой Aurelia, и просматривает код index.js.
Вот официальный readme aurelia-bootstrapper.
Настройка запуска приложения
Брайан пишет метод configure в main.js. Этот модуль импортирует LogManager и ConsoleAppender, а демонстрация просто записывает отладочные сообщения в консоль.
Мы также видим, как загрузить имя, отличное от app, указав желаемое имя в setRoot.
Использование стартового приложения Aurelia для скелетной навигации
Мы хотим иметь возможность:
- Сборка приложения, выполнение переноса кода во время разработки
- Используйте LESS или SASS и скомпилируйте его в CSS
- Запуск тестов, как модульных, так и сквозных
- Подавать код и иметь возможность его отлаживать
Все это мы можем сделать довольно легко, используя стартовый набор Aurelia skeleton-navigation.
Брайан устанавливает Gulp, Yeoman и генератор-аурелию Вилдана Софтика.
Тогда проект тривиально построить:
сборка глотком
Мы видим, что у нас есть новый каталог dist, содержащий наш транспилированный код.
Мы видим, что демо-приложение имеет ту же функциональность, что Роб продемонстрировал на NDC Oslo, когда сравнил 6 популярных фреймворков JavaScript.
Он также имеет функции для навигации по разным страницам, включая вложенную навигацию.
Еще одна полезная команда:
проглотить e2e
Это запускает все наши сквозные тесты.