Ist Angular-Seed das de facto leere Projekt?


83

Nachdem ich überzeugt war, Angular.js zu lernen und zu verwenden, wollte ich eine konkrete Web-UI-Anwendung starten, um das Lernrad der Erfahrung zu starten. (Die App wird eine Art persönliche Planung sein, um Listen, Erinnerungen, Pomodoro-Techniken usw. zu erstellen ...)

In einem der Tutorial-Videos, die ich vom Autor von Angular gesehen habe, geht es um Best Practices. Eine der besten Methoden ist es, mit dem angular-seedProjekt zu beginnen .

Das wollte ich tun, aber nachdem ich ein wenig gegoogelt habe, gibt es bereits mindestens zwei andere Projekte, die behaupten, der gute Ausgangspunkt zu sein:

  • angular-enterprise-seed
  • angular-sprout

Ich bin Anfänger, aber ich investiere gerne langfristig. Sollte ich mir Sorgen machen, etwas anderes als zu verwenden angular-seed? Ich denke, es ist zu früh, um mir diese Frage zu stellen, aber wenn es bereits zwei andere Projekte gibt, gibt es vielleicht einige gute Gründe.


1
Ich denke, bei 'Best Practices' ging es mehr um die Verwendung von Vorlagen als Ausgangspunkt im Allgemeinen und nicht um eine bestimmte Vorlage. Ja, angular-sprouthat einige Vorteile, aber meiner Meinung nach können Sie angular-seedfür die Lernzwecke ganz gut verwenden.
raina77ow

Ich habe bearbeitet, um das Wort templateaus der Frage zu entfernen . Nein, in der Tat bestand der Autor darauf, Angular-Seed als Start zu verwenden, um eine Anwendung auf seinem Frame zu erstellen (deshalb habe ich die Wortvorlage verwendet, nicht im Sinne einer HTML-Vorlage). Vielen Dank für den Hinweis.
Stephane Rolland

angular-seedsollte gut funktionieren. Es ist wirklich eine Frage der persönlichen Präferenz, wie Sie Ihr Projekt strukturieren möchten. Wenn ich ein Werkzeug vorschlagen würde, um es zu benutzen, wäre es yeoman . Es ist ideal für Gerüst-Winkelprojekte und mehr ...
Jonathan Palumbo

1
Ihr Tutorial-Videolink ist möglicherweise defekt.
JJ Zabkar

1
@JJZabkar korrigiert, schade, dass ich heute Abend nur deinen Kommentar gesehen habe.
Stephane Rolland

Antworten:


60

Ich habe festgestellt, dass Yeoman der einfachste und beständigste Ausgangspunkt für eine eckige App (oder eine Javascript-Web-App) ist, obwohl viele Leute verschiedene Seed-Projekte verwenden .

Diese App ist ein Gerüst-Tool, mit dem Sie Generatoren angeben können, die den Kernel Ihrer Anwendung aufbauen, einschließlich aller gewünschten Bibliotheken (über Bower ) und einer funktionierenden Grunz- Build-Datei (die meisten Generatoren verfügen über eine Build-Aufgabe, einen Server) Aufgabe für Live-Bearbeitung und Testaufgabe)

Obwohl eine App wie diese notwendigerweise eine Meinung hat, ist das Gerüst, das sie produziert, immer noch sehr allgemein gehalten.

Beispiel:

mkdir my-app
cd my-app
npm install generator-angular
npm install generator-karma
yo angular

8
Ich glaube, Zeile 3 oben sollte sein npm install generator-angular.
Ryan Walls

Und Zeile 4: npm installieren Generator-Karma
Mattl

npm ERR! 404 'Winkelgenerator' ist nicht in der npm-Registrierung enthalten.
Mortsahl

grunt serveum es im Browser zu sehen
Jacktrades

1
Ich musste auch yo "npm install --global yo"
moke

26

Sie haben alle unterschiedliche Vorzüge, es hängt also davon ab, was Sie tun möchten. Ich habe Angular-Enterprise-Seed geschrieben und kann über seine relativen Vorzüge sprechen.

  1. Es ist serverunabhängig. Dies ist wichtig, da ein zentraler Grundsatz von AngularJS und eines der vielen Dinge, die es attraktiv machen, darin besteht, dass es dem Client-MVC-Paradigma folgt. Dies bedeutet, dass es vollständig von allen Servertechnologien entkoppelt ist. Viele vorhandene Seeds binden AngularJS an Servertechnologien wie Angular - Sprout (NodeJS) oder Grilled -Feta (Google App Engine / Java). Wenn bei den oben genannten Projekten NodeJS- und / oder Java-Umgebungen noch nicht auf Ihrem System vorhanden sind, müssen Sie mehrere Schritte durchlaufen, um zu sehen, wie der Startwert angezeigt wird. Dies kann PHP- und Python-Entwicklern entfremden, was zu einer Einschränkung der Projektgemeinschaft führt.

  2. In Sekundenschnelle einsatzbereit. Da es serverunabhängig ist, kann es in jedem Container ausgeführt werden (überprüfen Sie das Dateisystem in dieser Angelegenheit). Die vorgeschlagene Methode führt "python -m SimpleHTTPServer" aus dem Stammverzeichnis aus. Dies ist auf Mac und Linux nativ, sodass keine zusätzlichen Schritte erforderlich sind.

  3. Live Vorschau. Es ist billig, den Status des Projekts zu überprüfen, da eine Live-Version immer auf github gehostet wird . Da es serverunabhängig ist, wird dies automatisch durchgeführt, indem der Master von einem Cron-Job in den Gh-Pages-Zweig kopiert wird.

  4. Reiches Styling. Es enthält Twitter Bootstrap und benutzerdefinierte / baubare WENIGER, Angular-UI, Angular-NG, Schriftarten und eine Vielzahl anderer Tools, um umfassende Styling- und Reaktionsfähigkeiten bereitzustellen.

  5. Widgets. Wie Angular-Seed und Angular-Sprout steht Angular-Enterprise-Seed beispielhaft für "Best Practice" -Layout, -Routing usw. Es bietet jedoch auch eine Vielzahl vorgefertigter Komponenten, die aus dem Regal genommen und sofort wiederverwendet werden können. Dies ist etwas schwierig, da hierfür die Konvergenz mehrerer Technologien erforderlich sein kann. Um beispielsweise das Rasterbeispiel zu erstellen, habe ich Angular-UI, Angular-Ng, Angular-Js und JQuery-Styling kombiniert. Es gibt Komponentenbeispiele für Modalitäten, Paginierung, Warnungen, Raster und mehr.

Angular-Seed eignet sich hervorragend als akademische Übung, wenn Sie lernen möchten, wie die Teile funktionieren, aber Sie werden sich nach einem substanzielleren Startpunkt sehnen.

Ich habe keinen Winkelspross verwendet, daher kann ich nicht über seine Vorzüge sprechen. Vielleicht gibt es etwas Raum, um eckigen Spross und eckigen Unternehmenssamen zu verschmelzen?


2
Wenn Sie eine Serverkopplung wünschen, besuchen Sie github.com/robertjchristian/service-nucleus , das Angular-Enterprise-Seed in Netflix-Karyon integriert und zusätzliche Funktionen hinzufügt. Sofort einsatzbereit und kriegsbereit. (Java-basiert und beinhaltet REST über Jersey).
Robert Christian

1
Das sieht als Basis wirklich gut aus. Haben Sie darüber nachgedacht, Bower zu integrieren, um das Hinzufügen von Dingen wie Angular-UI-Map usw. zu vereinfachen?
Baldy

1
@Baldy - Ja, ich möchte Bower in das Projekt einbeziehen. Machst du Freiwilligenarbeit? :)
Robert Christian

leider nicht, ich bin auf etwas anderes umgezogen :)
Baldy

1
Sie haben mich mit "immer eine neue Version auf Github gehostet" überzeugt ... und dann gibt der Link: robertjchristian.github.io/angular-enterprise-seed/# eine leere Seite zurück.
Cerd

18

Ich erkenne, dass dies eine ältere Frage ist, aber es scheint eine ganze Reihe von Ansichten zu geben, daher ist es sinnvoll zu empfehlen, was in letzter Zeit eine sehr beliebte Alternative zu Yeoman und eckigem Saatgut geworden ist: ng-Boilerplate . ng-boilerplate unterscheidet sich von Angular-Seed dadurch, dass es von Grund auf für große Produktions-Web-Apps entwickelt wurde und daher meiner Meinung nach eine bessere Lösung als Angular-Seed ist.

Um die Unterschiede zwischen der Yeoman- und der ng-Boilerplate-Methode für den App-Kickstart zu erklären, zitiere ich den Schöpfer von ngbp, Josh D. Miller :

Yeoman ist großartig. Aber das Problem, das ich mit den Generatoren für AngularJS habe, ist, dass sie eher nach Schicht als nach Funktion gepackt werden. Wenn wir alle Controller in einem "Controller" -Ordner und alle Services in einem "Services" -Ordner usw. speichern und alle unsere Tests vollständig an einem anderen Ort durchführen, kann es ziemlich schwierig sein, unsere Komponenten wiederzuverwenden.

Dies ist auch eine ziemlich gute Diskussion von Josh im Yeoman-Forum für Winkelgenerator-Themen, das sich eingehender mit der Einrichtung von ng-boilerplate vs. yeoman befasst.


11

Um ganz klar zu sein, Yeoman ist kein Generator. Yeoman ist ein Format / System zur Herstellung von Generatoren. Mit Yeoman wurden mehrere Generatoren erstellt, mit denen Sie eine AngularJS-Anwendung generieren können. Menschen bezeichnen den einen oder anderen oft fälschlicherweise als "den" Yeoman-Generator. Aber es gibt viele. Noch verwirrt? Yeoman ist nicht das einzige Generatorherstellungssystem. Brunch ist ein anderer.

Um Ihre Frage zu beantworten, finden Sie hier einen sehr umfassenden Vergleich vieler AngularJS-Generatoren nebeneinander, mit denen Sie eine Webanwendung mit AngularJS erstellen können. Derzeit enthält es über 200 verschiedene Aspekte dieser Dinge. Einer davon ist der Stil der Dateiorganisation. So können Sie leicht erkennen, welche die Dateien nach Funktionen organisieren, wenn dies für Sie wichtig ist. Es ist für mich.

Es müssen noch einige hinzugefügt werden. Die beiden in diesem Thread erwähnten sind für mich neu. Dieser Vergleich sollte Ihnen jedoch eine gute Vorstellung von den Optionen und deren Vergleich geben. Es kann auch bearbeitet werden. Wenn einer von Ihnen Experten für eines dieser Dinge ist, können Sie uns gerne mitteilen, was Sie wissen.

Gott weiß nur, warum die Menschen immer mehr aus diesen Dingen machen, anstatt nur dazu beizutragen, die bestehenden zu verbessern. Wenn Sie irgendwelche Vermutungen haben, würde ich dieses Rätsel gerne lösen lassen.

BEARBEITEN: Um Zugang zu dem Dokument zu erhalten, bitte ich Sie, entweder einen Fragebogen auszufüllen, um Ihr Wissen über etwas zu teilen, oder die Experten dazu zu bewegen.

Hier können Sie einen Fragebogen ausfüllen : http://www.dancancro.com/technology-questionnaires/


9

Ich benutze Yeoman auch gerne. Probieren Sie diese aus, um ein gutes Gerüst zu erhalten:

npm install -g generator-angular  # install generator
yo angular                        # scaffold out a AngularJS project
bower install angular-ui          # install a dependency for your project from Bower
grunt test                        # test your app
grunt server                      # preview your app
grunt                             # build the application for deployment

Beachten Sie nur, dass dieser Generator jetzt ziemlich alt ist, daher bin ich mir nicht sicher, ob ich ihn weiter empfehlen würde.
Dmackerman

Ja, aber finden Sie eine andere unter yeoman.io/generators . Suche nach eckig / eckig2
HankCa
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.