User Tools

Site Tools


reactjs_and_friends

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
reactjs_and_friends [2021/11/03 10:43]
sausage [actions.js]
reactjs_and_friends [2021/11/05 01:35]
sausage [ReactJS and Friends Refresher]
Line 5: Line 5:
 Hopefully this article will serve as a good reminder for when you need to stretch your legs again. Hopefully this article will serve as a good reminder for when you need to stretch your legs again.
  
-Facebook are not known for the fostering of healthy relationships and interactions,​ but they sure do make a darned good Javascript framework. ​+Facebook are not known for the fostering of healthy relationships and interactions,​ but they make a darned good Javascript framework. ​
  
 The name React (in my option) comes from the fact that the rendering reacts to the changes in the data that the components themselves are bound to. But without some extra libraries, the React framework is of limited real-world use. The name React (in my option) comes from the fact that the rendering reacts to the changes in the data that the components themselves are bound to. But without some extra libraries, the React framework is of limited real-world use.
Line 301: Line 301:
 The useEffect hook is going to be used as the trigger to load data into the application when it first starts. Providing an empty array to useEffect is the equivalent to the old-school lifecycle method ''​componentDidMount''​. Therefore, the loading will only occur on first load and will then push the data into the store. The useEffect hook is going to be used as the trigger to load data into the application when it first starts. Providing an empty array to useEffect is the equivalent to the old-school lifecycle method ''​componentDidMount''​. Therefore, the loading will only occur on first load and will then push the data into the store.
  
-However, do notice ​that I have passed in ''​dispatch'' ​in the array for useEffect. This still behaves like ''​componentDidMount'' ​but will remove an ugly lint warning+<WRAP center round info 90%> 
 +Notice ​that I have passed in ''​dispatch'' ​into the array for useEffect. This is to remove an ugly warning. Because the array with ''​dispatch''​ is unchanging, useEffect ​still behaves like ''​componentDidMount''​. 
 +</​WRAP>​
  
 The ''​Router''​ is added here, which contains ''​NavLink''​s. These are used instead of a ''​Nav'',​ because NavLinks allow the styling of the actively selected tab or navigation element. The ''​Router''​ is added here, which contains ''​NavLink''​s. These are used instead of a ''​Nav'',​ because NavLinks allow the styling of the actively selected tab or navigation element.
Line 473: Line 475:
  
 There has been no need to implement any local state in any of the components. All have been driven by the useSelector hook back from the main application state. There has been no need to implement any local state in any of the components. All have been driven by the useSelector hook back from the main application state.
 +
 +Finally a big thanks to my friends Andrew and Adam for reviewing the content of this article for me.
  
 ===== References and further reading ===== ===== References and further reading =====
reactjs_and_friends.txt · Last modified: 2021/11/05 01:35 by sausage