home scroll deno

deno learning blog February 2023

Feb 11, 2023

Load notes from database when page is loaded:
useEffect hook:
https://reactjs.org/docs/hooks-effect.html

Feb 17, 2023

Difference between files in components versus in islands:
Buttons and functions called by clicking on a button don't work when in components.
The same code works when in a file in the islands folder.

Feb 18, 2023

Modularization

In order to make a reusable component such as popup window or debug element,
I need to be able to access data and functions inside the component.
https://examples.deno.land/import-export
Global variables?
https://reactgo.com/deno-global-variable/

Feb 23, 2023

I can use a global variable inside a jsx return function.
but how to trigger an update?
search: trigger event in react
https://codesandbox.io/s/kml7m2nn4r
search: access the jsx dom properties on a component
https://stackoverflow.com/questions/38093760/how-to-access-a-dom-element-in-react-what-is-the-equilvalent-of-document-getele
https://beta.reactjs.org/learn/sharing-state-between-components

Feb 27, 2023

"Lifting state up" works:
https://beta.reactjs.org/learn/sharing-state-between-components
Define the state in the calling function:
Declare in Body.tsx
const [debugMessage, setdebugMessage] = useState("123");
pass the state and the function to change it
<Debug_user start={1} initmessage="hello" setDebugMesssage={setDebugMesssage} />
<Debug start={1} initmessage="hello" setDebugMesssage={setDebugMesssage} debugMessage={debugMessage} />
and the element (div, textarea, etc.) will change in the called function!
Debug.tsx:
return (
<div >
{debugMessage}

Follow Me

discord