others2023-01-19
www.youtube.com
Tutorialstypescript

Remix Loaders are a great way to fetch data server-side before rendering the page. As of v1.10.0, you can use the useRevalidator hook to call these loaders whenever you want. In this video, Jon Meyers demonstrates how this can be paired with Supabase Auth and the onAuthStateChange hook to keep the UI in sync with the user's signed in state. GitHub repo: https://github.com/dijonmusters/remix-revalidation-on-demand To learn more about building an app with Remix and Supabase, check out this entirely free egghead course: https://egghead.io/courses/build-a-realtime-chat-app-with-remix-and-supabase-d36e2618?af=9qsk0a In this course we build a realtime chat application and learn about: šŸŖ managing sessions with cookies using the Supabase Auth Helpers šŸ¢ fetching data server-side šŸ§™ā€ā™€ļø generating TypeScript definitions with the Supabase CLI ā±ļø merging realtime updates with loader data 00:00 Introduction 01:10 Creating Remix app 02:07 Adding a loader function 03:00 Empty action hack 05:33 Calling active loaders with useRevalidator 06:23 Creating a Supabase project 08:25 Instantiating a Supabase client 10:55 Implementing Supabase Auth 13:37 Revalidating data onAuthStateChange 15:10 Summary Other helpful resources šŸ“œ Blog article: https://jonmeyers.io/blog/call-remix-loaders-on-demand-with-userevalidate šŸ‘‡ Get more from Jon šŸ‘‡ Twitter: https://twitter.com/jonmeyers_io Blog: https://jonmeyers.io/blog

Published on www.youtube.com

others / www.youtube.com2022-01-11

How to Debug Remix loaders and actions in VS Code

This video shows how to configure VS Code to debug your Remix loaders and actions. NOTE: You can now use the `debugger` statement instead of the external `debug()` function. I tried this before, but it didn't work. Not sure why it works now. You still can't set a breakpoint inside a route module, but you can add `debugger` statement and it will break there. You can then step through your code. I will be re-recording this video with this new info. Get the launch configuration here: https://rmx.fyi/debug

others / www.youtube.com2021-12-24

Remix Run - Introduction to HTTP Caching

HTTP Caching is a web fundamental every web developer should eventually learn. The quickest way to a slow website is to not understand caching and ofc, the best way to make your website fast is to take advantage of it. In this video we'll explain the basics of HTTP caching, how web browsers respond to it, and how CDNs take advantage of it, by building a bare-bones Node.js server and then quickly see how to specify caching headers in a Remix App.