wedmaniac
wedmaniac15mo ago

Preact hooks doesn't get executed!

im having a little problem, the hooks from preact doesn't seem to run, canst see any errors in the terminal and the dependency is imported. Would love to get help:) import { useEffect } from "preact/hooks"; export default function MyPage() { useEffect(()=> { console.log("this message will not be executed:(") }, []); return ( blah blah blah ) }
14 Replies
ioB
ioB15mo ago
I recommend checking out the docs: https://fresh.deno.dev/docs/concepts/islands
Interactive islands | Fresh docs
Islands enable client side interactivity in Fresh. They are hydrated on the client in addition to being rendered on the server.
ioB
ioB15mo ago
All interaction must happen within islands
marvinh.
marvinh.15mo ago
What lino said. Fresh is a server first framework and it expects you to opt into client side code via islands
wedmaniac
wedmaniacOP15mo ago
@lino-levan @marvinh. Thank you! I'm looking into it! Would you be against a DM if I have further questions?
ioB
ioB15mo ago
Feel free to post in this thread! It's better for searchability in case others get stuck on the same problem.
wedmaniac
wedmaniacOP15mo ago
im trying to display a invoice and i log the data when fetching it from my supabase(as seen in the blue console screenshot). When the invoices are loaded i try to display it in the table but nothing is there. i have a button for dubug purposes that logs listOfInvoices.value to the console and when i do that it is displaying a empty array.
No description
No description
No description
No description
wedmaniac
wedmaniacOP15mo ago
How can it be that listOfInvoices has data when fetched but later when used inside of the html it's empty?
wedmaniac
wedmaniacOP15mo ago
I think i understand the problem, when fetching this error gets thrown into the browser console!
No description
wedmaniac
wedmaniacOP15mo ago
here is the invoicesUtils.ts
No description
wedmaniac
wedmaniacOP15mo ago
so the problem has to do with retrieving the supabase url and key
javi
javi15mo ago
you cant use Deno.* there. Either a call to an api in the routes/api/ folder, or a handler in that route
javi
javi15mo ago
this and this for reference
Creating a CRUD API | Fresh docs
Use HTTP CRUD methods to perform operations on resources. Learn how to use HTTP handlers to create a RESTful API.
Routes | Fresh docs
Routes are the basic building block of Fresh applications. They are used to define the behaviour the application when a given path is requested.
wedmaniac
wedmaniacOP15mo ago
Ahhh! I will need some time to understand it properly! Thank you!
javi
javi15mo ago
youre welcome!