frost web

frost web

frost web是 Po.et 的 Frost API 的前端，用於管理帳戶和 API 令牌。

開發流程

所有新功能都應合併到功能切換後面的主功能中，預設功能切換是關閉的。一旦功能經過充分測試，就可以刪除切換開關。

庫、框架等

• 打字稿
• ReactJS
• 反應還原
• Redux-Saga
• 網頁包
• 霜凍客戶端
• 詩人js

文件結構

成分

這些是 ReactJS 元件和 Sass 樣式。組件架構的靈感來自 Brad Frost 的原子設計。

大多數元件都有一個同名的關聯.scss檔。 components/styles中也存在一些全域樣式。樣式由 Webpack 的style-loader 、 css-loader 、 autoprefixer 、 postcss-loader和sass-loader捆綁和載入。

組件分為原子、分子、有機體、頁數和模態。經驗法則是：較小的不應該使用較大的。這意味著原子不應該依賴其他組件，分子只能依賴原子等等。

由於歷史原因，頁面目前位於/components之外，但將來它們將移至此資料夾中。

根元件是components/Root.tsx，ReactDOM.render在index.tsx中呼叫。

減速機

React Redux 減速機就在這裡。他們根本不應該有任何邏輯，只是接收訊息並更新 redux 儲存。

傳奇

Redux-Saga 傳奇故事就在這裡。大多數應用程式的邏輯，特別是所有副作用，應該只在傳奇中。

圖片

應用程式使用的所有圖像。它們在 images/Images.tsx 中作為類別的static readonly元素公開，使用 File Loader Webpack 插件來載入和捆綁它們。

擴充

JavaScript 原生類型的擴充位於此處。

編碼標準

我們主要遵循 StandardJS 和 AirBnB 的 JS 風格指南。我們還沒有自動強制執行樣式。

一些規則：

• 盡可能編寫無副作用的純函數式程式碼。這意味著var是被禁止的，並且應盡可能避免使用let - 始終使用const代替。
• 編寫具有明確目的的小函數
• 避免預設導出
• 按照愛彼迎規則 23.6、23.7 和 23.8命名文件，適用於最重要的導出而不是預設導出
• 使用 2 個空格進行縮排
• 字串使用單引號，除非是為了避免轉義
• 關鍵字後面加一個空格

貢獻

安全