meta data for this page
  •  

Differences

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

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
ixc2024:tech:wfrontend:implementing_planning:start [2024/05/28 10:46] – alestaixc2024:tech:wfrontend:implementing_planning:start [2024/05/28 10:58] (current) – alesta
Line 28: Line 28:
        );        );
      }      }
 +     
 +[[https://mui.com/material-ui/getting-started/learn/||Learn Material for React]]\\
 +[[https://mui.com/material-ui/react-typography/||Material Typography]]
  
  
Line 147: Line 150:
 Learn about hooks: [[https://react.dev/reference/react/hooks|How to manage state]] Learn about hooks: [[https://react.dev/reference/react/hooks|How to manage state]]
  
-Two most useful hooks are:+Most useful hooks are:
  
 **useState()**  **useState()** 
Line 162: Line 165:
  
 {{:ixc2024:tech:wfrontend:deploying:screenshot_2024-05-28_at_10.46.05.png?400|}} {{:ixc2024:tech:wfrontend:deploying:screenshot_2024-05-28_at_10.46.05.png?400|}}
 +
 +**useNavigate()** 
 +  * It is used for moving into another page, through code
 +  * This can be used when we want to transfer user to a different page, for example after they complete the process of registration, they should be sent to a Welcome, or a Login page
 +
 +{{:ixc2024:tech:wfrontend:deploying:screenshot_2024-05-28_at_10.49.34.png?400|}}
 +
 +==Navigation==
 +
 +It is always good to implement some sort of a navigation for your users. A go-to way of doing so is by implementing a Navigation Bar - Navbar. However, navigation can also be implemented for example when we want to open a profile of another user, by clicking on the user's profile picture or their name. 
 +
 +For implementation of Navbars: [[https://react-bootstrap.netlify.app/docs/components/navbar/|React Navbar]] 
 +
 +{{:ixc2024:tech:wfrontend:deploying:screenshot_2024-05-28_at_10.57.37.png?400|}}
 +
 +
 +For implementation of Links: [[https://mui.com/material-ui/react-link/ | React Links]]
 +
 +{{:ixc2024:tech:wfrontend:deploying:screenshot_2024-05-28_at_10.57.57.png?400|}}
 +
 +