Как интерфейсный разработчик в AltSchool я помогаю создавать веб-программы для преподавателей, студентов, родителей и внутренних пользователей. С EmberConf 2016 меня вдохновляют другие люди, делящиеся своим опытом, поэтому я пишу серию сообщений о том, как мы используем Ember в AltSchool: что мы с ним делаем, что в нем хорошего, где мы боролись, и чему мы научились за последние три с половиной года.

AltSchool - это одновременно технологический стартап и сеть небольших школ. У нас есть новый подход к созданию и ведению школ, основанный на индивидуальной индивидуальной настройке каждого учащегося. Для достижения нашей цели - дать возможность всем детям полностью раскрыть свой потенциал мы создаем операционную систему для школ 21 века: включая программное обеспечение, базу знаний, рекомендуемые учебные программы и многое другое.

Нашими пользователями являются ученики, которые ежедневно упорно трудятся в классе, учителя, которые создают уроки и следят за успеваемостью учеников, а также родители, которые следят за образованием своего ребенка и общаются с учителями. Мы создали полдюжины приложений Ember для этих трех очень разных сценариев использования.

Наши приложения

  • Наше самое большое приложение включает в себя различные поверхности для учеников, учителей и родителей. Все, от визуализации усвоения учеником концепций математики в K-12 до списка заданий ученика и пользовательского интерфейса для планирования пропусков занятий. Это приложение имеет 131 маршрут, 777 js файлов в каталоге приложения и более тысячи автоматических тестов. За последний год мы обновили его до ember-cli и 1.13 с ember 1.10, что привело к повышению производительности рендеринга, и теперь мы почти готовы к Ember 2.0.

  • Недавно мы добавили новое приложение для общения с родителями. Написанный с самого начала на Ember 1.13, он имеет 8 маршрутов, 290 автоматических тестов и 114 файлов js в `app /`. Приложение модернизирует общение между учителями и родителями; вместо распечатанных бланков разрешений и табелей успеваемости родители видят в социальных сетях сообщения учителей с фактическими работами учеников. Это было наше первое приложение, в котором использовались поды, и в нем широко используются компоненты, а не десятки маршрутов.
  • Внутреннее приложение для управления приемом. Он довольно большой, с 32 маршрутами. Наша приемная группа использует это специально созданное приложение для управления всем рабочим процессом, начиная с первоначального приложения студента, заканчивая составлением класса и принятием зачисления. Это приложение очень интенсивно используют опытные пользователи, а это означает, что пользовательский интерфейс не должен быть самоочевидным, но он должен быть достаточно мощным, чтобы поддерживать сложные рабочие процессы.
  • Мобильное приложение для учета посещаемости. Соблюдение точной посещаемости имеет решающее значение для безопасности наших студентов и должно эффективно работать, несмотря на то, что на обочине дороги нет связи; это проблема, над которой команда продолжает бороться, но мы рады использовать сервис-воркеров или операционные преобразования для ее решения.
  • Мобильное приложение, которое позволяет учителям создавать новые занятия для учащихся и прикреплять документацию к существующим занятиям со своих телефонов. Этот супер-крутой; это приложение Ember 2.2, поставляемое на телефоны учителей в виде гибридного приложения Cordova с плагинами для аутентификации, отчетов об ошибках и взаимодействия с собственными компонентами.

Чтобы разделить код между этими приложениями, мы написали несколько надстроек:

Карточка - основная единица работы студента; это может быть задание написать эссе, инструкция по выполнению упражнения на внешнем веб-сайте или представление учебной экскурсии. В этом единственном компоненте фактически используется пять подкомпонентов, поэтому возникают проблемы с производительностью, когда у нас есть пятьдесят из них на странице. Мы очень хотим перейти на Glimmer 2, чтобы воспользоваться его улучшенной производительностью рендеринга для приложений с большим количеством компонентов.

  • Общие модели. Мы попали в один и тот же бэкэнд Django из всех наших интерфейсов, поэтому мы переместили объявления DS.Model в общий репозиторий. Сюда также входят адаптеры и сериализаторы. Наши общие модели построены на шаблоне ресурсов RESTful, поддерживаемом ember-data, и мы расширили этот шаблон, чтобы поддерживать динамическую загрузку и фильтрацию нашего графа ресурсов. Ознакомьтесь с нашей серверной библиотекой с открытым исходным кодом.
  • ember-query-expressions: библиотека для составления и кеширования пользовательских запросов для нашей серверной части. Это прекрасно работает с динамическим REST и общими моделями.
  • Помощники тестирования. Мы очень хорошо научились писать приемочные тесты - вероятно, потому, что написали их слишком много, - поэтому мы сделали надстройку, чтобы поделиться своими любимыми помощниками тестирования. Самый важный, setupUser, создает большой набор связанных фикстур, представляющих согласованное состояние базы данных. В новом коде мы не так сильно полагаемся на фикстуры, но эта работа еще не завершена.
  • table-view: учителям нужны журналы успеваемости, верно? Наша надстройка табличного представления началась как эффективный способ отображения табличных данных с общим стилем и настраиваемыми типами ячеек. С помощью Glimmer мы смогли отказаться от оптимизации производительности, но сохранить производительность. Теперь это полезный стандартный подход к построению табличных дисплеев, сочетающий стиль и поведение.
  • Общая библиотека аналитики: вложенный шаблон маршрута в Ember означает, что ни один сайт вызова не имеет доступа ко всему состоянию приложения. Наша библиотека ember-as-analytics накапливает состояние приложения с уровней иерархии маршрутов (включая компоненты), отправляя его в наши аналитические службы. Он также обеспечивает ловушки и идентификацию для анонимных и известных пользователей.

У нас есть десять инженеров, постоянно работающих над приложениями Ember, и около тысячи пользователей, которые полагаются на наши приложения на основе Ember для обучения или выполнения своей работы. В оставшейся части этой серии я расскажу, почему Ember подходит нам, некоторые проблемы, которые у нас были с ним, наши проблемы и триумфы при обновлении, проблемы с производительностью, монорепозиторий и надстройки, а также изменения в нашей стратегии тестирования. по мере того, как мы масштабируемся. Хотите узнать больше? Упомяните @bshine в Твиттере или оставьте комментарий ниже.

Мы нанимаем! Если вы хотите помочь с работой, которую я описал здесь, даже если вы еще не являетесь Emberist, подайте заявку здесь.