Server-side search with Next.js 13 and server components

Adding debounce to stop fetching on every keystroke

Why do we have fetch on the server if we are already on the server?

External api. I reduced api string a bit too much for the animation (for all code to fit in) which indeed makes it confusing.

The actual API is external. Shortened it for the animation to fit in.

the only downside of this is that using `searchParams` will opt the page into dynamic rendering at the request time

Now you can also use form + server action + redirect and keep it a server component.

It’s better to wrap the input in a form and calling router.push() onSubmit on the form and call form.requestSubmit() when the input changes, So that using it can be progressively enhanced and work with/without JS

I love the format! Awesome work!

cool stuff I have 2 unrelated questions: 1. How did you create this animation? 2. Which theme is it?

I make animations with Apple Keynote Theme - Monokai