Ask HN: Explaining front-end frameworks to a designer

Web UI designers should be familiar with concept of web components. Angular is maybe not the best choice, but React is quite easy to explain. It's all about such components. Every React component is like a brick you can use to build the whole house. Every component looks like a custom tag <Message/>, can have clear defined parameters <Message text="Hello World"/>. It is very performant and easy to reason about. Forget about HTML or CSS :) Think about the component and its properties. It's very simple. It does not need to be related to the browser. <Foo/> is just a convenient abstraction which can work with the browser or as iOS/Android native component (thanks to React Native). The component may use HTML inside, but it is it's implementation details.

Since designers are presumably aware of things like Photoshop and related technologies, it could be useful to explain by analogy. For example, a framework could be said to have "macros" that apply various types of "effects" and interaction to elements on the page. Frameworks also provide "layers or pieces of templates" (think responsive columns) that make aligning elements more uniform and consistent throughout the site. Another thing to note to the designers is that the original languages for making pages were very cryptic and tedious while modern frameworks take away a good part of the tedium by simplifying the layout and element-interaction processes.

Edit: By "designer", I was thinking you meant graphics designer; I apologise if you meant something else.

A framework abstracts away common patterns so you don't have to reinvent the wheel all the time. That being said, not everyone agree on what are the same common patterns or the best way to solve them, hence why there's so many frameworks.

Framework is like a joke. If you have to explain it then its not that good. I know its irrelevant but I just had to put it somewhere.