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
.