frost web ist das Frontend der Frost-API von Po.et zur Verwaltung von Konten und API-Tokens.
Alle neuen Funktionen sollten hinter einem Funktionsschalter im Master zusammengeführt werden, wobei dieser standardmäßig deaktiviert ist. Sobald die Funktion ausreichend getestet wurde, kann der Umschalter entfernt werden.
Dies sind ReactJS-Komponenten und Sass-Stile. Die Architektur der Komponenten ist vom Atomic Design von Brad Frost inspiriert.
Den meisten Komponenten ist eine einzelne .scss Datei mit demselben Namen zugeordnet. Es gibt auch einige globale Stile, die in components/styles leben. Stile werden von Webpacks style-loader , css-loader , autoprefixer , postcss-loader und sass-loader gebündelt und geladen.
Komponenten werden in Atome, Moleküle, Organismen, Seiten und Modalitäten unterteilt. Als Faustregel gilt: Der Kleinere sollte nicht den Größeren verwenden. Das bedeutet, dass Atome keine Abhängigkeiten von anderen Komponenten haben sollten, Moleküle nur von Atomen abhängig sein können und so weiter.
Seiten befinden sich derzeit aus historischen Gründen außerhalb /components , werden aber in Zukunft in diesen Ordner verschoben.
Die Root-Komponente ist Components/Root.tsx und ReactDOM.render wird in index.tsx aufgerufen.
React Redux-Reduzierer leben hier. Sie sollten überhaupt keine Logik haben, sondern nur Nachrichten empfangen und den Redux-Store aktualisieren.
Hier leben Redux-Saga-Sagen. Der größte Teil der Anwendungslogik, insbesondere alle Nebenwirkungen, sollte nur in Sagen und Sagen enthalten sein.
Alle von der Anwendung verwendeten Bilder. Sie werden als static readonly Elemente einer Klasse in images/Images.tsx bereitgestellt und mithilfe des File Loader Webpack-Plugins geladen und gebündelt.
Erweiterungen für die nativen JavaScript-Typen finden Sie hier.
Wir folgen größtenteils dem JS Style Guide von StandardJS und AirBnB. Wir erzwingen Stile noch nicht automatisch.
Einige Regeln:
var verboten ist und let nach Möglichkeit vermieden werden sollte – verwenden Sie stattdessen immer const .