301 Class One Reading Notes “Introduction to React and Components”
Component-based architecture focuses on the decomposition of the design into individual functional or logical components that represent well-defined communication interfaces containing methods, events, and properties. It provides a higher level of abstraction and divides the problem into sub-problems, each associated with component partitions.
A component is a modular, portable, replaceable, and reusable set of well-defined functionality that encapsulates its implementation and exporting it as a higher-level interface.
A component is a software object, intended to interact with other components, encapsulating certain functionality or a set of functionalities. It has an obviously defined interface and conforms to a recommended behavior common to all components within an architecture.
Questions
- What is a “component”? A component is modular, lightweight piece of code that is reusable and designed to be reduce coding time and costs.
- What are the characteristics of a component? reuseable, replaceable, not content specific, extensible, independant, and encapsulated
- What are the advantages of using component-based architecture? The components are reuseable, easier to deploy, cheaper, reliable, and make it easier to change or update your system.
Props
React is a component-based library that divides the UI into little reusable pieces. In some cases, those components need to communicate (send data to each other) and the way to pass data between components is by using props.
“Props” is a special keyword in React, which stands for properties and is being used for passing data from one component to another.
But the important part here is that data with props are being passed in a uni-directional flow. (one way from parent to child)
Furthermore, props data is read-only, which means that data coming from the parent should not be changed by child components.
Questions on Props
- What is “props” short for? Props is short for properties that are used for passing data from one component to another.
- How are props used in React? Firstly, define an attribute and its value(data), then pass it to child component(s) by using Props, and finally render the Props Data.
- What is the flow of props? The flow is props can only be passed to components in one way…Parent to Child
Things I Want to Know More About
I think at this point just a verbal explanation of what I read would help. I think I understand it, but haqve thought that before and been confused.