AngularJS только для одностраничных приложений (SPA)?

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

Это Node.js проект. Наш первоначальный план состоял в том, чтобы использовать Express и идти по этому пути, но мы решили, что, прежде чем мы начнем этот этап, возможно, было бы лучше рассмотреть, что там. В нашем приложении есть несколько областей, которые, по нашему мнению, не соответствуют одностраничной модели, поскольку они связаны с точки зрения приложения, но не с точки зрения представления.

Мы видели несколько платформ, которые мы могли бы использовать для создания клиента, таких как Backbone.js , Meteor и т. Д., А также AngularJS.

Это может быть довольно очевидным вопросом, но мы не можем расшифровать, если AngularJS предназначен исключительно для одностраничных приложений или может использоваться для многостраничных приложений, таких как, например, Express.

ОБНОВЛЕНИЕ 17 июля 2013 г. Просто чтобы держать людей в курсе, я буду обновлять этот вопрос по мере прохождения процесса. Сейчас мы собираемся все строить вместе и увидим, насколько хорошо это работает. Мы обратились к нескольким людям, которые более квалифицированы в AngularJS, чем мы, и поставили вопрос о разделении более крупных приложений, которые имеют общий контекст, но могут быть слишком большими, работая на одной странице.

Было решено, что мы сможем обслуживать несколько статических страниц и создавать приложения AngularJS, которые работают только с этими страницами, эффективно создавая набор SPA и связывая эти приложения вместе, используя стандартные ссылки. Теперь наш вариант использования очень специфичен, так как в нашем решении есть несколько приложений, и, как я уже сказал, мы сначала попробуем единую кодовую базу и оттуда оптимизируем.

ОБНОВЛЕНИЕ 18 июня 2016 года Проект упал с обрыва, поэтому мы так и не успели сделать слишком много. Недавно мы снова подняли его, но уже не используем angular и вместо этого используем React. Мы по-прежнему используем архитектуру, описанную в предыдущем обновлении, где мы используем экспресс и автономные приложения, поэтому, например, у нас есть /chatмаршрут в экспрессе, который обслуживает наше приложение чата React, у нас есть другой маршрут, /projectsкоторый обслуживает приложение проектов и скоро. То, как мы смотрим на это, заключается в том, что каждое приложение является совокупным корнем с точки зрения своего набора функций, оно должно быть в состоянии автономно, чтобы его можно было считать приложением само по себе. Технически, вся информация существует, это просто базовый экспресс и все, что вы хотите использовать, на стороне клиента.

Не за что. Вы можете использовать Angular для создания различных приложений. Клиентская маршрутизация - только маленький кусочек этого.

У вас есть большой список функций, которые принесут пользу вам вне маршрутизации на стороне клиента:

• двусторонняя привязка
• шаблонный
• форматирование валюты
• плюрализация
• многоразовые средства управления
• RESTful API-интерфейс
• Обработка AJAX
• модульность
• внедрение зависимости

Безумно думать, что все это «может быть использовано только в одностраничном приложении». Конечно нет .. это все равно что сказать "Jquery только для проектов с анимацией".

Если он подходит вашему проекту, используйте его.

Сначала я тоже боролся с «как» с Angular. Затем однажды меня осенило: «Это по-прежнему JavaScript». Есть множество примеров на входах и выходах в Angular (один из моих любимых вместе с книгой https://github.com/angular-app/angular-app ). Самая важная вещь, которую нужно помнить, это загружать файлы js, как в любом другом проекте. Все, что вам нужно сделать, это убедиться, что разные страницы ссылаются на правильный объект Angular (контроллер, представление и т. Д.), И вы выключены и работаете. Я надеюсь, что это имеет смысл, но ответ был настолько прост, что я упустил его.

Может, мой опыт кому-нибудь пригодится. Мы логически разделили наш проект. Один SPA мы используем для фида, другой для работы с картой, другой для редактирования профиля пользователя и т. Д. Например, у нас есть три приложения: фид, пользователь и карта. Я использую это в разделенных URL, как это:

https://host/feed/#/top/
https://host/user/#/edit/1/
https://host/map/favorites/#/add/

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

Действительно, вы можете очень легко создать смесь приложений SPA, например, канал будет URL-адресом с приложением angularjs, пользовательское приложение сactj и отображаться в приложении backbone.js.

В ответ на ваш вопрос:

Angular не только для SPA, Angular хорошо и быстро работают для приложений SPA, но никто не мешает создавать приложения MPA из множества приложений SPA. Но думая о своей архитектуре URL, не забывайте о доступности ваших приложений в SEO.

Я также поддерживаю идею:

В чем разница между проектом и приложением? Приложение - это веб-приложение, которое что-то делает, например, система Weblog, база данных публичных записей или простое приложение для опроса. Проект - это набор настроек и приложений для определенного веб-сайта. Проект может содержать несколько приложений. Приложение может быть в нескольких проектах.

Если все, что вам нужно, это несколько страниц с привязкой данных клиента, я бы пошел с Knockout и Javascript Namespacing.

Knockout отлично подходит, особенно если вам нужна несложная обратная совместимость и достаточно прямые страницы. Если вы используете сторонние компоненты, пользовательские привязки Knockout просты и с ними легко работать.

Пространство имен Javascript позволяет вам хранить код отдельно и управлять им.

var myCo = myCo || {};
myCo.page = {
    init: function(){ ... },
    ...
}

И в теге скрипта после загрузки других ваших скриптов

<script>
    myCo.init();
</script>

Ключ в том, что вы используете любой инструмент, который вам нужен, когда вам это нужно. Нужна привязка данных? Нокаут (или как угодно). Нужна маршрутизация? sammy.js (или как угодно).

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

Я бы сказал, что Angular - это излишне, если вы просто хотите разработать SPA. Конечно, если вы уже освоились с этим, продолжайте. Но если вы новичок в фреймворке и вам нужно только разработать SPA, я бы выбрал что-то более простое с рядом своих привилегий. Я рекомендую заглянуть в Vue.js или Aurelia.io .

Vue.js использует двустороннюю привязку данных, MVVM, повторно используемые компоненты, простой и быстрый выбор, меньше кода для записи и т. Д. Он сочетает в себе некоторые из лучших возможностей Angular и React.

Aurelia.io , если честно, я не знаю много о. Но я заглянул туда, и мне кажется, что стоит поискать альтернативу, похожую на вышеприведенную.

Ссылки:
https://vuejs.org/
http://aurelia.io/