Ist AngularJS nur für Single-Page-Anwendungen (SPAs) geeignet?

Wir prüfen Optionen zum Erstellen des Frontends einer von uns erstellten Anwendung und versuchen, ein Tool zu evaluieren, das für uns funktioniert und uns die beste Plattform bietet, um voranzukommen.

Dies ist ein Node.js- Projekt. Unser ursprünglicher Plan war es, Express zu verwenden und diesen Weg zu gehen, aber wir haben beschlossen, dass es am besten ist, vor Beginn dieser Phase zu überprüfen, was da draußen ist. Unsere Anwendung hat mehrere Bereiche, von denen wir glauben, dass sie nicht zum Modell mit nur einer Seite passen, da sie aus Sicht der Anwendung zusammenhängen, aber nicht aus Sicht einer Ansicht.

Wir haben einige der Frameworks gesehen, mit denen wir den Client wie Backbone.js , Meteor usw. und auch AngularJS ausbauen können.

Dies mag eine ziemlich offensichtliche Frage sein, aber wir können anscheinend nicht entschlüsseln, ob AngularJS nur für Anwendungen mit nur einer Seite oder für Anwendungen mit mehreren Seiten wie Express verwendet werden kann.

UPDATE 17. Juli 2013 Um die Leute auf dem Laufenden zu halten, werde ich diese Frage aktualisieren, während wir den Prozess durchlaufen. Wir werden vorerst alles zusammen bauen und wir werden sehen, wie gut das funktioniert. Wir haben uns an einige Personen gewandt, die mit AngularJS besser qualifiziert sind als wir, und die Frage nach der Aufteilung größerer Anwendungen gestellt, die den Kontext gemeinsam nutzen, aber möglicherweise zu groß sind, um auf einer einzelnen Seite zu arbeiten.

Der Konsens war, dass wir mehrere statische Seiten bereitstellen und AngularJS-Anwendungen erstellen können, die nur mit diesen Seiten funktionieren. Dadurch wird effektiv eine Sammlung von SPA erstellt und diese Anwendungen mithilfe der Standardverknüpfung miteinander verknüpft. Jetzt ist unser Anwendungsfall sehr spezifisch, da unsere Lösung mehrere Anwendungen hat, und wie gesagt, wir werden zuerst die einzelne Codebasis ausprobieren und von dort aus optimieren.

UPDATE 18. Juni 2016 Das Projekt ist von einer Klippe gefallen, sodass wir nie dazu gekommen sind, zu viel zu erledigen. Wir haben es kürzlich wieder aufgenommen, verwenden jedoch nicht mehr Angular und verwenden stattdessen React. Wir verwenden weiterhin die im vorherigen Update beschriebene Architektur, in der wir Express- und eigenständige Apps verwenden. So haben wir beispielsweise eine /chatExpress-Route, die unsere React-Chat-App bereitstellt, eine andere Route /projects, die die Projekt-App und demnächst. Die Art und Weise, wie wir es betrachten, ist, dass jede App eine aggregierte Wurzel in Bezug auf ihren Funktionsumfang ist. Sie muss in der Lage sein, eigenständig zu sein, damit sie als App für sich betrachtet werden kann. Technisch gesehen sind alle Informationen da draußen, es ist nur ein einfacher Ausdruck und jede Art von clientseitiger App-Erstellung, die Sie verwenden möchten.

Überhaupt nicht. Mit Angular können Sie eine Vielzahl von Apps erstellen. Das clientseitige Routing ist nur ein kleiner Teil davon.

Sie haben eine große Liste von Funktionen, von denen Sie außerhalb des clientseitigen Routings profitieren:

• Zweiwegebindung
• Vorlage
• Währungsformatierung
• Pluralisierung
• wiederverwendbare Steuerungen
• RESTful API-Handling
• AJAX-Handhabung
• Modularisierung
• Abhängigkeitsspritze

Es ist verrückt zu denken, dass all das "nur in einer App mit nur einer Seite verwendet werden kann". Natürlich nicht ... das ist so, als würde man sagen "Jquery ist nur für Projekte mit Animationen".

Wenn es zu Ihrem Projekt passt, verwenden Sie es.

Ich hatte zuerst auch mit Angular mit dem "Wie" zu kämpfen. Dann wurde mir eines Tages klar: "Es ist NOCH Javascript". Es gibt eine Reihe von Beispielen zu den Besonderheiten von Angular (einer meiner Favoriten zusammen mit dem Buch https://github.com/angular-app/angular-app ). Das Wichtigste, an das Sie sich erinnern sollten, ist, die js-Dateien wie in jedem anderen Projekt zu laden. Sie müssen lediglich sicherstellen, dass die verschiedenen Seiten auf das richtige Angular-Objekt (Controller, Ansicht usw.) verweisen und dass Sie ausgeschaltet sind und ausgeführt werden. Ich hoffe, das macht Sinn, aber die Antwort war so einfach, dass ich sie übersehen habe.

Vielleicht ist meine Erfahrung für jemanden nützlich. Wir teilen unser Projekt logisch auf. Ein SPA verwenden wir für Feeds, ein anderes für die Arbeit mit der Karte, ein anderes für die Bearbeitung eines Benutzerprofils usw. Zum Beispiel haben wir drei Apps: Feed, Benutzer und Karte. Ich benutze es in den getrennten URLs wie folgt:

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

Jede dieser Anwendungen verfügt über eigene lokale Routing-Zuordnungen zwischen Status in der Anwendung. Ich denke, es ist eine gute Vorgehensweise, da jede Anwendung nur mit ihrem eigenen Kontext und den Lastabhängigkeiten arbeitet, die sie wirklich benötigt. Es ist auch sehr gut für Debug- und Integrationsprozesse geeignet.

In der Tat können Sie sehr einfach eine Mischung aus SPA-Apps erstellen. Beispielsweise ist der Feed eine URL mit der AngularJS-Anwendung, die Benutzer-App mit den ReactJS und die Zuordnung zur Backbone.JS-Anwendung.

Als Antwort auf Ihre Frage:

Angular ist nicht nur für SPAs geeignet, Angular spielt auch gut und schnell für SPA-Anwendungen, aber niemand stört sich daran, eine MPA-Anwendung für eine Vielzahl von SPA-Anwendungen zu erstellen. Wenn Sie jedoch an Ihre URL-Architektur denken, vergessen Sie nicht die SEO-Verfügbarkeit Ihrer Anwendungen.

Ich unterstütze auch die Idee:

Was ist der Unterschied zwischen einem Projekt und einer App? Eine App ist eine Webanwendung, die etwas tut - z. B. ein Weblog-System, eine Datenbank mit öffentlichen Aufzeichnungen oder eine einfache Umfrage-App. Ein Projekt ist eine Sammlung von Konfigurationen und Apps für eine bestimmte Website. Ein Projekt kann mehrere Apps enthalten. Eine App kann sich in mehreren Projekten befinden.

Wenn Sie nur ein paar Seiten mit Client-Datenbindung benötigen, würde ich mich für Knockout und Javascript Namespacing entscheiden.

Knockout ist großartig, besonders wenn Sie eine unkomplizierte Abwärtskompatibilität benötigen und ziemlich einfache Seiten haben. Wenn Sie Komponenten von Drittanbietern verwenden, sind die benutzerdefinierten Bindungen von Knockout unkompliziert und einfach zu verarbeiten.

Mit dem Javascript-Namespace können Sie Ihren Code getrennt und verwaltbar halten.

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

Und in einem Skript-Tag, nachdem Ihre anderen Skripte geladen wurden

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

Der Schlüssel ist, dass Sie jedes gewünschte Werkzeug verwenden, wenn Sie es benötigen. Benötigen Sie eine Datenbindung? Knockout (oder was auch immer Sie mögen). Benötigen Sie Routing? sammy.js (oder was auch immer Sie mögen).

Client-Code kann so einfach oder kompliziert sein, wie Sie es möchten. Ich habe versucht, Angular in eine sehr komplizierte Site mit einem vorhandenen proprietären Framework zu integrieren, und es war ein Albtraum. Angular ist großartig, wenn Sie neu anfangen, aber es hat eine Lernkurve und bindet Sie in einen sehr engen Workflow ein. Wenn Sie es nicht befolgen, kann sich Ihr Code sehr schnell verheddern.

Ich würde sagen, Angular ist übertrieben, wenn Sie nur ein SPA entwickeln möchten. Sicher, wenn Sie bereits damit vertraut sind, fahren Sie fort. Aber wenn Sie neu im Framework sind und nur ein SPA entwickeln müssen, würde ich mich für etwas Einfacheres mit einer Reihe eigener Vorteile entscheiden. Ich empfehle einen Blick in Vue.js oder Aurelia.io .

Vue.js verwendet Datenbindung, MVVM, wiederverwendbare Komponenten, einfache und schnelle Erfassung, weniger zu schreibenden Code usw. Es kombiniert einige der besten Funktionen von Angular und React.

Aurelia.io , ganz , ich weiß nicht viel darüber. Aber ich habe mich umgesehen und es scheint eine Alternative zu sein, die es wert ist, untersucht zu werden, ähnlich wie oben.

Links:
https://vuejs.org/
http://aurelia.io/