2013-08-10 4 views
10

Ich wollte Angularjs ausprobieren. Ich habe mich jedoch schwer damit beschäftigt, zu entscheiden, wo ich meine eckige App finden soll.Angularjs und Rails Apps als eigenständige Komponenten trennen

Ich verwende Rails-Framework für das Back-End. Ich habe Tutorials gesehen, in denen die gesamte eckige App unter dem Ordner "assets/javascript" gespeichert ist.

Ich frage mich, ob ich nicht in den Assets/Javascript-Ordner leben könnte, könnte ich es leben außerhalb meiner Schienen-Verzeichnis vollständig. Auf diese Weise kann ich möglicherweise mein Backend und Frontend vollständig trennen. (Wird das empfohlen?).

Ich glaube, dass die Asset-Pipeline auch eine Menge der Vermögenswerte vorkompiliert. Wenn ich das angularjs Asset trennen würde, müsste ich die Assets irgendwie vorkompilieren?

Dank

Antwort

5

Sie könnten ein Grunzen basierten Workflow verwenden:

Wenn Sie mit einem entkoppelten Frontend starten, zunächst verspottet Verwendung bei, so dass Sie bleiben können innerhalb von Winkel und nicht verlieren Fokus zwischen Backend-und Front-End-Logik. Ein Vorteil beim Erstellen einer einzelnen Seite Anwendung ist, dass Sie es unabhängig von der Backend-API entwickeln können. Informationen zum Spotten von http-Antworten finden Sie unter (http://docs.angularjs.org/api/ngMockE2E. $ HttpBackend).

+0

ah, das sieht interessant aus.Von dem, was ich verstehe, wenn ich die angularjs in die Assets/Javascript App hinzugefügt hätte, müsste ich die angularjs App nicht vorkompilieren. Wenn ich den Grunt-Workflow verwendet hätte, müsste ich die angularjs vor der Bereitstellung neu kompilieren; wäre das korrekt? – Karan

+0

oh, und sobald ich die app mit grunt bauen, sollte dies unter dem railsapp/public directory platziert werden? – Karan

4

Ich habe durch eine ähnliche Reihe von Fragen gearbeitet. Es gibt einige gute Tools, mit denen Sie AngularJS direkt in Ihre Rails-Asset-Pipeline integrieren können, und sie sehen für mich gut aus, wenn Sie nur ein bisschen Angular wollen.

Wenn Sie jedoch eine vollständige Front-End, aka eine einzelne Seite Web-App wollen, denke ich, dass Sie irgendwann durch die Kompatibilität und einige der Werkzeuge begrenzt werden. Ich habe das Gefühl, dass die Rails-Edelsteine ​​nicht ganz mit Angular Schritt halten, und Sie werden in Versionskonflikte geraten. Ich habe auch immer mehr Tools für Angular als eigenständiges Programm gesehen, und mir gefällt die Projektvorlage ng-boilerplate sehr gut. Ich mag auch viele der Testwerkzeuge wie Karma, und ich habe nicht wirklich einen Weg gefunden, Karma mit Schienen zu integrieren.

Aus diesem Grund entschied ich schließlich, dass ich die zwei trennen würde. Anfangs habe ich das durch Erstellen einer Rails-Anwendung und einer separaten winkelförmigen Anwendung (separate Verzeichnisse) getan. Ich habe ng-boilerplate als Rahmen für das eckige Ende verwendet. Ich schrieb eine tutorial on that. Dies wurde schließlich ein wenig frustrierend, und ich schrieb some more thoughts on it, der größte Ärger war, dass ich zwei Git-Repositories hatte und es war nervig, sie synchron zu halten. Es ist auch etwas lästig, mit einer IDE über zwei Verzeichnisse zu arbeiten. Ich wechsle nun zu Rails und eckig im selben Ordner und sie scheinen nett zu spielen, da jeder verschiedene Verzeichnisse in diesem Projekt verwendet.

In dieser aktuellen Struktur verwende ich die grun Setup, die mit ng-Boilerplate kam, um den gesamten Code zu minimieren, zu verpacken und auch Karma-Unit-Tests durchzuführen. Ich habe noch nicht die End-to-End-Tests genagelt, aber es steht auf meiner Liste. Ich habe festgestellt, dass dies eine relativ produktive Arbeitsumgebung ist. Meine gewählte Struktur für meine Seiten, Controller und Karma-Testfälle hat einen wiederholten Code (ich entscheide mich, ihn nicht auszumerzen, um die Lesbarkeit zu erhalten). Ich plane, den rail scaffold generator zu erweitern, um den javascript framework für mich zu erstellen - wenn ich also ein persons rails scaffold erstelle, wird es auch ein personal angularjs scaffold für mich erstellen. Ich werde hier aktualisieren, wenn und wenn ich diese Arbeit mache.

EDIT: Ich habe die Gerüstbauarbeiten sowie abgeschlossen, die Schienen ermöglicht, automatisch die AngularJS Elemente zu erzeugen, wenn Sie die Schienen-Modelle/Controller usw. Der Blog-Eintrag erzeugen ist hier: http://technpol.wordpress.com/2013/09/24/rails-generator-to-generate-angular-views/

1

Wir verwendet haben AngularJS mit unserer Rails-Anwendung, in einer Weise, in der wir Rails ERB-Vorlagen verwendet haben, aber bei Bedarf auf ng-Anweisungen umschalten.

Für diese obige Konfiguration haben wir bower/Gem verwendet, die uns Bower verwenden können, um die eckigen Pakete und ihre Abhängigkeiten zu verwalten. Wir binden dies in unser Repository im Verzeichnis javascripts ein und kümmern uns um die Rails-Asset-Pipeline.

Diese Konfiguration hat für uns gut funktioniert, wenn man bedenkt, dass wir mehr als 50-50% unserer Ansichten zwischen den ERB-Templates und Angularjs teilen.

Mehr über dieses Setup in den Links unten:

0

Es gibt viele Vorteile der Trennung aus Ihrem api-Dienst (Schienen in diesem Fall) und Ihre Frontend-Komponenten. Wie bei ios/android Apps kann angular client eigenständig als eigenständige Einheit leben. Es wird eine statische Website sein, die auf s3 oder einem beliebigen statischen Website-Host bereitgestellt werden kann. Es muss nur mit Ihrem API Service kommunizieren. Sie könnten CORS einrichten, um dies zu ermöglichen.

Einige Vorteile dieses Workflows

  • Sie rails-api verwenden könnte, die eine Teilmenge der Rails-Anwendung ist. Wenn Sie nur Schienen verwenden, um Apis zu bauen, ist es nicht sinnvoll, alle Funktionen zu haben, die eine komplette Rails-App bietet. Es ist leichter, schneller und neigt mehr zum Aufbau des ersten Bogens als ein MVC-Bogen.
  • Sie könnten yeoman angular-generator verwenden, um eine eckige App zu generieren und grunzen & bower zu verwalten, um Build (concat, uglify, cdnify etc) und Abhängigkeiten (eckige Module) zu verwalten.
  • Bereitstellungen werden flexibel. Sie müssen sich nicht auf einen verlassen, um den anderen zu drücken.
  • Wenn Sie jemals planen, Ihren Backend-Stack zu ändern (z. B. Schienen zum Spielen/Feiern), müssen Sie sich keine Sorgen um Ihre Client-Komponenten machen.
  • Durch die Aufteilung der Entwicklung des Frontends und des Rails-Backends können Sie die Arbeit auf zwei Entwicklungsteams verteilen und die Anwendung als Ganzes sehr erweiterbar halten.

Es gibt auch einen Nachteil dieses Ansatzes. Wenn Sie die Anwendungen in zwei separaten Repositorys haben, können Sie nicht einfach einen vollständigen Integrationstest durchführen. Also müssen Sie die Apps separat testen. Sie könnten Ihre Apis verspotten, um eckige App zu testen.

Wir haben diesen Ansatz verwendet und würden anderen dasselbe empfehlen. Weniger Abhängigkeit & mehr Produktivität.

Verwandte Themen