100DaysOfCode

Replace mock data with a real datasource: Send HTTP request once the page has loaded - we would typically use useEffect() Runs whenever component is frist rendered, never after. Do: fetch your data inside it. Manage state for the component - use useState() hook const [loadedNotes, setLoadedNotes] = useState([]); useEffect(()=> { //send http request and fetch data. //set on component setLoadedNotes(LOADED_NOTES); }, []); Full code (with function component): function HomePage(){ const [loadedNotes, setLoadedNotes] = useState([]); useEffect(()=> { //send http request and fetch data....

Day 2 Key Learnings: pages folder name is reserved in nextjs. Others like components is not reserved. How props are passed to a component. Utilize _app.js for anything that affects all pages like Layout - wrap with Layout component, Navigation (with links) etc Using Programmatic (Imperative) Navigation The usual rule of a Reach Hook: Only use directly only at the root level of component function. (e.g. using useRouter) useRouter has not just query that gives slug, it also has push() whose job is equivalent to Link component Starting point of project with some templates...