I'm a professional PHP, Python and Javascript developer from the UK. I've worked with Django, Laravel, and React, among others. I also maintain a legacy Zend 1 application.
A React component is essentially just a function that returns HTML. It can accept arguments if necessary, in the form of props, and can use those to determine what it renders.
While a component can technically be a class, it still makes more sense to think of it as a function, and with the advent of Hooks it's probably not necessary to build any one component as a class nowadays.
I think this is exactly the right way to visualize the pattern of react in a front end architecture. While I'm sure we both know the actual architecture is a bit more complex, this is a great way begin the discussion on conceptual react (it's often how I represent react in my architecture diagrams on projects).
The only suggestion I'd having is the idea of function and HTML is 1. A little too complex to be strictly eli5
More specific than is needed, as these kind of dumb downed explanations allow for great opportunity for you to abstract the pattern away from the implementation.
Too elaborate on that last point. You could say that the react pattern is functions that return markup, and what is markup but a language to define specific structures. So we could even say that react is a pattern where we create functions that define structures, and can even use other structures to modulate the structures that they return.
This also tends to go over the head of a 5 year old, but I hope you can see my point about how abstraction can make an explanation even more meaningful.
A React component is essentially just a function that returns HTML. It can accept arguments if necessary, in the form of props, and can use those to determine what it renders.
While a component can technically be a class, it still makes more sense to think of it as a function, and with the advent of Hooks it's probably not necessary to build any one component as a class nowadays.
I think this is exactly the right way to visualize the pattern of react in a front end architecture. While I'm sure we both know the actual architecture is a bit more complex, this is a great way begin the discussion on conceptual react (it's often how I represent react in my architecture diagrams on projects).
The only suggestion I'd having is the idea of function and HTML is 1. A little too complex to be strictly eli5
Too elaborate on that last point. You could say that the react pattern is functions that return markup, and what is markup but a language to define specific structures. So we could even say that react is a pattern where we create functions that define structures, and can even use other structures to modulate the structures that they return.
This also tends to go over the head of a 5 year old, but I hope you can see my point about how abstraction can make an explanation even more meaningful.
"A React component is essentially just a function that returns HTML." This is a great explanation!
I would clarify, "A React component is essentially a JavaScript function that returns HTML."