The lecture introduces you to another way of specifying a color in CSS.
Previously you learned that you can specify the color name, like red, green, or blue. But there are other ways of defining a color value, like using the hex value or the rgb value.
The hexadecimal value (aka hex) is a value that ranges from 0 to 255 in base 10, but is written in base 16 ranging from 0 to ff. That's why it's called hexadecimal, because one digit can have 16 different characters. It goes from the usual 0 to 9, then after that is goes using the letters a through f.
For the specific case of color hex codes, there are usually six digits. The first two digits are the value for the Red. The middle two digits are the values for the Green. The last two digits are the value for the Blue. Hence the abbreviation RGB whenever you need to compose those three colors to build any one color. For CSS, the hex value is always prefixed with a hash or pound sign.
You can also specify color values using base-10 RGB by saying ...
The lecture goes over an explanation of how chat room or board messages are retrieved for a React app.
It goes over the call to the fetch function that returns a Promise.
Then it goes over how the Promise returned by fetch gets fulfilled with a Response object.
The body of the response is extracted and turned into an array of objects in JavaScript.
A new array of strings is made after calling map on the array of message post objects.
Finally, the mutation function from React useState is called to signal React the state for messages has changed, triggering the rendering of the component anew.
#reactjs
The lecture goes over the use of fetch to retrieve data for the messages in a React application.
The Fetch API can be used to make an HTTP request to a backend server such as an API that serves data in the JSON format.
With a GET request, the default behavior of fetch, data for messages in a chat room-like user interface are retrieved.
The call to fetch returns a Promise that fulfills with a Response object.
You can extract the body of the response and interpret its text content as JSON, thus creating a JavaScript object with the mapped information. This is also known as deserialization or unmarshalling.
The json method of the response object can be called to extract the body of the response and read it as JSON, thus creating a JavaScript data structure with the data. In the example, it creates an array of objects.
Note the return value of the call to json is another Promise that fulfills with the deserialized value, so another call to then is necessary. Having multiple then statements ...
The lecture explores the callback passed to the useEffect hook in React.
It uses a setTimeout to demonstrate that initially the data is in its initial state, until it is changed by the corresponding mutate function.
Once mutated, the state change signals React to render the component anew, resolving DOM discrepancies, and manifesting the new data to the user.
In the example, an empty list of messages is populated after some brief period of time, a simulation of what's like to make a request to a backend server to retrieve data.
#reactjs
