# Front-End Updates This document is in, like, pre-alpha WIP state. But it attempts to cover front-end pain points at a high-level and then drills down into specific recommendations for how we might resolve or mitigate those painpoints. # (Very) General Guiding Principles - Delete unused code aggressively - Composability over inheritance # High-Level Pain Points ## 1. Webpack is outdated and the set up is a biiiit of a black box (in the sense of its socialization not its actual implementation, which is available) - Webpack, especially for our borrower flow, is outdated, prohibiting us from using the latest developer tools and tech. - Our webpack config is currently a black box. #### Questions - Are there any limiting dependencies, such as: - redux-form - react-redux - flow-form - swan-form? ## 2. We have too many standards. We have too many competing "standards" with no clear methodology on when to use what #### Questions - Is there a reason to have separate `react` versions? - Do we need `design-tokens`, or can it just be in `core-ui`? #### Ideas - Delete bootstrap - Delete storybook or bring it to the top-level - To avoid the "nth competing standard" problem, just adopt core-ui, with some tweaks to useability - Only import Foundation for grid or maybe not even that Jesus Christ I'm just... I'm so, so tired of CSS frameworks please... - Look into TailwindCSS for composeability on top of basic layout components ## Migration Plan - Delete any entirely unused or stale code (especially Storybook), which will help to... - Delete any entirely unused or stale dependencies - Decide if, for any packages, we should just isolate dependencies instead of rewiring them to the new system - To the extent possible, merge related parts of front-end code, such as `core-ui` and `design-tokens` - Assess plausibility of getting some tests (maybe even ad-hoc tests or 3rd party visual regression tests at least) in place - Update `webpack` first to `v4.42.0` (and lower version number slightly if/when needed) - Update `dev/package.json` - Update loaders - Update plugins - Further exploit the hell out of "dead-code elimination" tools like UnusedCSS and tree-shaking features of Webpack etc - Document all changes explicitly in a document for replayability - Repeat for all `packages/`