Vanilla FP: The no-framework framework for building component-based UIs
Vanilla FP is a no-framework approach for building component-based purely-functional UIs. It emphasizes convention over code, allowing components to manage their own state without relying on external frameworks. This method promotes better organization and hierarchy in code while avoiding the complexities of traditional state management solutions.
- ▪Vanilla FP allows components to manage their own state using a simple 'setState' function.
- ▪The framework promotes a component-based design that enhances code organization.
- ▪Unlike Redux or React's useState, Vanilla FP provides a more straightforward way to handle state without the need for global variables.
Opening excerpt (first ~120 words) tap to expand
The no-framework framework for building component-based purely-functional UIs. About vanilla-fp At the heart of vanilla-fp is not code but convention for how to build a component. A component is a pure-ish function that typically receives two parameters (called 'state' and 'setState', but can vary across components) which provide the component with a state and with a function for altering its state and returns a UI component, using the building blocks provided by the framework: import {div, button, span} from './vanilla-fp.js' export const VolumeControl = ({volume = 0, setVolume}) => div({className:"container"}, [ button({text: "+", onClick: () => setVolume(volume +1)}), span({className: "currentVolume", text: volume}), button({text: "-", onClick: () => setVolume(volume -1)}), ]) Each…
Excerpt limited to ~120 words for fair-use compliance. The full article is at GitHub.