KyleJune / deno-tailwind-ui-react-example

An example of how you can use Tailwind UI and React with Deno
20 stars 5 forks source link

Add react suspense example using react-query #19

Closed KyleJune closed 2 years ago

KyleJune commented 2 years ago

Closes https://github.com/KyleJune/deno-tailwind-ui-react-example/issues/5

I wanted to demonstrate react suspense working with server side rendering. This adds the post pages that use Suspense and react-query for fetching data used on the pages. The error boundaries only work in the browser. I added 2 fake posts to the post list page for testing what happens when you click on a page that gets an error in response to an api query. The new post form can be used to add new posts and will demonstrate error handling for the form. The api will return an error if the title or content are empty when you hit the submit button. If you click the error shown it will dismiss it.

There currently is an issue though. The server side rendering for posts is not working on deploy because deploy doesn't allow the deployed app to make calls to the deployed api. It blocks those api calls when made from the server with the error "508: Loop Detected (LOOP_DETECTED) Recursive requests to the same deployment cannot be processed."