Component-based UI empowers website development teams or UX consulting services providers with more efficiency, consistent GUI, and ease of maintaining any website. It can be of great use when you are playing with large web applications where plenty of UI elements are supposed to be maintained at a time.A library performs specific, well-defined operations.
A framework is a skeleton where the application defines the meat of the operation by filling out the skeleton. The skeleton still has code to link up the parts but the most important work is done by the application.
Examples of libraries:
Network protocols, compression, image manipulation, string utilities, regular expression evaluation, math. Operations are self-contained.
Examples of frameworks:
Web application system, Plug-in manager, GUI system. The framework defines the concept but the application defines the fundamental functionality that end-users care about.
Rendering: Rendering refers to showing the output in the browser
Templates: template is a chunk of HTML that you need to inject onto the page. Often templates are created server side – in that they come to the JavaScript fully formed and just need to be put into the DOM.
State: State is a plain JavaScript object used by React to represent an information about the component’s current situation.
References:
@By Saurabh Dhariwal/Component-based UI Development
@By Cordenne Brewster/JavaScript Frameworks: What Are They and How Do They Work?
@By Jason Cohen/What is the difference between a framework and a library?